Let's Encrypt v2 (ACME draft 11) client for your browser. Companion to greenlock.js https://greenlock.domains

index.html 6.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
  1. <html>
  2. <head>
  3. <title>Greenlock&trade;</title>
  4. <meta property="og:image" content="https://greenlock.ppl.family/img/greenlock-mark-400x400.png" />
  5. </head>
  6. <body hidden>
  7. <img width="410px" src="img/greenlock-820x150.png">
  8. <div>
  9. <br>
  10. <h3>Greenlock&trade; - Instant, Free SSL Certificates via Let's Encrypt v2</h3>
  11. <br>
  12. <br>
  13. <br>
  14. </div>
  15. <!-- Step 1 Choose Domain(s) -->
  16. <form class="js-acme-form js-acme-form-domains">
  17. <h1><label>What's your domain?</label></h1>
  18. <h4>Certificates are valid for 90 days. Renewal is free :)</h4>
  19. <input class="js-acme-domains" type="text" placeholder="example.com,*.example.com" required>
  20. <br>
  21. <button type="submit">Next</button>
  22. <br>
  23. <br>
  24. <br>
  25. <label><input class="js-acme-api-type" name="acme-api-type" type="radio" value="v02" checked required>
  26. Production</label>
  27. <label><input class="js-acme-api-type" name="acme-api-type" type="radio" value="staging-v02" required>
  28. Testing</label>
  29. <br>
  30. <input class="js-acme-directory-url" type="url" placeholder="ACME directory url">
  31. </form>
  32. <!-- Step 2 Create Account -->
  33. <form class="js-acme-form js-acme-form-account">
  34. <h1><label>What's your email?</label></h1>
  35. <input class="js-acme-account-email" type="email" placeholder="john@doe.family" required>
  36. <br>
  37. <br>
  38. <label><input class="js-acme-account-tos" type="checkbox" required>
  39. Agree to <a class="js-acme-tos-url" target="acme-tos">Let's Encrypt&trade; Terms of Service</a>?</label>
  40. <br>
  41. <br>
  42. <label><input class="js-greenlock-account-tos" type="checkbox" required>
  43. Agree to <a class="js-gl-tos" target="_blank" href="./legal.html">Greenlock&trade; Terms of Service</a>?</label>
  44. <br>
  45. <br>
  46. <!--
  47. <a href="#">advanced (use existing account)</a>
  48. <br>
  49. <br>
  50. -->
  51. <button type="submit">Next</button>
  52. </form>
  53. <!-- Step 3 Set Challanges -->
  54. <form class="js-acme-form js-acme-form-challenges">
  55. <h1>How will you validate your domain?</h1>
  56. <br>
  57. <label><input class="js-acme-challenge-type" name="acme-challenge-type" type="radio" value="http-01" checked required>
  58. File Upload to HTTP Web Server</label>
  59. <br>
  60. <label><input class="js-acme-challenge-type" name="acme-challenge-type" type="radio" value="dns-01" required>
  61. TXT Records on DNS Name Server</label>
  62. <br>
  63. <div class="js-acme-challenges">
  64. <h2>Verify Domains &amp; Sub-Domains</h2>
  65. <table class="js-acme-table-http-01">
  66. <thead>
  67. <tr>
  68. <th>Hostname</th>
  69. <th>File Location</th>
  70. <th>File Contents</th>
  71. </tr>
  72. </thead>
  73. <tbody>
  74. <tr>
  75. <td>example.com</td>
  76. <td>.well-known/acme-challenge/xxx</td>
  77. <td>sec.ret</td>
  78. </tr>
  79. </tbody>
  80. </table>
  81. <table class="js-acme-table-dns-01">
  82. <thead>
  83. <tr>
  84. <th>Hostname</th>
  85. <th>TXT Host</th>
  86. <th>TXT Value</th>
  87. </tr>
  88. </thead>
  89. <tbody>
  90. <tr>
  91. <td>example.com</td>
  92. <td>_acme-challenge.example.com</td>
  93. <td>4A54</td>
  94. </tr>
  95. </tbody>
  96. </table>
  97. </div>
  98. <div class="js-acme-wildcard">
  99. <h2>Verify Wildcard Domains</h2>
  100. <table class="js-acme-table-wildcard">
  101. <thead>
  102. <tr>
  103. <th>Hostname</th>
  104. <th>TXT Host</th>
  105. <th>TXT Value</th>
  106. </tr>
  107. </thead>
  108. <tbody>
  109. <tr>
  110. <td>example.com</td>
  111. <td>_acme-challenge.example.com</td>
  112. <td>4A54</td>
  113. </tr>
  114. </tbody>
  115. </table>
  116. </div>
  117. <button type="submit">Next</button>
  118. </form>
  119. <!-- Step 4 Process Challanges -->
  120. <form class="js-acme-form js-acme-form-poll">
  121. Verifying Domains... (give us 5 seconds or so...)
  122. <!--
  123. <table class="js-acme-table-verifying">
  124. <thead>
  125. <tr>
  126. <th>Hostname</th>
  127. <th>Type</th>
  128. <th>Pass</th>
  129. </tr>
  130. </thead>
  131. <tbody>
  132. <tr>
  133. <td>example.com</td>
  134. <td>http-01</td>
  135. <td>-</td>
  136. </tr>
  137. </tbody>
  138. </table>
  139. <a href="#">advanced (use existing keypair for domain)</a>
  140. <button type="submit">Next</button>
  141. -->
  142. </form>
  143. <!-- Step 5 Get Certs -->
  144. <form class="js-acme-form js-acme-form-download">
  145. <div>
  146. <h2><label>privkey.pem</label></h2>
  147. <textarea cols="80" rows="10" class="js-privkey">-</textarea>
  148. </div>
  149. <div>
  150. <h2><label>fullchain.pem</label></h2>
  151. <textarea cols="80" rows="60" class="js-fullchain">-</textarea>
  152. </div>
  153. <div>
  154. <h3>node.js https server example</h3>
  155. <pre><code>'use strict';
  156. var https = require('https');
  157. var server = https.createServer({
  158. key: require('fs').readFileSync('./privkey.pem')
  159. , cert: require('fs').readFileSync('./fullchain.pem')
  160. }, function (req, res) {
  161. res.end("Hello, World!");
  162. }).listen(443, function () {
  163. console.log('Listening on', this.address());
  164. })
  165. </code></pre>
  166. </div>
  167. <!--
  168. TODO
  169. <label>cert.pem</label>
  170. <textarea class="js-cert">-</textarea>
  171. <label>chain.pem</label>
  172. <textarea class="js-chain">-</textarea>
  173. <button type="button">Download SSL Certificates</button>
  174. <br>
  175. <a href="#">Advanced (copy and paste)</a>
  176. <br>
  177. <button type="submit">Start Over</button>
  178. -->
  179. </form>
  180. <br>
  181. <br>
  182. <br>
  183. <div><small>
  184. <h3></h3>
  185. <a href="https://git.coolaj86.com/coolaj86/greenlock.html">View Source</a> (git)
  186. <!-- or
  187. <pre><code>git clone https://git.coolaj86.com/coolaj86/greenlock.html.git</code></pre>
  188. Or view the live site code (same as live-site branch):
  189. <pre><code>wget https://greenlock.ppl.family --mirror --convert-links --adjust-extension --page-requisites --no-parent</code></pre>
  190. </small></div>
  191. -->
  192. <script src="./js/bacme.js"></script>
  193. <script src="./js/app.js"></script>
  194. <script src="./js/pkijs.org/v1.3.33/common.js"></script>
  195. <script src="./js/pkijs.org/v1.3.33/asn1.js"></script>
  196. <script src="./js/pkijs.org/v1.3.33/x509_schema.js"></script>
  197. <script src="./js/pkijs.org/v1.3.33/x509_simpl.js"></script>
  198. <script src="./js/browser-csr/v1.0.0-alpha/csr.js"></script>
  199. </body>
  200. </html>