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

解决问题

Browse Source
This commit is contained in:
iqudoo
2026-04-30 18:30:53 +08:00
parent 9cb965b190
commit ef3034014b
4 changed files with 20 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
demo.html
View File

@@ -189,8 +189,8 @@
<h2>功能说明</h2> <h2>功能说明</h2>
<ul class="feature-list"> <ul class="feature-list">
<li>支持桥接扫码、微信 JSSDK 扫码、Web 摄像头扫码、图片识别和扫码枪输入。</li> <li>支持桥接扫码、微信 JSSDK 扫码、Web 摄像头扫码、图片识别和扫码枪输入。</li>
<li>浏览器环境使用 ZXing的wasm库识别二维码和条形码。</li> <li>浏览器环境使用WASM库识别二维码和条形码。</li>
<li>扫码结果又监听规则统一回调。</li> <li>扫码结果由监听规则统一回调，支持正则匹配和优先级排序。</li>
</ul> </ul>
</div> </div>

2
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</h1><p>统一接入桥接扫码、微信 JSSDK 扫码、Web 摄像头扫码、图片识别和扫码枪输入。</p></section><section class="grid"><div class="card"><h2>功能说明</h2><ul class="feature-list"><li>支持桥接扫码、微信 JSSDK 扫码、Web 摄像头扫码、图片识别和扫码枪输入。</li><li>浏览器环境使用 ZXing的wasm库识别二维码和条形码。</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="scanVideo()" class="btn secondary">开启视频扫码</button> <button onclick="scanImage()" class="btn secondary">选择图片识别</button> <button onclick="stopScan()" class="btn secondary">停止扫码</button></div></section><section class="card"><h2>扫码结果</h2><pre id="result" class="panel result"></pre></section><section class="card"><h2>错误信息</h2><pre id="error" class="panel error"></pre><p style="color: #919191">错误信息可能来源于扫码结果、扫码过程、扫码初始化等。</p></section><section class="card code"><h2>接入方式</h2><pre>IScan.config({ }</style></head><body><main class="page"><section class="hero"><h1>IScan 通用扫码 SDK</h1><p>统一接入桥接扫码、微信 JSSDK 扫码、Web 摄像头扫码、图片识别和扫码枪输入。</p></section><section class="grid"><div class="card"><h2>功能说明</h2><ul class="feature-list"><li>支持桥接扫码、微信 JSSDK 扫码、Web 摄像头扫码、图片识别和扫码枪输入。</li><li>浏览器环境使用WASM库识别二维码和条形码。</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="scanVideo()" class="btn secondary">开启视频扫码</button> <button onclick="scanImage()" class="btn secondary">选择图片识别</button> <button onclick="stopScan()" class="btn secondary">停止扫码</button></div></section><section class="card"><h2>扫码结果</h2><pre id="result" class="panel result"></pre></section><section class="card"><h2>错误信息</h2><pre id="error" class="panel error"></pre><p style="color: #919191">错误信息可能来源于扫码结果、扫码过程、扫码初始化等。</p></section><section class="card code"><h2>接入方式</h2><pre>IScan.config({
webScanEnabled: true, webScanEnabled: true,
webScanCanvasEnabled: true, webScanCanvasEnabled: true,
webScanBeepEnabled: true, webScanBeepEnabled: true,

2
dist/index.js vendored
View File

File diff suppressed because one or more lines are too long

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

@@ -1,4 +1,4 @@
import { BarcodeDetector as BarcodeDetectorPonyfill, prepareZXingModule } from "barcode-detector/dist/cjs/index.js"; import { BarcodeDetector as BarcodeDetectorPonyfill, prepareZXingModule } from "barcode-detector/dist/cjs/ponyfill.js";
import { createUUID } from "../../utils/uuid"; import { createUUID } from "../../utils/uuid";
import { getConfig } from "../config"; import { getConfig } from "../config";
import scanBeepAudio from "../../../res/scan_beep.ogg"; import scanBeepAudio from "../../../res/scan_beep.ogg";
@@ -11,7 +11,10 @@ const scanWeb = {
} }
const DEFAULT_SCAN_BEEP_AUDIO = scanBeepAudio; const DEFAULT_SCAN_BEEP_AUDIO = scanBeepAudio;
const ZXING_READER_WASM_URL = "./lib/reader.wasm"; const ZXING_READER_WASM_PATH = "lib/reader.wasm";
const currentScriptSrc = typeof document !== "undefined"
&& document.currentScript
&& document.currentScript.src;
let barcodeDetectorPreparePromise = null; let barcodeDetectorPreparePromise = null;
let scanBeepAudioEl = null; let scanBeepAudioEl = null;
@@ -128,23 +131,30 @@ function getBarcodeDetectorClass() {
return BarcodeDetectorPonyfill; return BarcodeDetectorPonyfill;
} }
function getZXingReaderWasmUrl() {
if (currentScriptSrc) {
return new URL(ZXING_READER_WASM_PATH, currentScriptSrc).href;
}
return "./" + ZXING_READER_WASM_PATH;
}
function prepareBarcodeDetector() { function prepareBarcodeDetector() {
const BarcodeDetectorClass = getBarcodeDetectorClass(); const BarcodeDetectorClass = getBarcodeDetectorClass();
if (typeof BarcodeDetector !== 'undefined' || !prepareZXingModule) { if (typeof BarcodeDetector !== 'undefined' || !prepareZXingModule) {
return Promise.resolve(BarcodeDetectorClass); return Promise.resolve(BarcodeDetectorClass);
} }
if (!barcodeDetectorPreparePromise) { if (!barcodeDetectorPreparePromise) {
prepareZXingModule({ barcodeDetectorPreparePromise = prepareZXingModule({
fireImmediately: true,
overrides: { overrides: {
locateFile: path => { locateFile: path => {
if (path && path.indexOf(".wasm") !== -1) { if (path && path.indexOf(".wasm") !== -1) {
return ZXING_READER_WASM_URL; return getZXingReaderWasmUrl();
} }
return path; return path;
} }
} }
}); }).then(() => BarcodeDetectorClass);
barcodeDetectorPreparePromise = Promise.resolve(BarcodeDetectorClass);
} }
return barcodeDetectorPreparePromise; return barcodeDetectorPreparePromise;
} }