label-studio
Version:
Data Labeling Tool that is backend agnostic and can be embedded into your applications
44 lines (41 loc) • 1.19 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR</title>
<script src="jsQR.js"></script>
<link rel="stylesheet" href="https://checkin.mos.ru/static/css/main.3472ae7a.chunk.css" />
</head>
<body>
<input type="file" name="qr" id="qr" />
<script>
window.qr.addEventListener("change", ({ target }) => {
const file = target && target.files && target.files[0];
let data;
const img = document.createElement("img");
img.onload = function(e) {
const width = this.naturalWidth;
const height = this.naturalHeight;
const canvas = document.createElement("canvas");
canvas.width = width;
canvas.height = height;
const context = canvas.getContext("2d");
context.drawImage(this, 0, 0);
let data = context.getImageData(0, 0, width, height);
console.log(data);
const qr = jsQR(data.data, width, height);
console.log('QR', qr)
}
if (file) {
var reader = new FileReader();
reader.onload = function (e) {
const src = e.target.result;
img.src = src;
};
reader.readAsDataURL(file);
}
})
</script>
</body>
</html>