SDK开发完成

2026-04-30 16:36:31 +08:00
parent 21ae621c6e
commit 0acd16e0a5
9 changed files with 189 additions and 53 deletions
--- a/dist/index.d.ts
+++ b/dist/index.d.ts
@@ -3,17 +3,25 @@
 */
 interface ScanConfigOptions {
  /**
-   * 网页扫码canvas样式
+   * 网页扫码canvas是否启用，默认启用
   */
-  webCanvasStyle?: string,
+  webCanvasEnabled?: boolean,
+  /**
+   * 网页扫码canvas样式，默认：position: fixed; width: 300px; height: 300px; top: 0; left: 0; z-index: 9999;
+   */
+  webScanCanvasStyle?: string,
  /**
   * 网页扫码类型，默认支持二维码和条码
   */
  webScanType?: ('qrCode' | 'barCode')[],
  /**
-   * 网页扫码canvas是否启用，默认启用
+   * 网页扫码视频是否镜像，默认自动判断：前置/PC镜像，后置不镜像
   */
-  webCanvasEnabled?: boolean,
+  webScanVideoMirror?: boolean,
+  /**
+   * 网页扫码视频是否垂直镜像，默认不镜像
+   */
+  webScanVideoMirrorVertical?: boolean,
  /**
   * 网页扫码成功提示音地址，默认使用内置提示音
   */
@@ -153,6 +161,10 @@ interface IScan {
   * 开启扫码
   */
  startScan(): void;
+  /**
+   * 开启视频扫码
+   */
+  scanVideo(): void;
  /**
   * 选择图片进行识别
   */
--- a/dist/index.html
+++ b/dist/index.html
@@ -161,17 +161,18 @@

    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="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({
+    }</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,
  webScanBeepEnabled: true,
  initWechatJssdk: {
    apiUrl: "https://your-domain.com/wechat/jssdk-config"
  }
 }).then(function () {
+  // 监听扫码状态
  IScan.setStatusListener(function () {
    console.log("status:", IScan.getStatus());
  });
-
+  // 监听扫码结果
  IScan.onScanListener(function (res) {
    console.log("scan result:", res);
  }, "scan", null, 100);
@@ -277,4 +278,9 @@ IScan.stopScan();</pre></section></main><script>(function () {
      IScan.scanImage();
    }

+    function scanVideo() {
+      hide();
+      IScan.scanVideo();
+    }
+
    ready();</script><script src="index.js"></script></body></html>
--- a/dist/index.js
+++ b/dist/index.js