Skip to content

Commit

Permalink
Complete implementation and tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@gnarea
gnarea committed Oct 5, 2021
1 parent 77e4f53 commit 699ac6e
Show file tree
Hide file tree
Showing 8 changed files with 996 additions and 1,037 deletions.
393 changes: 193 additions & 200 deletions examples/HowToEncryptCMSviaKey/CMSEnvelopedExample.html
View file
Original file line number Diff line number Diff line change
@@ -1,200 +1,193 @@
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>CMS Enveloped Example</title>

<script type="application/javascript" src="../../node_modules/babel-polyfill/dist/polyfill.js"></script>
<script type="text/javascript" src="bundle.js"></script>

<style type="text/css">
body{background:#EFEFEF;font:normal 14px/16px Helvetica, Arial, sans-serif;}
.wrapper{
width:600px;
margin:50px auto;
padding:50px;
border:solid 2px #CCC;
border-radius:10px;
-webkit-border-radius:10px;
box-shadow:0 0 12px 3px #CDCDCD;
-webkit-box-shadow:0 0 12px 3px #CDCDCD;
background:#FFF;
}
label{
font:bold 16px/20px Helvetica, Arial, sans-serif;
margin:0 0 8px;
}
textarea{
width:500px;
border:solid 1px #999;
border-radius:5px;
-webkit-border-radius:5px;
height:340px;
font:normal 12px/15px monospace;
display:block;
margin:0 0 12px;
box-shadow:0 0 5px 5px #EFEFEF inset;
-webkit-box-shadow:0 0 5px 5px #EFEFEF inset;
padding:20px;
resize: none;
}
a{
display:inline-block;
padding:5px 15px;
background:#ACD0EC;
border:solid 1px #4C6181;
color:#000;
font:normal 14px/16px Helvetica, Arial, sans-serif;
}
a:hover{
background:#DAEBF8;
cursor:pointer;
}
.header-block {
margin-top:30px;
font:bold 16px/20px Helvetica, Arial, sans-serif;
}
.border-block{
border:solid 2px #999;
border-radius:5px;
-webkit-border-radius:5px;
margin:10px 0 0;
padding:20px 30px;
background:#F0F4FF;
}
.border-block h2{
margin:0 0 16px;
font:bold 22px/24px Helvetica, Arial, sans-serif;
}
.border-block p{
margin:0 0 12px;
}
.border-block p .type{
font-weight:bold;
display:inline-block;
width:176px;
}
.border-block .two-col{
overflow:hidden;
margin:0 0 16px;
}
.border-block .two-col .subject{
width:180px;
font-weight:bold;
margin:0 0 12px;
float:left;
}
.border-block .two-col #cert-attributes{
margin:0;
padding:0;
float:left;
list-style:none;
}
.border-block .two-col #cert-attributes li p{
margin:0;
}
.border-block .two-col #cert-attributes li p span{
width:40px;
display:inline-block;
margin:0 0 5px;
}
.border-block .two-col #cert-exten{
overflow:hidden;
padding:0 0 0 17px;
margin:0;
list-style-type:square;
}
table {
border:solid;
border-collapse:collapse;
border-color:black;
}
th {
text-align:center;
background: #ccc;
padding: 5px;
border: 1px solid black;
}
td {
padding: 5px;
border: 1px solid black;
}
</style>
</head>

