49 lines
1.3 KiB
HTML
49 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>扫码查询商品</title>
|
|
<script src="https://unpkg.com/html5-qrcode"></script>
|
|
</head>
|
|
<body>
|
|
<h3>扫码查询商品</h3>
|
|
|
|
<div id="reader" style="width: 320px;"></div>
|
|
<div id="result"></div>
|
|
|
|
<script>
|
|
function onScanSuccess(decodedText) {
|
|
document.getElementById("result").innerText = "识别到条码:" + decodedText;
|
|
|
|
// 停止继续扫描,避免重复请求
|
|
html5QrcodeScanner.clear();
|
|
|
|
fetch("product.php?barcode=" + encodeURIComponent(decodedText))
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
if (data.code === 1) {
|
|
document.getElementById("result").innerHTML =
|
|
"商品名:" + data.data.name + "<br>" +
|
|
"价格:" + data.data.price;
|
|
} else {
|
|
document.getElementById("result").innerText = data.msg;
|
|
}
|
|
});
|
|
}
|
|
|
|
const html5QrcodeScanner = new Html5QrcodeScanner(
|
|
"reader",
|
|
{
|
|
fps: 10,
|
|
qrbox: {
|
|
width: 250,
|
|
height: 120
|
|
}
|
|
},
|
|
false
|
|
);
|
|
|
|
html5QrcodeScanner.render(onScanSuccess);
|
|
</script>
|
|
</body>
|
|
</html> |