update 2
This commit is contained in:
parent
afd625367d
commit
0380400bf0
59
backEnd/qr/410.html
Normal file
59
backEnd/qr/410.html
Normal file
@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
|
||||
<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
|
||||
<title>二维码已失效</title>
|
||||
<style type="text/css">
|
||||
body{height:100%;width:100%;margin:0; padding:0; font-size:14px; font-family:"微软雅黑",Arial, Helvetica, sans-serif;color: #333;}
|
||||
img{ border:0;outline: none;}
|
||||
body {
|
||||
background: #33065b;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
.bg {
|
||||
display: block;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom:0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
.title {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
font-size: 1rem;
|
||||
color: #fff;
|
||||
margin-top: 4rem;
|
||||
}
|
||||
.content {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
font-size: .625rem;
|
||||
color:#fff;
|
||||
margin-top:0.3rem;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
//px2rem
|
||||
window.onresize = setHtmlFontSize
|
||||
function setHtmlFontSize () {
|
||||
const htmlWidth = document.documentElement.clientWidth || document.body.clientWidth
|
||||
const htmlDom = document.getElementsByTagName('html')[0]
|
||||
if(htmlWidth >= 500) htmlDom.style.fontSize = 500 / 10 + 'px'
|
||||
else htmlDom.style.fontSize = htmlWidth / 10 + 'px'
|
||||
}
|
||||
setHtmlFontSize();
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<img class="bg" src="https://gss0.baidu.com/9vo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/b7003af33a87e950544a28181f385343fbf2b461.jpg" alt="">
|
||||
<div class="title">抱歉，</div>
|
||||
<div class="content">该二维码已失效</div>
|
||||
</body>
|
||||
</html>
|
||||
59
backEnd/qr/500.html
Normal file
59
backEnd/qr/500.html
Normal file
@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
|
||||
<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
|
||||
<title>服务器开小差了</title>
|
||||
<style type="text/css">
|
||||
body{height:100%;width:100%;margin:0; padding:0; font-size:14px; font-family:"微软雅黑",Arial, Helvetica, sans-serif;color: #333;}
|
||||
img{ border:0;outline: none;}
|
||||
body {
|
||||
background: #33065b;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
.bg {
|
||||
display: block;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom:0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
.title {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
font-size: 1rem;
|
||||
color: #fff;
|
||||
margin-top: 4rem;
|
||||
}
|
||||
.content {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
font-size: .625rem;
|
||||
color:#fff;
|
||||
margin-top:0.3rem;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
//px2rem
|
||||
window.onresize = setHtmlFontSize
|
||||
function setHtmlFontSize () {
|
||||
const htmlWidth = document.documentElement.clientWidth || document.body.clientWidth
|
||||
const htmlDom = document.getElementsByTagName('html')[0]
|
||||
if(htmlWidth >= 500) htmlDom.style.fontSize = 500 / 10 + 'px'
|
||||
else htmlDom.style.fontSize = htmlWidth / 10 + 'px'
|
||||
}
|
||||
setHtmlFontSize();
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<img class="bg" src="https://gss0.baidu.com/9vo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/b7003af33a87e950544a28181f385343fbf2b461.jpg" alt="">
|
||||
<div class="title">哎呀~</div>
|
||||
<div class="content">服务器开小差了呢</div>
|
||||
</body>
|
||||
</html>
|
||||
BIN
backEnd/qr/img/sprite1.png
Normal file
BIN
backEnd/qr/img/sprite1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
backEnd/qr/img/sprite2.png
Normal file
BIN
backEnd/qr/img/sprite2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
backEnd/qr/img/sprite3.png
Normal file
BIN
backEnd/qr/img/sprite3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
444
backEnd/qr/qrcode.html
Normal file
444
backEnd/qr/qrcode.html
Normal file
@ -0,0 +1,444 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>收款码合成</title>
|
||||
<meta name="viewport"
|
||||
content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
|
||||
<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
|
||||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||
<meta http-equiv="Pragma" content="no-cache" />
|
||||
<meta http-equiv="Expires" content="0" />
|
||||
<!-- 百度统计 -->
|
||||
<script type="text/javascript">
|
||||
var _hmt = _hmt || [];
|
||||
(function () {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "https://hm.baidu.com/hm.js?246ff6a5f65b462dcfb917beb7baffbe";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
<!-- 根据id获取用户信息 -->
|
||||
<script type="text/javascript">
|
||||
(function(){
|
||||
var GetQueryString = function(name) {
|
||||
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
|
||||
var r = window.location.search.substr(1).match(reg);
|
||||
if (r != null) return unescape(r[2]); return null;
|
||||
}
|
||||
var id = GetQueryString("id")
|
||||
// 不合法id的处理
|
||||
if(id == null || id.search(/\W+/) != -1 || id.length != 24) {
|
||||
window.location.replace("https://qr.powerrain.cn/qr/410.html");
|
||||
}
|
||||
var data = document.createElement("script");
|
||||
data.src = `https://qr.powerrain.cn/data/${id}.js`
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
// 加载失败处理，默认失败时间是2秒
|
||||
var timer = setTimeout(function(){
|
||||
window.location.replace("https://qr.powerrain.cn/qr/500.html");
|
||||
},2000)
|
||||
data.onload = function(){
|
||||
clearTimeout(timer)
|
||||
}
|
||||
s.parentNode.insertBefore(data, s);
|
||||
}());
|
||||
</script>
|
||||
|
||||
<!-- 正常渲染 -->
|
||||
<script type="text/javascript">
|
||||
var setting = {
|
||||
username: "",
|
||||
qqpay: "",
|
||||
wxpay: "",
|
||||
alpay: "",
|
||||
id: "",
|
||||
qrcodeApi: "http://qr.topscan.com/api.php?text="
|
||||
}
|
||||
|
||||
var bgs = ['./img/bg1.jpg',
|
||||
'./img/bg2.jpg',
|
||||
'./img/bg3.jpg',
|
||||
'./img/bg4.jpg',
|
||||
'./img/bg5.jpg',
|
||||
'./img/bg6.jpg',]
|
||||
|
||||
//初始化
|
||||
function init() {
|
||||
// data = JSON.parse(data);
|
||||
data = data[0]
|
||||
// 控制台输出信息
|
||||
try {
|
||||
console.log('%cRainSun Copyright \xa9 2018-%s','font-size:12px;color:#999999;', (new Date).getFullYear());
|
||||
console.log('%c非常感谢您的使用，如出现bug请发送邮件至%czhaoyingbo@live.cn', 'color:#409eff','color:red');
|
||||
}
|
||||
catch (e) {
|
||||
}
|
||||
// 判断时间
|
||||
var timeout = parseInt(data.timeout)
|
||||
timeout = new Date(timeout)
|
||||
var now = new Date()
|
||||
if (timeout - now <= 0) window.location.replace("https://qr.powerrain.cn/qr/410.html");
|
||||
// 换背景
|
||||
ele('bg').src = bgs[Math.floor(Math.random() * bgs.length)]
|
||||
setting.id = data._id.$oid
|
||||
setting.alpay = data.alcode;
|
||||
setting.qqpay = data.qqcode;
|
||||
setting.wxpay = data.wxcode;
|
||||
setting.username = data.username;
|
||||
if (setting.qqpay) setting.qqpay = decodeURIComponent(setting.qqpay);
|
||||
manangeUrl();
|
||||
}
|
||||
|
||||
function ele(id) {
|
||||
return document.getElementById(id);
|
||||
}
|
||||
|
||||
function showIcon() {
|
||||
if (setting.alpay) {
|
||||
ele("al").style.display = "block";
|
||||
}
|
||||
if (setting.wxpay) {
|
||||
ele("wx").style.display = "block";
|
||||
}
|
||||
if (setting.qqpay) {
|
||||
ele("qq").style.display = "block";
|
||||
}
|
||||
}
|
||||
|
||||
function urlEncode(String) {
|
||||
return encodeURIComponent(String).replace(/'/g, "%27").replace(/"/g, "%22");
|
||||
}
|
||||
|
||||
function noSupport(text, type) {
|
||||
//遗留问题，等有了域名再说，微信访问会自带参数啥的生成一个超级复杂的二维码
|
||||
ele("qrcode").setAttribute("src", setting.qrcodeApi + urlEncode(window.location.href));
|
||||
ele("all").style.display = "block";
|
||||
ele("user").innerHTML = setting.username;
|
||||
showIcon();
|
||||
if (type === 1) alert("本二维码不支持" + text + "支付"); //其他浏览器是0
|
||||
}
|
||||
|
||||
function manangeUrl() {
|
||||
if (navigator.userAgent.match(/Alipay/i)) {
|
||||
//支付宝扫码
|
||||
if (setting.alpay) {
|
||||
window.location.href = setting.alpay;
|
||||
} else {
|
||||
//木有支付宝的链接
|
||||
noSupport("支付宝", 1);
|
||||
}
|
||||
} else if (navigator.userAgent.match(/MicroMessenger\//i)) {
|
||||
if (setting.wxpay) {
|
||||
ele("qrcode1").setAttribute("src", setting.qrcodeApi + urlEncode(setting.wxpay));
|
||||
ele("wq").style.display = "block";
|
||||
ele("wq_b").setAttribute("class", "wx_b");
|
||||
ele("title").innerHTML = "推荐使用微信支付";
|
||||
ele("user1").innerHTML = setting.username;
|
||||
ele("wq_pay").setAttribute("src", "./img/sprite3.png");
|
||||
} else {
|
||||
//木有微信的链接
|
||||
noSupport("微信", 1)
|
||||
}
|
||||
} else if (navigator.userAgent.match(/QQ\//i)) {
|
||||
if (setting.qqpay) {
|
||||
ele("qrcode1").setAttribute("src", setting.qrcodeApi + urlEncode(setting.qqpay));
|
||||
ele("wq").style.display = "block";
|
||||
ele("wq_b").setAttribute("class", "qq_b");
|
||||
ele("title").innerHTML = "推荐使用QQ支付";
|
||||
ele("user1").innerHTML = setting.username;
|
||||
ele("wq_pay").setAttribute("src", "./img/sprite2.png");
|
||||
} else {
|
||||
//木有QQ的链接
|
||||
noSupport("QQ", 1);
|
||||
}
|
||||
} else {
|
||||
noSupport('', 0);
|
||||
}
|
||||
}
|
||||
|
||||
window.onload = function () {
|
||||
init();
|
||||
}
|
||||
</script>
|
||||
<style type="text/css">
|
||||
@charset "utf-8";
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
li,
|
||||
label,
|
||||
td,
|
||||
th {
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
a:link,
|
||||
a:visited,
|
||||
a:hover,
|
||||
a:active {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 14px;
|
||||
font-family: "微软雅黑", Arial, Helvetica, sans-serif;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
div,
|
||||
p,
|
||||
ul,
|
||||
ol,
|
||||
li,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
form,
|
||||
input,
|
||||
select,
|
||||
textarea,
|
||||
table,
|
||||
td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-size: 100%;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
area {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
a {
|
||||
font-family: "微软雅黑", Arial, Helvetica, sans-serif;
|
||||
text-decoration: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
content: "";
|
||||
display: block;
|
||||
height: 0;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.all {
|
||||
display: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.all .main {
|
||||
display: flex;
|
||||
max-width: 400px;
|
||||
width: 100%;
|
||||
flex-direction: column;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.all .background {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.all .main .qrcode {
|
||||
margin-top: 30px;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.all .main .user {
|
||||
font-size: 25px;
|
||||
color: #fff;
|
||||
margin-top: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.all .main .title {
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.all .main .imageBox {
|
||||
margin-top: 30px;
|
||||
height: 50px;
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.all .imageBox>div {
|
||||
height: 50px;
|
||||
width: 52px;
|
||||
background-image: url('./img/sprite1.png');
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.all .imageBox .wx {
|
||||
background-position-x: -12px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.all .imageBox .al {
|
||||
display: none;
|
||||
background-position-x: -276px;
|
||||
}
|
||||
|
||||
.all .imageBox .qq {
|
||||
display: none;
|
||||
background-position-x: -138px;
|
||||
}
|
||||
|
||||
.wq {
|
||||
display: none;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.wq .wx_b {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
background: #09bb07;
|
||||
}
|
||||
|
||||
.wq .qq_b {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
background-image: linear-gradient(180deg, #0088cc, #01cfff);
|
||||
}
|
||||
|
||||
.wq .w {
|
||||
display: flex;
|
||||
max-width: 400px;
|
||||
width: 100%;
|
||||
flex-direction: column;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.wq .footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.wq .pay {
|
||||
background: #fff;
|
||||
max-width: 500px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.wq .pay>img {
|
||||
width: 60%;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.wq .title {
|
||||
font-size: 35px;
|
||||
color: #fff;
|
||||
margin-top: 30px;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
.wq .qrcode {
|
||||
margin-top: 30px;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.wq .user {
|
||||
font-size: 30px;
|
||||
color: #fff;
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="all" id="all">
|
||||
<!-- <img class="background" src="https://gss0.baidu.com/94o3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/2934349b033b5bb5092b9c0d3bd3d539b700bc41.jpg"> -->
|
||||
<img class="background" id="bg">
|
||||
<div class='main'>
|
||||
<image class='qrcode' id='qrcode' src=""></image>
|
||||
<div class='user' id='user'></div>
|
||||
<div class='title'>本二维码支持以下APP向我付款</div>
|
||||
<div class='imageBox'>
|
||||
<div class='wx' id='wx'></div>
|
||||
<div class='al' id='al'></div>
|
||||
<div class='qq' id='qq'></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wq" id="wq">
|
||||
<div class="" id="wq_b"></div>
|
||||
<div class="w">
|
||||
<div class="title" id='title'></div>
|
||||
<image class='qrcode' id='qrcode1' src=""></image>
|
||||
<div class='user' id='user1'></div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<div class="pay">
|
||||
<img id="wq_pay" src="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
x
Reference in New Issue
Block a user