<body>
<div class="wrapper">
<p class="header-block">Put existing data or create new X.509 certificate and private key</p>
<div id="output_div" class="border-block">
<p>
<label for="hash_alg" style="font-weight:bold">Hashing algorithm:</label>
<select id="hash_alg" onchange="handleHashAlgOnChange()">
<option value="alg_SHA1">SHA-1</option>
<option value="alg_SHA256">SHA-256</option>
<option value="alg_SHA384">SHA-384</option>
<option value="alg_SHA512">SHA-512</option>
</select>
</p>
<p>
<label for="sign_alg" style="font-weight:bold">Signature algorithm:</label>
<select id="sign_alg" onchange="handleSignAlgOnChange()">
<option value="alg_RSA15">RSASSA-PKCS1-v1_5</option>
<option value="alg_RSA2">RSA-PSS</option>
<option value="alg_ECDSA">ECDSA</option>
</select>
</p>
<p>
<a onclick="createCertificate();">Create</a>
</p>
<label for="new_signed_data" style="font-weight:bold;float:left;">BASE-64 encoded certificate:</label>
<textarea id="new_signed_data">&lt; Encoded certificate must be put here &gt;</textarea>
<label for="pkcs8_key" style="font-weight:bold;float:left;">BASE-64 encoded PKCS#8 private key:</label>
<textarea id="pkcs8_key">&lt; PKCS#8 private key must be put here &gt;</textarea>
</div>
</div>
<div class="wrapper">
<p class="header-block">Work with CMS Enveloped data</p>
<div class="border-block">
<label for="content" style="font-weight:bold;float:left;">Content to encrypt:</label>
<textarea id="content">&lt; Put input data here &gt;</textarea>
<p>
<label for="content_enc_alg" style="font-weight:bold">Content encryption algorithm:</label>
<select id="content_enc_alg" onchange="handleEncAlgOnChange()">
<option value="alg_CBC">AES-CBC</option>
<option value="alg_GCM">AES-GCM</option>
</select>
</p>
<p>
<label for="content_enc_alg_len" style="font-weight:bold">Content encryption algorithm length:</label>
<select id="content_enc_alg_len" onchange="handleEncLenOnChange()">
<option value="len_128">128</option>
<!-- Currently in Google Chrome AES 192 bit keys are not supported
<option value="len_192">192</option>
-->
<option value="len_256">256</option>
</select>
</p>
<p>
<label for="oaep_hash_alg" style="font-weight:bold">RSA-OAEP Hashing Algorithm:</label>
<select id="oaep_hash_alg" onchange="handleOAEPHashAlgOnChange()">
<option value="alg_SHA1">SHA-1</option>
<option value="alg_SHA256">SHA-256</option>
<option value="alg_SHA384">SHA-384</option>
<option value="alg_SHA512">SHA-512</option>
</select>
</p>
<p>
<a onclick="envelopedEncrypt();">Encrypt</a>
</p>
<label for="encrypted_content" style="font-weight:bold;float:left;">BASE-64 encoded encrypted content:</label>
<textarea id="encrypted_content">&lt; Put encrypted content here &gt;</textarea>
<p>
<a onclick="envelopedDecrypt();">Decrypt</a>
</p>
<label for="decrypted_content" style="font-weight:bold;float:left;">Decrypted content:</label>
<textarea id="decrypted_content">&lt; Decrypted content will be put here &gt;</textarea>
</div>
</div>
</body>
</html>
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>CMS Enveloped Example</title>

<script type="application/javascript" src="../../node_modules/babel-polyfill/dist/polyfill.js"></script>
<script type="text/javascript" src="bundle.js"></script>

<style type="text/css">
body{background:#EFEFEF;font:normal 14px/16px Helvetica, Arial, sans-serif;}
.wrapper{
width:600px;
margin:50px auto;
padding:50px;
border:solid 2px #CCC;
border-radius:10px;
-webkit-border-radius:10px;
box-shadow:0 0 12px 3px #CDCDCD;
-webkit-box-shadow:0 0 12px 3px #CDCDCD;
background:#FFF;
}
label{
font:bold 16px/20px Helvetica, Arial, sans-serif;
margin:0 0 8px;
}
textarea{
width:500px;
border:solid 1px #999;
border-radius:5px;
-webkit-border-radius:5px;
height:340px;
font:normal 12px/15px monospace;
display:block;
margin:0 0 12px;
box-shadow:0 0 5px 5px #EFEFEF inset;
-webkit-box-shadow:0 0 5px 5px #EFEFEF inset;
padding:20px;
resize: none;
}
a{
display:inline-block;
padding:5px 15px;
background:#ACD0EC;
border:solid 1px #4C6181;
color:#000;
font:normal 14px/16px Helvetica, Arial, sans-serif;
}
a:hover{
background:#DAEBF8;
cursor:pointer;
}
.header-block {
margin-top:30px;
font:bold 16px/20px Helvetica, Arial, sans-serif;
}
.border-block{
border:solid 2px #999;
border-radius:5px;
-webkit-border-radius:5px;
margin:10px 0 0;
padding:20px 30px;
background:#F0F4FF;
}
.border-block h2{
margin:0 0 16px;
font:bold 22px/24px Helvetica, Arial, sans-serif;
}
.border-block p{
margin:0 0 12px;
}
.border-block p .type{
font-weight:bold;
display:inline-block;
width:176px;
}
.border-block .two-col{
overflow:hidden;
margin:0 0 16px;
}
.border-block .two-col .subject{
width:180px;
font-weight:bold;
margin:0 0 12px;
float:left;
}
.border-block .two-col #cert-attributes{
margin:0;
padding:0;
float:left;
list-style:none;
}
.border-block .two-col #cert-attributes li p{
margin:0;
}
.border-block .two-col #cert-attributes li p span{
width:40px;
display:inline-block;
margin:0 0 5px;
}
.border-block .two-col #cert-exten{
overflow:hidden;
padding:0 0 0 17px;
margin:0;
list-style-type:square;
}
table {
border:solid;
border-collapse:collapse;
border-color:black;
}
th {
text-align:center;
background: #ccc;
padding: 5px;
border: 1px solid black;
}
td {
padding: 5px;
border: 1px solid black;
}
</style>
</head>

