229 lines
6.2 KiB
HTML
229 lines
6.2 KiB
HTML
<html>
|
|
<head>
|
|
<title>ACME.js - A Root Project</title>
|
|
<meta charset="UTF-8" />
|
|
<style>
|
|
textarea {
|
|
width: 42em;
|
|
height: 10em;
|
|
}
|
|
/* need to word wrap the binary no space der */
|
|
.js-der-public,
|
|
.js-der-private {
|
|
white-space: pre-wrap; /* CSS3 */
|
|
white-space: -moz-pre-wrap; /* Firefox */
|
|
white-space: -pre-wrap; /* Opera <7 */
|
|
white-space: -o-pre-wrap; /* Opera 7 */
|
|
word-wrap: break-word; /* IE */
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>
|
|
@root/acme: Let's Encrypt for the Browser
|
|
</h1>
|
|
|
|
<p>
|
|
This is intended to be explored with your JavaScript console open.
|
|
</p>
|
|
<pre><code><script src="<a href="https://unpkg.com/@root/acme@3.0.0/dist/acme.js">https://unpkg.com/@root/acme@3.0.0/dist/acme.js</a>"></script></code></pre>
|
|
<pre><code><script src="<a href="https://unpkg.com/@root/acme@3.0.0/dist/acme.min.js">https://unpkg.com/@root/acme@3.0.0/dist/acme.min.js</a>"></script></code></pre>
|
|
<a href="https://git.rootprojects.org/root/acme.js">Documentation</a>
|
|
|
|
<h2>1. Keypair Generation</h2>
|
|
<form class="js-keygen">
|
|
<p>Key Type:</p>
|
|
<div>
|
|
<input type="radio" id="-ktyEC" name="kty" value="EC" checked />
|
|
<label for="-ktyEC">ECDSA</label>
|
|
<input type="radio" id="-ktyRSA" name="kty" value="RSA" />
|
|
<label for="-ktyRSA">RSA</label>
|
|
</div>
|
|
<div class="js-ec-opts">
|
|
<p>EC Options:</p>
|
|
<label for="-crv2"
|
|
><input
|
|
type="radio"
|
|
id="-crv2"
|
|
name="ec-crv"
|
|
value="P-256"
|
|
checked
|
|
/>P-256</label
|
|
>
|
|
<label for="-crv3"
|
|
><input
|
|
type="radio"
|
|
id="-crv3"
|
|
name="ec-crv"
|
|
value="P-384"
|
|
/>P-384</label
|
|
>
|
|
<!-- label for="-crv5"><input type="radio" id="-crv5"
|
|
name="ec-crv" value="P-521">P-521</label -->
|
|
</div>
|
|
<div class="js-rsa-opts" hidden>
|
|
<p>RSA Options:</p>
|
|
<label for="-modlen2"
|
|
><input
|
|
type="radio"
|
|
id="-modlen2"
|
|
name="rsa-len"
|
|
value="2048"
|
|
checked
|
|
/>2048</label
|
|
>
|
|
<label for="-modlen3"
|
|
><input
|
|
type="radio"
|
|
id="-modlen3"
|
|
name="rsa-len"
|
|
value="3072"
|
|
/>3072</label
|
|
>
|
|
<label for="-modlen5"
|
|
><input
|
|
type="radio"
|
|
id="-modlen5"
|
|
name="rsa-len"
|
|
value="4096"
|
|
/>4096</label
|
|
>
|
|
</div>
|
|
<button class="js-generate" hidden>Generate</button>
|
|
</form>
|
|
|
|
<h2>2. ACME Account</h2>
|
|
<form class="js-acme-account">
|
|
<label for="-acmeEmail">Email:</label>
|
|
<input
|
|
class="js-email"
|
|
type="email"
|
|
id="-acmeEmail"
|
|
value="john.doe@gmail.com"
|
|
/>
|
|
<br />
|
|
<label for="-acmeTos"
|
|
><input
|
|
class="js-tos"
|
|
name="tos"
|
|
type="checkbox"
|
|
id="-acmeTos"
|
|
checked
|
|
/>
|
|
Agree to Let's Encrypt Terms of Service</label
|
|
>
|
|
<br />
|
|
<button class="js-create-account" hidden>Create Account</button>
|
|
</form>
|
|
|
|
<h2>3. (optional) Certificate Signing Request</h2>
|
|
<form class="js-csr">
|
|
<label for="-acmeDomains">Domains:</label>
|
|
<input
|
|
class="js-domains"
|
|
type="text"
|
|
id="-acmeDomains"
|
|
value="example.com www.example.com"
|
|
/>
|
|
<br />
|
|
<button class="js-create-csr" hidden>Create CSR</button>
|
|
</form>
|
|
|
|
<h2>4. ACME Certificate Order</h2>
|
|
<form class="js-acme-order">
|
|
Challenge type:
|
|
<label for="-http01"
|
|
><input
|
|
type="radio"
|
|
id="-http01"
|
|
name="acme-challenge-type"
|
|
value="http-01"
|
|
checked
|
|
/>http-01</label
|
|
>
|
|
<label for="-dns01"
|
|
><input
|
|
type="radio"
|
|
id="-dns01"
|
|
name="acme-challenge-type"
|
|
value="dns-01"
|
|
/>dns-01</label
|
|
>
|
|
<br />
|
|
<label for="-skipDryrun"
|
|
><input
|
|
class="js-skip-dryrun"
|
|
name="skip-dryrun"
|
|
type="checkbox"
|
|
id="-skipDryrun"
|
|
checked
|
|
/>
|
|
Skip dry-run challenge</label
|
|
>
|
|
<br />
|
|
<button class="js-create-order" hidden>Create Order</button>
|
|
</form>
|
|
|
|
<div class="js-loading" hidden>Loading</div>
|
|
|
|
<details class="js-toc-jwk" hidden>
|
|
<summary>JWK Keypair</summary>
|
|
<pre><code class="js-jwk"> </code></pre>
|
|
</details>
|
|
<details class="js-toc-der-private" hidden>
|
|
<summary>DER Private Binary</summary>
|
|
<pre><code class="js-der-private"> </code></pre>
|
|
</details>
|
|
<details class="js-toc-der-public" hidden>
|
|
<summary>DER Public Binary</summary>
|
|
<pre><code class="js-der-public"> </code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-pkcs1-private" hidden>
|
|
<summary>PEM Private (base64-encoded PKCS1 DER)</summary>
|
|
<pre><code class="js-input-pem-pkcs1-private" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-sec1-private" hidden>
|
|
<summary>PEM Private (base64-encoded SEC1 DER)</summary>
|
|
<pre><code class="js-input-pem-sec1-private" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-pkcs8-private" hidden>
|
|
<summary>PEM Private (base64-encoded PKCS8 DER)</summary>
|
|
<pre><code class="js-input-pem-pkcs8-private" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-pkcs1-public" hidden>
|
|
<summary>PEM Public (base64-encoded PKCS1 DER)</summary>
|
|
<pre><code class="js-input-pem-pkcs1-public" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-spki-public" hidden>
|
|
<summary>PEM Public (base64-encoded SPKI/PKIX DER)</summary>
|
|
<pre><code class="js-input-pem-spki-public" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-acme-account-response" hidden>
|
|
<summary>ACME Account Request</summary>
|
|
<pre><code class="js-acme-account-response"> </code></pre>
|
|
</details>
|
|
<details class="js-toc-acme-order-response" hidden>
|
|
<summary>ACME Order Response</summary>
|
|
<pre><code class="js-acme-order-response"> </code></pre>
|
|
</details>
|
|
|
|
<br />
|
|
<p>
|
|
[Root](https://rootprojects.org) has built a collection of
|
|
lightweight, zero-dependency, libraries written in VanillaJS. They
|
|
are fast, tiny, and secure, using the native features of modern
|
|
browsers where possible. This means it's easy-to-use crypto in
|
|
kilobytes, not megabytes.
|
|
</p>
|
|
<br />
|
|
<footer>
|
|
View (git) source
|
|
<a href="https://git.rootprojects.org/root/acme.js">@root/acme</a>
|
|
</footer>
|
|
|
|
<!-- script src="../dist/acme.js"></script -->
|
|
<!-- script src="../dist/app.js"></script -->
|
|
<script src="./app.js"></script>
|
|
</body>
|
|
</html>
|