<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>二维码解码</title>
</head>
<script src="reqrcode.js"></script>
<style type="text/css">
.qrcode-box {
padding: 20px;
width: 1000px;
margin: 0 auto;
}
.qrcode-box .btn {
width: 160px;
height: 60px;
line-height: 60px;
font-size: 20px;
cursor: pointer;
font-weight: bold;
}
</style>
<body>
<div class="qrcode-box">
<h2>二维码解码</h2>
<input type="file" id="selectFile">
<br />
<br />
<hr />
<h2>二维码解码</h2>
<img src="./awm.png" />
<br />
<button class="btn" onclick="reqrcodeFn()">解码</button>
</div>
<script>
var selectFile = document.getElementById('selectFile');
var getObjectURL = function(file) {
return window.URL && window.URL.createObjectURL ? window.URL.createObjectURL(file) : window.webkitURL.createObjectURL(file);
}
selectFile.onchange = function() {
console.log(getObjectURL(this.files[0]));
qrcode.decode(getObjectURL(this.files[0]));
qrcode.callback = function(url) {
alert("二维码解析：" + url);
window.open(url)
}
}
function reqrcodeFn() {
var awmUrl = 'https://qr.api.cli.im/newqr/create?data=https%3A%2F%2Fwww.ifrontend.net%2F&level=H&transparent=0&bgcolor=%23FFFFFF&forecolor=%23000000&blockpixel=12&marginblock=2&logourl=https%3A%2F%2Fncstatic.clewm.net%2Ffree%2F2020%2F1021%2F21%2F5efb033f1cd6d67693dbe30bdfc432a1.png&size=260&logoshape=rect&eye_use_fore=1&qrcode_eyes=null&outcolor=%23000000&incolor=%23000000&qr_rotate=0&text=&fontfamily=simsun.ttc&fontsize=30&fontcolor=%23000000&logo_pos=0&kid=bizcliim&time=1603288062&key=c5fc80f7ff604a85aff6131f78cf84bc';
qrcode.decode(awmUrl);
qrcode.callback = function(url) {
alert("二维码解析：" + url);
window.open(url)
}
}
</script>
</body>
</html>
微信公众号搜索“前端开发那点事”
