Compare commits
3 Commits
Author | SHA1 | Date |
---|---|---|
![]() |
14edfc7fbb | 7 years ago |
![]() |
2e142c20e8 | 7 years ago |
![]() |
a98b9e1129 | 7 years ago |
@ -1,14 +1,97 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>qrcode-decode</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<input type="file" name="file" id="file"><br>
|
||||
<input type="file" name="file" id="file">
|
||||
<br>
|
||||
<button id="videoBut" onclick="buttonClick()">启用摄像头</button><br>
|
||||
<video id="video" width="300"></video>
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
<script type="text/javascript" src="test.js"></script>
|
||||
<script type="text/javascript" src="../dist/qr-decode.js"></script>
|
||||
<script>
|
||||
document.getElementById('file').onchange = function (event) {
|
||||
var el = event.target;
|
||||
if (!el.files.length) return;
|
||||
var file = el.files[0];
|
||||
new Promise(function (ok, no) {
|
||||
if (window.URL && window.URL.createObjectURL) {
|
||||
ok(window.URL.createObjectURL(file));
|
||||
} else if (typeof FileReader) {
|
||||
var reader = new FileReader();
|
||||
reader.onload = evt => {
|
||||
ok(evt.target.result);
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
} else {
|
||||
no('浏览器不支持');
|
||||
}
|
||||
}).then((src) => {
|
||||
qrDecode.decodeByUrl(src, function (err, txt) {
|
||||
var msg = document.createElement("div")
|
||||
if (err) {
|
||||
console.log(err);
|
||||
msg.innerHTML = "err: <br>" + err;
|
||||
} else {
|
||||
msg.innerHTML = txt;
|
||||
}
|
||||
document.body.appendChild(msg);
|
||||
})
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
var video =document.getElementById('video');
|
||||
var videoBut =document.getElementById('videoBut');
|
||||
var xc;
|
||||
videoBut.onclick = videoEnable;
|
||||
|
||||
function videoEnable() {
|
||||
var URL = window.URL || window.webkitURL;
|
||||
navigator.getUserMedia({
|
||||
video: true
|
||||
}, function (stream) {
|
||||
video.src = URL.createObjectURL(stream);// 将获取到的视频流对象转换为地址
|
||||
video.oncanplay = function(){
|
||||
videoPlay();
|
||||
video.width = video.videoWidth;
|
||||
video.height = video.videoHeight;
|
||||
}
|
||||
}, function (error) {
|
||||
alert(error.name || error);
|
||||
});
|
||||
}
|
||||
|
||||
function videoStop(){
|
||||
clearInterval(xc);
|
||||
video.pause();
|
||||
videoBut.innerText = '启动';
|
||||
videoBut.onclick = videoPlay;
|
||||
}
|
||||
function videoPlay(){
|
||||
video.play();
|
||||
videoBut.innerText = '停止';
|
||||
xc = setInterval(function(){
|
||||
try{
|
||||
var txt = qrDecode.decodeByDom(video);
|
||||
var msg = document.createElement("div")
|
||||
msg.innerHTML = "识别到二维码: " + txt;
|
||||
document.body.appendChild(msg);
|
||||
videoStop();
|
||||
}catch(err){
|
||||
console.log(err);
|
||||
}
|
||||
},300)
|
||||
videoBut.onclick = videoStop;
|
||||
}
|
||||
</script>
|
||||
|
||||
</html>
|
@ -1,32 +0,0 @@
|
||||
var qrcodeDecode = require('../browser')
|
||||
|
||||
document.getElementById('file').onchange = function (event) {
|
||||
var el = event.target;
|
||||
if (!el.files.length) return;
|
||||
var file = el.files[0];
|
||||
new Promise(function (ok, no) {
|
||||
if (window.URL && window.URL.createObjectURL) {
|
||||
ok(window.URL.createObjectURL(file));
|
||||
} else if (typeof FileReader) {
|
||||
var reader = new FileReader();
|
||||
reader.onload = evt => {
|
||||
ok(evt.target.result);
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
} else {
|
||||
no('浏览器不支持');
|
||||
}
|
||||
}).then((src) => {
|
||||
qrcodeDecode.decodeByUrl(src, function (err, txt) {
|
||||
var msg = document.createElement("div")
|
||||
if (err) {
|
||||
console.log(err);
|
||||
msg.innerHTML = "err: <br>" + err;
|
||||
} else {
|
||||
msg.innerHTML = txt;
|
||||
}
|
||||
document.body.appendChild(msg);
|
||||
})
|
||||
|
||||
});
|
||||
}
|
@ -1,14 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>qrcode-decode</title>
|
||||
</head>
|
||||
<body>
|
||||
<input type="file" name="file" id="file"><br>
|
||||
<div></div>
|
||||
</body>
|
||||
<script type="text/javascript" src="/test.b0eca09c.js"></script>
|
||||
</html>
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,6 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="refresh" content="0;url=./demo/" />
|
||||
</head>
|
||||
</html>
|
@ -0,0 +1,4 @@
|
||||
var jsqr = require('jsqr');
|
||||
module.exports = function(imageData){
|
||||
return jsqr(imageData.data,imageData.width,imageData.height).data;
|
||||
}
|
Loading…
Reference in New Issue