chore: update demo

pull/16/head
yugasun 4 years ago
parent fd6daa86a1
commit d1a5b9de6b

@ -9,13 +9,18 @@
<body> <body>
<section> <section>
<h3>Same domain image</h3> <h3>Same domain image</h3>
<img src="./assets/qrcode.png" alt="qr code" /><br /> <img id="img1" src="./assets/qrcode.png" alt="qr code" /><br />
<button id="decode1">Decode!</button><br /> <button id="decode1">Decode!</button><br />
<span id="result1"></span><br /> <span id="result1"></span><br />
</section> </section>
<hr /> <hr />
<section> <section>
<h3>Different domain image</h3> <h3>Different domain image</h3>
<input
id="img2"
value="https://yugasun.com/static/wechat.jpg"
style="width: 400px"
/><br />
<button id="decode2">Decode!</button><br /> <button id="decode2">Decode!</button><br />
<span id="result2"></span><br /> <span id="result2"></span><br />
</section> </section>
@ -31,30 +36,31 @@
var btn2 = document.querySelector('button#decode2'); var btn2 = document.querySelector('button#decode2');
var result1 = document.querySelector('#result1'); var result1 = document.querySelector('#result1');
var result2 = document.querySelector('#result2'); var result2 = document.querySelector('#result2');
var img = document.querySelector('img'); var img1 = document.querySelector('#img1');
var img2 = document.querySelector('#img2');
btn1.onclick = async () => { btn1.onclick = async () => {
// you can also decode from image path // you can also decode from image path
// const code = await qr.decodeFromImage('./assets/qrcode.png'); // const code = await qr.decodeFromImage('./assets/qrcode.png');
const code = await qr.decodeFromImage(img); const code = await qr.decodeFromImage(img1);
console.log(code); console.log(code);
result1.innerText = code.data; result1.innerText = code.data;
}; };
btn2.onclick = async () => { btn2.onclick = async () => {
console.log('img2', img2);
// you can also decode from image path // you can also decode from image path
// const code = await qr.decodeFromImage('./assets/qrcode.png'); // const code = await qr.decodeFromImage('./assets/qrcode.png');
const code = await qr.decodeFromImage( const code = await qr.decodeFromImage(img2.value, {
'https://yugasun.com/static/wechat.jpg',
{
crossOrigin: 'anonymous', crossOrigin: 'anonymous',
}, });
);
console.log(code); console.log(code);
result2.innerText = code.data; result2.innerText = code.data;
}; };
} }
window.onload = () => {
main(); main();
};
</script> </script>
</body> </body>
</html> </html>

@ -87,6 +87,6 @@
}, },
"homepage": "https://github.com/yugasun/qrcode-decoder#readme", "homepage": "https://github.com/yugasun/qrcode-decoder#readme",
"dependencies": { "dependencies": {
"jsqr": "^1.3.1" "jsqr": "^1.4.0"
} }
} }

Loading…
Cancel
Save