lab/cacme/app/view/index.html
2024-08-05 22:57:28 +08:00

183 lines
6.2 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta content="width=device-width, initial-scale=1" name="viewport">
<meta name="generator" content="pandoc" />
<title>Center ACME Auto SSL</title>
<style type="text/css">code{white-space: pre;}</style>
<link rel="stylesheet" href="normal.css" type="text/css" />
<link rel="stylesheet" href="sakura.css" type="text/css" />
<style>
body {
height: 100%;
}
.wrapper{
position:relative;
box-sizing:border-box;
min-height:100%;
padding-bottom:35px;
}
.footer{
position:absolute;
bottom:0;
left:0;
right:0;
height:35px;
}
</style>
</head>
<body>
<div class="wrapper">
<h1 id="sakura-a-minimal-classless-css-framework-theme.">
Center ACME Auto SSL(CAAS) by Laysense
</h1>
<p>[由 <a href="https://lab.laysense.cn/">来笙实验室</a> 出品]</p>
<blockquote>
<p>CAAS将打破你对ssl和acme的认识现在只需要设置一次302重定向就可以直接申请到证书辣</p>
</blockquote>
<button id="back" onclick="skipto('step1')">🔃重设</button>
<div id="step1" style="display: none;">
<center>
<h3>Step1:输入你需要申请SSL的域名</h3>
<input id="domain" type="url" /><br />
<h3>以及你的邮箱</h3>
<input id="email" type="email" />
<button onclick="skipto('step2')">👉下一步</button>
</div>
<div id="step2" style="display: none;">
<center>
<h3>Step2:选择一种证书类型</h3>
<ul>
<li>
<h5>正式使用、公共网站:</h5>
<button onclick="choose('R3')" style="padding:8px;">📃R3(3个月)</button><br>
(即Let's Encrypt)
</li><hr />
<li>
<h5>实验用途、私有网络:</h5>
<button onclick="skipto('step99')" style="background: linear-gradient(135deg, #c850c0, #4158d0);padding:15px;">💎来笙豪华娱乐证书(10年)</button>
</li>
<li>
<h5>5050net、fwnet内部使用</h5>
<button onclick="skipto('step999')">🌐FWNET证书</button>
</li>
</ul>
</center>
</div>
<div id="step3" style="display: none;">
<div width="50%" style="background-color: beige;">
当前证书品牌:<span class="showtype"></span> 域名:<span class="showdomain"></span>
</div>
<center>
<h3>最后一步!</h3>
<p>请将<pre>http://<span class="showdomain"></span>/.well-known/acme-challenge/</pre>重定向到 <pre>http://httpacme.lab.laysense.cn/acme/<span class="showdomain"></span></pre></p>
<button id="checkbutton" onclick="check()">😀我搞定了!</button><br />
<pre id="checknotice" style="background-color: antiquewhite;display: none;"></pre>
<hr><a>🧐不会操作? 查看文档!</a>
</center>
</div>
<div id="step4" style="display: none;">
<div width="50%" style="background-color: beige;">
当前证书品牌:<span class="showtype"></span> 域名:<span class="showdomain"></span>
</div>
<center>
<h3>😍激动人心的时刻</h3>
<button style="background: linear-gradient(135deg, #ff9a9e, #fad0c4);padding:12px;" onclick="skipto('step999')">获取证书</button>
</center>
</div>
<div id="step99" style="display: none;">
<center>
<h3>😳诶呀,所选证书品牌暂时不可用</h3>
<button id="back" onclick="skipto('step2')">🔃重选证书</button>
</center>
</div>
<div id="step999" style="display: none;">
<center>
<h3>😳诶呀,该证书品牌拒绝新的申请</h3>
<button id="back" onclick="skipto('step2')">🔃重选证书</button>
</center>
</div>
<hr />
<div class="footer">
<a>📥下载来笙根证书</a> <a href="https://5050net.cn/fwnet-ecdsa-root-ca-1.crt" target="_blank">📥下载FWNET根证书</a>
<a style="float: right;">📄文档</a>
<a style="float: right;">⏰自动续期</a>
</div>
</div>
<script src="jquery-3.7.1.js"></script>
<script>
changestep();
window.onhashchange=function(){
changestep();
}
function skipto(whichstep){
location.hash=whichstep;
changestep();
}
function choose(type){
window.certtype=type;
location.hash='step3';
changestep();
}
function changestep(){
var domain=$('#domain').val();
var step=location.hash;
if(typeof(step) == "undefined" || !step || !domain || typeof(domain) == "undefined"){
step='#step1';
}else if(step!='#step2'&& !window.certtype || typeof(window.certtype) == "undefined"){
step='#step2';
}else{
$('.showdomain').html(domain);
$('.showtype').html(window.certtype);
}
if(step=='#step4'&&(window.check!='pass'||!window.check)){
step='#step3';
}
//console.log(step);
$(window.laststep).hide();
$(step).show();
window.laststep=step;
}
function check(){
var domain=$('#domain').val();
var email=$('#email').val();
$.ajax({
type: "POST",
url: '/apply/check',
data: {'domain':domain,'email':email,'cert':window.certtype},
async: true,
dataType: 'json',
cache: false,
beforeSend: function () {
$('#checkbutton').attr("disabled","disabled");
$('#checkbutton').hide();
$('#checknotice').show();
$('#checknotice').html('📑检查中,请稍等');
},
success: function (data) {
if (data.code == 200) {
$('#checknotice').html('已通过校验');
changestep('step4');
window.check='pass';
} else {
$('#checkbutton').show();
$('#checknotice').html('校验未通过:'+data.msg);
$('#checkbutton').removeAttr("disabled");
}
},
clearForm: true,
resetForm: false
});
}
</script>
</body>
</html>