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

8
dist/index.d.ts vendored
View File

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

8
dist/index.html vendored
View File

@@ -161,7 +161,7 @@
section { section {
margin-bottom: 16px; 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, webCanvasEnabled: true,
webScanBeepEnabled: true, webScanBeepEnabled: true,
initWechatJssdk: { initWechatJssdk: {
@@ -178,6 +178,7 @@
}); });
IScan.startScan(); IScan.startScan();
IScan.scanImage();
IScan.stopScan();</pre></section></main><script>(function () { IScan.stopScan();</pre></section></main><script>(function () {
output(window.navigator.userAgent); output(window.navigator.userAgent);
window.onerror = function (message, source, lineno, colno, err) { window.onerror = function (message, source, lineno, colno, err) {
@@ -271,4 +272,9 @@ IScan.stopScan();</pre></section></main><script>(function () {
setStatus(IScan.getStatus()); setStatus(IScan.getStatus());
} }
function scanImage() {
hide();
IScan.scanImage();
}
ready();</script><script src="index.js"></script></body></html> 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 './polyfill';
import { setConfig, getVersion } from './services/config'; 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 { initWxJssdk } from './services/wx';
import { printDebug } from './utils/logger'; import { printDebug } from './utils/logger';
@@ -41,5 +41,6 @@ export default Object.assign({}, {
getStatus, getStatus,
startScan, startScan,
stopScan, stopScan,
scanImage,
clear, clear,
}); });

2
src/index.js
View File

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

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

@@ -344,4 +344,18 @@ export function startScan() {
_scan_resolve = null; _scan_resolve = null;
__closed(); __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 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) { function removeEl(id) {
try { try {
@@ -63,22 +66,66 @@ function getBarcodeFormats(scanType) {
return formats; 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) { function createBarcodeDetector(scanType) {
return Promise.resolve().then(() => { return loadBarcodeDetectorPolyfill().then(BarcodeDetectorClass => {
if (typeof BarcodeDetector === 'undefined') { if (!BarcodeDetectorClass) {
throw new Error("BarcodeDetector is not supported"); throw new Error("BarcodeDetector is not supported");
} }
const formats = getBarcodeFormats(scanType); const formats = getBarcodeFormats(scanType);
if (BarcodeDetector.getSupportedFormats) { if (BarcodeDetectorClass.getSupportedFormats) {
return BarcodeDetector.getSupportedFormats().then(supportedFormats => { return BarcodeDetectorClass.getSupportedFormats().then(supportedFormats => {
const supported = formats.filter(format => supportedFormats.indexOf(format) !== -1); const supported = formats.filter(format => supportedFormats.indexOf(format) !== -1);
if (!supported.length) { if (!supported.length) {
throw new Error("No supported barcode formats"); 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' return typeof navigator !== 'undefined'
&& navigator.mediaDevices && navigator.mediaDevices
&& navigator.mediaDevices.getUserMedia && navigator.mediaDevices.getUserMedia
&& typeof BarcodeDetector !== 'undefined'; && !!getBarcodeDetectorClass();
} }
export function isSupportImageScan() { export function isSupportImageScan() {
return typeof document !== 'undefined' return typeof document !== 'undefined'
&& typeof BarcodeDetector !== 'undefined'
&& typeof URL !== 'undefined' && typeof URL !== 'undefined'
&& URL.createObjectURL; && URL.createObjectURL;
} }

8
types/index.d.ts vendored
View File

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