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 18:12:39 +08:00
parent 8eef0c1867
commit 46bd158b93
7 changed files with 33 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
README.md
View File

@@ -44,7 +44,7 @@ if (window.IScan) {
```js ```js
IScan.config({ IScan.config({
webCanvasEnabled: true, webScanCanvasEnabled: true,
webScanBeepEnabled: true, webScanBeepEnabled: true,
initWechatJssdk: { initWechatJssdk: {
apiUrl: "https://your-domain.com/wechat/jssdk-config" apiUrl: "https://your-domain.com/wechat/jssdk-config"
@@ -80,7 +80,7 @@ IScan.stopScan();
interface ScanConfigOptions { interface ScanConfigOptions {
bridgeEnabled?: boolean; bridgeEnabled?: boolean;
bridgeName?: string; bridgeName?: string;
webCanvasEnabled?: boolean; webScanCanvasEnabled?: boolean;
webScanCanvasStyle?: string; webScanCanvasStyle?: string;
webScanType?: ("qrCode" | "barCode")[]; webScanType?: ("qrCode" | "barCode")[];
webScanVideoMirror?: boolean; webScanVideoMirror?: boolean;
@@ -107,13 +107,14 @@ interface ScanConfigOptions {
| `scanRestartDelay` | 扫码重启延迟，单位：毫秒 | `500ms` | | `scanRestartDelay` | 扫码重启延迟，单位：毫秒 | `500ms` |
| `bridgeEnabled` | 是否启用桥接扫码 | `true` | | `bridgeEnabled` | 是否启用桥接扫码 | `true` |
| `bridgeName` | 挂载在 `window` 上的桥接对象名称 | `__bridge_client__` | | `bridgeName` | 挂载在 `window` 上的桥接对象名称 | `__bridge_client__` |
| `webCanvasEnabled` | 是否显示 Web 扫码 canvas；关闭后仍会用隐藏 canvas 识别 | `true` | | `webScanEnabled` | 是否支持 WebScan 扫码 | `true` |
| `webScanCanvasStyle` | Web 扫码 canvas 样式 | `position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999;` | | `webScanCanvasEnabled` | 是否显示 WebScan 扫码 canvas；关闭后仍会用隐藏 canvas 识别 | `true` |
| `webScanType` | Web 扫码类型 | `["qrCode", "barCode"]` | | `webScanCanvasStyle` | WebScan 扫码 canvas 样式 | `position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999;` |
| `webScanVideoMirror` | Web 视频是否水平镜像；不配置时自动判断：前置/PC 镜像，后置不镜像 | 自动 | | `webScanType` | WebScan 扫码类型 | `["qrCode", "barCode"]` |
| `webScanVideoMirrorVertical` | Web 视频是否垂直镜像 | `false` | | `webScanVideoMirror` | WebScan 视频是否水平镜像；不配置时自动判断：前置/PC 镜像，后置不镜像 | 自动 |
| `webScanBeepAudio` | Web 扫码成功提示音地址 | 内置提示音 | | `webScanVideoMirrorVertical` | WebScan 视频是否垂直镜像 | `false` |
| `webScanBeepEnabled` | Web 扫码成功是否播放提示音 | `true` | | `webScanBeepAudio` | WebScan 扫码成功提示音地址 | 内置提示音 |
| `webScanBeepEnabled` | WebScan 扫码成功是否播放提示音 | `true` |
| `initWechatJssdk` | 微信 JSSDK 初始化配置，仅微信环境生效 | 无 | | `initWechatJssdk` | 微信 JSSDK 初始化配置，仅微信环境生效 | 无 |
`initWechatJssdk` 子配置： `initWechatJssdk` 子配置：
@@ -210,7 +211,7 @@ IScan.config({
```js ```js
IScan.config({ IScan.config({
webCanvasEnabled: true webScanCanvasEnabled: true
}); });
``` ```

6
demo.html
View File

@@ -227,7 +227,8 @@
<section class="card code"> <section class="card code">
<h2>接入方式</h2> <h2>接入方式</h2>
<pre>IScan.config({ <pre>IScan.config({
webCanvasEnabled: true, webScanEnabled: true,
webScanCanvasEnabled: true,
webScanBeepEnabled: true, webScanBeepEnabled: true,
initWechatJssdk: { initWechatJssdk: {
apiUrl: "https://your-domain.com/wechat/jssdk-config" apiUrl: "https://your-domain.com/wechat/jssdk-config"
@@ -245,6 +246,7 @@
IScan.startScan(); IScan.startScan();
IScan.scanImage(); IScan.scanImage();
IScan.scanVideo();
IScan.stopScan();</pre> IScan.stopScan();</pre>
</section> </section>
</main> </main>
@@ -316,7 +318,7 @@ IScan.stopScan();</pre>
setStatus("initializing"); setStatus("initializing");
var url = "https://vet.iqudoo.com/api?action=api.biz.wechat.JSSDKConfig"; var url = "https://vet.iqudoo.com/api?action=api.biz.wechat.JSSDKConfig";
initSDK({ initSDK({
webCanvasEnabled: true, webScanCanvasEnabled: true,
webScanBeepEnabled: true, webScanBeepEnabled: true,
initWechatJssdk: { apiUrl: url } initWechatJssdk: { apiUrl: url }
}, function () { }, function () {

6
dist/index.d.ts vendored
View File

@@ -33,10 +33,14 @@ interface ScanConfigOptions {
* 2. 结束扫码的方法名称为：stopScan * 2. 结束扫码的方法名称为：stopScan
*/ */
bridgeName?: string, bridgeName?: string,
/**
* webScan是否启用，默认启用
*/
webScanEnabled?: boolean,
/** /**
* 网页扫码canvas是否启用，默认启用 * 网页扫码canvas是否启用，默认启用
*/ */
webCanvasEnabled?: boolean, webScanCanvasEnabled?: boolean,
/** /**
* 网页扫码canvas样式，默认：position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999; * 网页扫码canvas样式，默认：position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999;
*/ */

6
dist/index.html vendored
View File

@@ -162,7 +162,8 @@
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>浏览器环境使用 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({
webCanvasEnabled: true, webScanEnabled: true,
webScanCanvasEnabled: true,
webScanBeepEnabled: true, webScanBeepEnabled: true,
initWechatJssdk: { initWechatJssdk: {
apiUrl: "https://your-domain.com/wechat/jssdk-config" apiUrl: "https://your-domain.com/wechat/jssdk-config"
@@ -180,6 +181,7 @@
IScan.startScan(); IScan.startScan();
IScan.scanImage(); IScan.scanImage();
IScan.scanVideo();
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) {
@@ -246,7 +248,7 @@ IScan.stopScan();</pre></section></main><script>(function () {
setStatus("initializing"); setStatus("initializing");
var url = "https://vet.iqudoo.com/api?action=api.biz.wechat.JSSDKConfig"; var url = "https://vet.iqudoo.com/api?action=api.biz.wechat.JSSDKConfig";
initSDK({ initSDK({
webCanvasEnabled: true, webScanCanvasEnabled: true,
webScanBeepEnabled: true, webScanBeepEnabled: true,
initWechatJssdk: { apiUrl: url } initWechatJssdk: { apiUrl: url }
}, function () { }, function () {

2
dist/index.js vendored
View File

File diff suppressed because one or more lines are too long

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

@@ -294,7 +294,8 @@ export function isSupportWebScan() {
return typeof navigator !== 'undefined' return typeof navigator !== 'undefined'
&& navigator.mediaDevices && navigator.mediaDevices
&& navigator.mediaDevices.getUserMedia && navigator.mediaDevices.getUserMedia
&& !!getBarcodeDetectorClass(); && !!getBarcodeDetectorClass()
&& getConfig("webScanEnabled") !== false;
} }
export function isSupportImageScan() { export function isSupportImageScan() {
@@ -397,7 +398,7 @@ export function startScanForWeb(canvasStyle, onResult) {
let videoEl = createEl("video", let videoEl = createEl("video",
"__webscan_video__", "__webscan_video__",
"display: none", false); "display: none", false);
let canvasEnabled = getConfig("webCanvasEnabled") !== false; let canvasEnabled = getConfig("webScanCanvasEnabled") !== false;
let canvasDisplay = ""; let canvasDisplay = "";
let canvasBaseStyle = canvasStyle || "position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999;"; let canvasBaseStyle = canvasStyle || "position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999;";
let canvasEl = createEl("canvas", let canvasEl = createEl("canvas",

6
types/index.d.ts vendored
View File

@@ -33,10 +33,14 @@ interface ScanConfigOptions {
* 2. 结束扫码的方法名称为：stopScan * 2. 结束扫码的方法名称为：stopScan
*/ */
bridgeName?: string, bridgeName?: string,
/**
* webScan是否启用，默认启用
*/
webScanEnabled?: boolean,
/** /**
* 网页扫码canvas是否启用，默认启用 * 网页扫码canvas是否启用，默认启用
*/ */
webCanvasEnabled?: boolean, webScanCanvasEnabled?: boolean,
/** /**
* 网页扫码canvas样式，默认：position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999; * 网页扫码canvas样式，默认：position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999;
*/ */