tools/scan-code-jssdk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix

Browse Source
This commit is contained in:
iqudoo
2026-04-30 15:35:30 +08:00
parent 0d1698439e
commit 51738b1936
9 changed files with 102 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
demo.html
View File

@@ -209,6 +209,7 @@
<p>点击开始后，会按桥接、微信、Web 摄像头、图片识别的顺序选择可用扫码方式。</p>
<div class="actions">
<button onclick="startScan()" class="btn">开始扫码</button>
<button onclick="scanImage()" class="btn secondary">选择图片识别</button>
<button onclick="stopScan()" class="btn secondary">停止扫码</button>
</div>
</section>
@@ -243,6 +244,7 @@
});
IScan.startScan();
IScan.scanImage();
IScan.stopScan();</pre>
</section>
</main>
@@ -341,6 +343,11 @@ IScan.stopScan();</pre>
setStatus(IScan.getStatus());
}
function scanImage() {
hide();
IScan.scanImage();
}
ready();
</script>
</body>

8
dist/index.d.ts vendored
View File

@@ -22,6 +22,10 @@ interface ScanConfigOptions {
* 网页扫码成功提示音是否启用，默认启用
*/
webScanBeepEnabled?: boolean,
/**
* BarcodeDetector polyfill 地址，默认使用 jsDelivr CDN
*/
webBarcodeDetectorPolyfillUrl?: string,
/**
* 微信JSSDK配置，微信环境才会生效，配置后会自动初始化微信JSSDK
*/
@@ -153,6 +157,10 @@ interface IScan {
* 开启扫码
*/
startScan(): void;
/**
* 选择图片进行识别
*/
scanImage(): void;
/**
* 清除全部监听
*/

8
dist/index.html vendored
View File

@@ -161,7 +161,7 @@
section {
margin-bottom: 16px;
}</style></head><body><main class="page"><section class="hero"><h1>IScan 扫码 SDK Demo</h1><p>统一接入桥接扫码、微信 JSSDK 扫码、Web 摄像头扫码、图片识别和扫码枪输入。</p></section><section class="grid"><div class="card"><h2>功能说明</h2><ul class="feature-list"><li>桥接环境优先调用 App 原生扫码。</li><li>微信环境支持初始化 JSSDK 并调用 scanQRCode。</li><li>浏览器环境使用 BarcodeDetector 识别二维码和条形码。</li><li>摄像头不可用时可选择图片识别。</li><li>支持扫码枪快速输入，并与扫码监听规则统一回调。</li></ul></div><div class="card"><h2>当前状态</h2><p>SDK 状态：<span id="status" class="status">loading</span></p><p>运行环境：</p><pre id="output" class="panel"></pre></div></section><section class="card"><h2>操作</h2><p>点击开始后，会按桥接、微信、Web 摄像头、图片识别的顺序选择可用扫码方式。</p><div class="actions"><button onclick="startScan()" class="btn">开始扫码</button> <button onclick="stopScan()" class="btn secondary">停止扫码</button></div></section><section class="grid"><div class="card"><h2>扫码结果</h2><pre id="result" class="panel result"></pre></div><div class="card"><h2>错误信息</h2><pre id="error" class="panel error"></pre></div></section><section class="card code"><h2>接入方式</h2><pre>IScan.config({
}</style></head><body><main class="page"><section class="hero"><h1>IScan 扫码 SDK Demo</h1><p>统一接入桥接扫码、微信 JSSDK 扫码、Web 摄像头扫码、图片识别和扫码枪输入。</p></section><section class="grid"><div class="card"><h2>功能说明</h2><ul class="feature-list"><li>桥接环境优先调用 App 原生扫码。</li><li>微信环境支持初始化 JSSDK 并调用 scanQRCode。</li><li>浏览器环境使用 BarcodeDetector 识别二维码和条形码。</li><li>摄像头不可用时可选择图片识别。</li><li>支持扫码枪快速输入，并与扫码监听规则统一回调。</li></ul></div><div class="card"><h2>当前状态</h2><p>SDK 状态：<span id="status" class="status">loading</span></p><p>运行环境：</p><pre id="output" class="panel"></pre></div></section><section class="card"><h2>操作</h2><p>点击开始后，会按桥接、微信、Web 摄像头、图片识别的顺序选择可用扫码方式。</p><div class="actions"><button onclick="startScan()" class="btn">开始扫码</button> <button onclick="scanImage()" class="btn secondary">选择图片识别</button> <button onclick="stopScan()" class="btn secondary">停止扫码</button></div></section><section class="grid"><div class="card"><h2>扫码结果</h2><pre id="result" class="panel result"></pre></div><div class="card"><h2>错误信息</h2><pre id="error" class="panel error"></pre></div></section><section class="card code"><h2>接入方式</h2><pre>IScan.config({
webCanvasEnabled: true,
webScanBeepEnabled: true,
initWechatJssdk: {
@@ -178,6 +178,7 @@
});
IScan.startScan();
IScan.scanImage();
IScan.stopScan();</pre></section></main><script>(function () {
output(window.navigator.userAgent);
window.onerror = function (message, source, lineno, colno, err) {
@@ -271,4 +272,9 @@ IScan.stopScan();</pre></section></main><script>(function () {
setStatus(IScan.getStatus());
}
function scanImage() {
hide();
IScan.scanImage();
}
ready();</script><script src="index.js"></script></body></html>

2
dist/index.js vendored
View File

File diff suppressed because one or more lines are too long

3
src/_core.js
View File

@@ -1,6 +1,6 @@
import './polyfill';
import { setConfig, getVersion } from './services/config';
import { onScanListener, offScanListener, setStatusListener, getStatus, startScan, stopScan, clear } from './services/provider/scan';
import { onScanListener, offScanListener, setStatusListener, getStatus, startScan, stopScan, scanImage, clear } from './services/provider/scan';
import { initWxJssdk } from './services/wx';
import { printDebug } from './utils/logger';
@@ -41,5 +41,6 @@ export default Object.assign({}, {
getStatus,
startScan,
stopScan,
scanImage,
clear,
});

2
src/index.js
View File

@@ -3,7 +3,7 @@ import _global from './polyfill/_global';
import { exportSDK } from './_export';
const IScan = exportSDK(core, null, "config", "setStatusListener", "onScanListener",
"offScanListener", "stopScan", "startScan", "clear");
"offScanListener", "stopScan", "startScan", "scanImage", "clear");
function dispatchIScanReady() {
_global.__IScanReady__ && _global.__IScanReady__();

14
src/services/provider/scan.js
View File

@@ -345,3 +345,17 @@ export function startScan() {
__closed();
});
}
export function scanImage() {
if (!isSupportImageScan()) {
console.log("not support image scanner");
return;
}
startScanForImage().then(resp => {
if (resp && resp.result) {
__result(resp.result);
}
}).catch(err => {
console.log("scan image error", err);
});
}

62
src/services/web/index.js
View File

@@ -8,6 +8,9 @@ const scanWeb = {
}
const DEFAULT_SCAN_BEEP_AUDIO = scanBeepAudio;
const BARCODE_DETECTOR_POLYFILL_URL = "https://fastly.jsdelivr.net/npm/barcode-detector@3/dist/iife/index.min.js";
let barcodeDetectorPolyfillPromise = null;
function removeEl(id) {
try {
@@ -63,22 +66,66 @@ function getBarcodeFormats(scanType) {
return formats;
}
function getBarcodeDetectorClass() {
if (typeof BarcodeDetector !== 'undefined') {
return BarcodeDetector;
}
if (typeof window !== 'undefined'
&& window.BarcodeDetectionAPI
&& window.BarcodeDetectionAPI.BarcodeDetector) {
return window.BarcodeDetectionAPI.BarcodeDetector;
}
return null;
}
function loadBarcodeDetectorPolyfill() {
if (getBarcodeDetectorClass()) {
return Promise.resolve(getBarcodeDetectorClass());
}
if (barcodeDetectorPolyfillPromise) {
return barcodeDetectorPolyfillPromise;
}
barcodeDetectorPolyfillPromise = new Promise((resolve, reject) => {
if (typeof document === 'undefined') {
reject(new Error("BarcodeDetector is not supported"));
return;
}
const scriptUrl = getConfig("webBarcodeDetectorPolyfillUrl") || BARCODE_DETECTOR_POLYFILL_URL;
const script = document.createElement("script");
script.src = scriptUrl;
script.onload = () => {
const BarcodeDetectorClass = getBarcodeDetectorClass();
if (BarcodeDetectorClass) {
resolve(BarcodeDetectorClass);
} else {
reject(new Error("BarcodeDetector polyfill is not ready"));
}
};
script.onerror = reject;
document.head.appendChild(script);
}).catch(err => {
barcodeDetectorPolyfillPromise = null;
throw err;
});
return barcodeDetectorPolyfillPromise;
}
function createBarcodeDetector(scanType) {
return Promise.resolve().then(() => {
if (typeof BarcodeDetector === 'undefined') {
return loadBarcodeDetectorPolyfill().then(BarcodeDetectorClass => {
if (!BarcodeDetectorClass) {
throw new Error("BarcodeDetector is not supported");
}
const formats = getBarcodeFormats(scanType);
if (BarcodeDetector.getSupportedFormats) {
return BarcodeDetector.getSupportedFormats().then(supportedFormats => {
if (BarcodeDetectorClass.getSupportedFormats) {
return BarcodeDetectorClass.getSupportedFormats().then(supportedFormats => {
const supported = formats.filter(format => supportedFormats.indexOf(format) !== -1);
if (!supported.length) {
throw new Error("No supported barcode formats");
}
return new BarcodeDetector({ formats: supported });
return new BarcodeDetectorClass({ formats: supported });
});
}
return new BarcodeDetector({ formats });
return new BarcodeDetectorClass({ formats });
});
}
@@ -126,12 +173,11 @@ export function isSupportWebScan() {
return typeof navigator !== 'undefined'
&& navigator.mediaDevices
&& navigator.mediaDevices.getUserMedia
&& typeof BarcodeDetector !== 'undefined';
&& !!getBarcodeDetectorClass();
}
export function isSupportImageScan() {
return typeof document !== 'undefined'
&& typeof BarcodeDetector !== 'undefined'
&& typeof URL !== 'undefined'
&& URL.createObjectURL;
}

8
types/index.d.ts vendored
View File

@@ -22,6 +22,10 @@ interface ScanConfigOptions {
* 网页扫码成功提示音是否启用，默认启用
*/
webScanBeepEnabled?: boolean,
/**
* BarcodeDetector polyfill 地址，默认使用 jsDelivr CDN
*/
webBarcodeDetectorPolyfillUrl?: string,
/**
* 微信JSSDK配置，微信环境才会生效，配置后会自动初始化微信JSSDK
*/
@@ -153,6 +157,10 @@ interface IScan {
* 开启扫码
*/
startScan(): void;
/**
* 选择图片进行识别
*/
scanImage(): void;
/**
* 清除全部监听
*/