forked from coolaj86/bluecrypt-keypairs.js
no-acme (#10)
I’ll make the couple of fixed I figure the hard coded value was a good example of what input would be maybe it should be a placeholder instead or empty
This commit is contained in:
parent
e7f5376a45
commit
93e939e517
|
@ -0,0 +1,11 @@
|
||||||
|
# editorconfig.org
|
||||||
|
root = true
|
||||||
|
|
||||||
|
[*]
|
||||||
|
indent_style = space
|
||||||
|
indent_size = 2
|
||||||
|
tab_width = 2
|
||||||
|
end_of_line = lf
|
||||||
|
charset = utf-8
|
||||||
|
trim_trailing_whitespace = true
|
||||||
|
insert_final_newline = true
|
68
app.js
68
app.js
|
@ -43,6 +43,8 @@
|
||||||
$('.js-jwk').hidden = true;
|
$('.js-jwk').hidden = true;
|
||||||
$('.js-toc-der-public').hidden = true;
|
$('.js-toc-der-public').hidden = true;
|
||||||
$('.js-toc-der-private').hidden = true;
|
$('.js-toc-der-private').hidden = true;
|
||||||
|
$('.js-toc-jwk').hidden = true;
|
||||||
|
|
||||||
$$('.js-toc-pem').forEach(function ($el) {
|
$$('.js-toc-pem').forEach(function ($el) {
|
||||||
$el.hidden = true;
|
$el.hidden = true;
|
||||||
});
|
});
|
||||||
|
@ -50,8 +52,8 @@
|
||||||
$$('button').map(function ($el) { $el.disabled = true; });
|
$$('button').map(function ($el) { $el.disabled = true; });
|
||||||
var opts = {
|
var opts = {
|
||||||
kty: $('input[name="kty"]:checked').value
|
kty: $('input[name="kty"]:checked').value
|
||||||
, namedCurve: $('input[name="ec-crv"]:checked').value
|
, namedCurve: $('input[name="ec-crv"]:checked').value
|
||||||
, modulusLength: $('input[name="rsa-len"]:checked').value
|
, modulusLength: $('input[name="rsa-len"]:checked').value
|
||||||
};
|
};
|
||||||
var then = Date.now();
|
var then = Date.now();
|
||||||
console.log('opts', opts);
|
console.log('opts', opts);
|
||||||
|
@ -109,7 +111,69 @@
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$('form.js-keysign').addEventListener('submit', function (ev) {
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
$('.js-pem-loading').hidden = false;
|
||||||
|
$('.js-toc-jws').hidden = true;
|
||||||
|
$('.js-toc-jwt').hidden = true;
|
||||||
|
$$('input').map(function ($el) { $el.disabled = true; });
|
||||||
|
$$('button').map(function ($el) { $el.disabled = true; });
|
||||||
|
|
||||||
|
try {
|
||||||
|
|
||||||
|
|
||||||
|
var opts = {
|
||||||
|
jwk: JSON.parse($('textarea[name="jwk"]').value),
|
||||||
|
claims: {
|
||||||
|
exp: "1h",
|
||||||
|
iss: document.getElementById(`-acmeDomains`).value
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
Keypairs.signJwt(opts).then(function (msg) {
|
||||||
|
document.getElementById(`sign-error`).innerText = null;
|
||||||
|
$('.js-jwt').innerText = msg;
|
||||||
|
$('.js-toc-jwt').hidden = false;
|
||||||
|
var msgArr = msg.split(".")
|
||||||
|
var protected64 = msgArr[0]
|
||||||
|
var payload64 = msgArr[1]
|
||||||
|
var signature = msgArr[2]
|
||||||
|
var signedMsg = {
|
||||||
|
protected: protected64
|
||||||
|
, payload: payload64
|
||||||
|
, signature
|
||||||
|
};
|
||||||
|
$('.js-jws').innerText = JSON.stringify(signedMsg, null, 2);
|
||||||
|
$('.js-toc-jws').hidden = false;
|
||||||
|
$('.js-pem-loading').hidden = true;
|
||||||
|
$$('input').map(function ($el) { $el.disabled = false; });
|
||||||
|
$$('button').map(function ($el) { $el.disabled = false; });
|
||||||
|
}).catch(function (error) {
|
||||||
|
document.getElementById(`sign-error`).innerText = error.message
|
||||||
|
$('.js-pem-loading').hidden = true;
|
||||||
|
$$('input').map(function ($el) { $el.disabled = false; });
|
||||||
|
$$('button').map(function ($el) { $el.disabled = false; });
|
||||||
|
})
|
||||||
|
} catch (error) {
|
||||||
|
document.getElementById(`sign-error`).innerText = error.message
|
||||||
|
$('.js-pem-loading').hidden = true;
|
||||||
|
$$('input').map(function ($el) { $el.disabled = false; });
|
||||||
|
$$('button').map(function ($el) { $el.disabled = false; });
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
$('.js-generate').hidden = false;
|
$('.js-generate').hidden = false;
|
||||||
|
$('.js-sign').hidden = false;
|
||||||
|
$('textarea[name="jwk"]').value = JSON.stringify({
|
||||||
|
"crv": "P-256",
|
||||||
|
"d": "LImWxqqTHbP3LHQfqscDSUzf_uNePGqf9U6ETEcO5Ho",
|
||||||
|
"kty": "EC",
|
||||||
|
"x": "vdjQ3T6VBX82LIKDzepYgRsz3HgRwp83yPuonu6vqos",
|
||||||
|
"y": "IUkEXtAMnppnV1A19sE2bJhUo4WPbq6EYgWxma4oGyg",
|
||||||
|
"kid": "MnfJYyS9W5gUjrJLdn8ePMzik8ZJz2qc-VZmKOs_oCw"
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
window.addEventListener('load', run);
|
window.addEventListener('load', run);
|
||||||
|
|
117
index.html
117
index.html
|
@ -1,11 +1,12 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
|
||||||
<title>BlueCrypt</title>
|
<head>
|
||||||
<style>
|
<title>BlueCrypt</title>
|
||||||
textarea {
|
<style>
|
||||||
width: 42em;
|
textarea {
|
||||||
height: 10em;
|
width: 42em;
|
||||||
}
|
height: 10em;
|
||||||
|
}
|
||||||
/* need to word wrap the binary no space der */
|
/* need to word wrap the binary no space der */
|
||||||
.js-der-public, .js-der-private{
|
.js-der-public, .js-der-private{
|
||||||
white-space: pre-wrap; /* CSS3 */
|
white-space: pre-wrap; /* CSS3 */
|
||||||
|
@ -29,10 +30,10 @@
|
||||||
<pre><code><script src="<a href="https://rootprojects.org/keypairs/bluecrypt-keypairs.min.js">https://rootprojects.org/keypairs/bluecrypt-keypairs.min.js</a>"></script></code></pre>
|
<pre><code><script src="<a href="https://rootprojects.org/keypairs/bluecrypt-keypairs.min.js">https://rootprojects.org/keypairs/bluecrypt-keypairs.min.js</a>"></script></code></pre>
|
||||||
<a href="https://git.rootprojects.org/root/bluecrypt-keypairs.js">Documentation</a>
|
<a href="https://git.rootprojects.org/root/bluecrypt-keypairs.js">Documentation</a>
|
||||||
|
|
||||||
<h2>Keypair Generation</h2>
|
<h2>Keypair Generation</h2>
|
||||||
<form class="js-keygen">
|
<form class="js-keygen">
|
||||||
<p>Key Type:</p>
|
<p>Key Type:</p>
|
||||||
<div>
|
<div>
|
||||||
<input type="radio" id="-ktyEC"
|
<input type="radio" id="-ktyEC"
|
||||||
name="kty" value="EC" checked>
|
name="kty" value="EC" checked>
|
||||||
<label for="-ktyEC">ECDSA</label>
|
<label for="-ktyEC">ECDSA</label>
|
||||||
|
@ -58,43 +59,67 @@
|
||||||
<label for="-modlen5"><input type="radio" id="-modlen5"
|
<label for="-modlen5"><input type="radio" id="-modlen5"
|
||||||
name="rsa-len" value="4096">4096</label>
|
name="rsa-len" value="4096">4096</label>
|
||||||
</div>
|
</div>
|
||||||
<button class="js-generate" hidden>Generate</button>
|
<button class="js-generate" hidden>Generate</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<div class="js-loading" hidden>Loading</div>
|
<div class="js-loading" hidden>Loading</div>
|
||||||
|
|
||||||
<details class="js-toc-jwk" hidden>
|
<details class="js-toc-jwk" hidden>
|
||||||
<summary>JWK Keypair</summary>
|
<summary>JWK Keypair</summary>
|
||||||
<pre><code class="js-jwk"> </code></pre>
|
<pre><code class="js-jwk"> </code></pre>
|
||||||
</details>
|
</details>
|
||||||
<details class="js-toc-der-private" hidden>
|
<details class="js-toc-der-private" hidden>
|
||||||
<summary>DER Private Binary</summary>
|
<summary>DER Private Binary</summary>
|
||||||
<pre><code class="js-der-private"> </code></pre>
|
<pre><code class="js-der-private"> </code></pre>
|
||||||
</details>
|
</details>
|
||||||
<details class="js-toc-der-public" hidden>
|
<details class="js-toc-der-public" hidden>
|
||||||
<summary>DER Public Binary</summary>
|
<summary>DER Public Binary</summary>
|
||||||
<pre><code class="js-der-public"> </code></pre>
|
<pre><code class="js-der-public"> </code></pre>
|
||||||
</details>
|
</details>
|
||||||
<details class="js-toc-pem js-toc-pem-pkcs1-private" hidden>
|
<details class="js-toc-pem js-toc-pem-pkcs1-private" hidden>
|
||||||
<summary>PEM Private (base64-encoded PKCS1 DER)</summary>
|
<summary>PEM Private (base64-encoded PKCS1 DER)</summary>
|
||||||
<pre><code class="js-input-pem-pkcs1-private" ></code></pre>
|
<pre><code class="js-input-pem-pkcs1-private" ></code></pre>
|
||||||
</details>
|
</details>
|
||||||
<details class="js-toc-pem js-toc-pem-sec1-private" hidden>
|
<details class="js-toc-pem js-toc-pem-sec1-private" hidden>
|
||||||
<summary>PEM Private (base64-encoded SEC1 DER)</summary>
|
<summary>PEM Private (base64-encoded SEC1 DER)</summary>
|
||||||
<pre><code class="js-input-pem-sec1-private" ></code></pre>
|
<pre><code class="js-input-pem-sec1-private" ></code></pre>
|
||||||
</details>
|
</details>
|
||||||
<details class="js-toc-pem js-toc-pem-pkcs8-private" hidden>
|
<details class="js-toc-pem js-toc-pem-pkcs8-private" hidden>
|
||||||
<summary>PEM Private (base64-encoded PKCS8 DER)</summary>
|
<summary>PEM Private (base64-encoded PKCS8 DER)</summary>
|
||||||
<pre><code class="js-input-pem-pkcs8-private" ></code></pre>
|
<pre><code class="js-input-pem-pkcs8-private" ></code></pre>
|
||||||
</details>
|
</details>
|
||||||
<details class="js-toc-pem js-toc-pem-pkcs1-public" hidden>
|
<details class="js-toc-pem js-toc-pem-pkcs1-public" hidden>
|
||||||
<summary>PEM Public (base64-encoded PKCS1 DER)</summary>
|
<summary>PEM Public (base64-encoded PKCS1 DER)</summary>
|
||||||
<pre><code class="js-input-pem-pkcs1-public" ></code></pre>
|
<pre><code class="js-input-pem-pkcs1-public" ></code></pre>
|
||||||
</details>
|
</details>
|
||||||
<details class="js-toc-pem js-toc-pem-spki-public" hidden>
|
<details class="js-toc-pem js-toc-pem-spki-public" hidden>
|
||||||
<summary>PEM Public (base64-encoded SPKI/PKIX DER)</summary>
|
<summary>PEM Public (base64-encoded SPKI/PKIX DER)</summary>
|
||||||
<pre><code class="js-input-pem-spki-public" ></code></pre>
|
<pre><code class="js-input-pem-spki-public" ></code></pre>
|
||||||
</details>
|
</details>
|
||||||
|
|
||||||
|
<h2>Signing</h2>
|
||||||
|
<div class="errors" id="sign-error"></div>
|
||||||
|
<form class="js-keysign">
|
||||||
|
<div>
|
||||||
|
<label for="-acmeDomains">Domains:</label>
|
||||||
|
<input class="js-domains" type="text" id="-acmeDomains" value="example.com www.example.com">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="jwk">JWK:</label>
|
||||||
|
<br>
|
||||||
|
<textarea id="jwk" name="jwk"></textarea>
|
||||||
|
</div>
|
||||||
|
<button class="js-sign" hidden>Sign</button>
|
||||||
|
</form>
|
||||||
|
<div class="js-pem-loading" hidden>Loading</div>
|
||||||
|
<details class="js-toc-jws" hidden>
|
||||||
|
<summary>JWS </summary>
|
||||||
|
<pre><code class="js-jws"></code></pre>
|
||||||
|
</details>
|
||||||
|
<details class="js-toc-jwt" hidden>
|
||||||
|
<summary>JWT </summary>
|
||||||
|
<pre><code class="js-jwt"></code></pre>
|
||||||
|
</details>
|
||||||
|
|
||||||
<br>
|
<br>
|
||||||
<p>Bluecrypt™ is a collection of lightweight, zero-dependency, libraries written in VanillaJS.
|
<p>Bluecrypt™ is a collection of lightweight, zero-dependency, libraries written in VanillaJS.
|
||||||
|
|
Loading…
Reference in New Issue