<body>
<div class="wrapper">
<p class="header-block">Enter existing private key or generate one</p>
<div id="output_div" class="border-block">
<p>
<label for="curve_name" style="font-weight:bold">Key agreement algorithm:</label>
<select id="curve_name" onchange="handleKeyAgreeAlgorithmOnChange()">
<option value="ecdh_p256">ECDH P-256</option>
<option value="ecdh_p384">ECDH P-384</option>
<option value="ecdh_p521">ECDH P-521</option>
</select>
</p>
<p>
<a onclick="createKeyPair();">Create</a>
</p>
<label for="pkcs8_key" style="font-weight:bold;float:left;">BASE-64 encoded PKCS#8 private key:</label>
<textarea id="pkcs8_key">&lt; PKCS#8 private key must be put here &gt;</textarea>
<label for="pkcs8_key_pub" style="font-weight:bold;float:left;">BASE-64 encoded PKCS#8 public key:</label>
<textarea id="pkcs8_key_pub">&lt; PKCS#8 public key must be put here &gt;</textarea>
<label for="pkcs8_key_id" style="font-weight:bold;float:left;">BASE-64 encoded key pair id:</label>
<textarea id="pkcs8_key_id">&lt; Encoded key id must be put here &gt;</textarea>
</div>
</div>
<div class="wrapper">
<p class="header-block">Work with CMS Enveloped data</p>
<div class="border-block">
<label for="content" style="font-weight:bold;float:left;">Content to encrypt:</label>
<textarea id="content">&lt; Put input data here &gt;</textarea>
<p>
<label for="content_enc_alg" style="font-weight:bold">Content encryption algorithm:</label>
<select id="content_enc_alg" onchange="handleEncAlgOnChange()">
<option value="alg_CBC">AES-CBC</option>
<option value="alg_GCM">AES-GCM</option>
</select>
</p>
<p>
<label for="content_enc_alg_len" style="font-weight:bold">Content encryption algorithm length:</label>
<select id="content_enc_alg_len" onchange="handleEncLenOnChange()">
<option value="len_128">128</option>
<!-- Currently in Google Chrome AES 192 bit keys are not supported
<option value="len_192">192</option>
-->
<option value="len_256">256</option>
</select>
</p>
<p>
<label for="oaep_hash_alg" style="font-weight:bold">KDF Hashing Algorithm:</label>
<select id="oaep_hash_alg" onchange="handleOAEPHashAlgOnChange()">
<option value="alg_SHA1">SHA-1</option>
<option value="alg_SHA256">SHA-256</option>
<option value="alg_SHA384">SHA-384</option>
<option value="alg_SHA512">SHA-512</option>
</select>
</p>
<p>
<a onclick="envelopedEncrypt();">Encrypt</a>
</p>
<label for="encrypted_content" style="font-weight:bold;float:left;">BASE-64 encoded encrypted content:</label>
<textarea id="encrypted_content">&lt; Put encrypted content here &gt;</textarea>
<p>
<a onclick="envelopedDecrypt();">Decrypt</a>
</p>
<label for="decrypted_content" style="font-weight:bold;float:left;">Decrypted content:</label>
<textarea id="decrypted_content">&lt; Decrypted content will be put here &gt;</textarea>
</div>
</div>
</body>
</html>
Loading

0 comments on commit 699ac6e

Please sign in to comment.