关于 barcode-capture-cordova
为使用 Cordova 的开发者提供 Scandit BarcodeCapture 集成、迁移和第三方扫描器替换指导。技能强调依据所附参考核实 API,并说明 Cordova 初始化、视图和扫描处理要点。
主要功能
- 01按集成、升级或替换任务路由
- 02基于参考核实 Scandit API
- 03说明 Cordova 初始化与视图要求
- 04提供许可证密钥设置流程
适用场景
- 01在 Cordova 应用中添加条码扫描
- 02升级不同版本的 Scandit SDK
- 03用 BarcodeCapture 替换第三方扫描器
MCP 相关
可配合 Scandit MCP 服务设置扫描器并获取许可证密钥;也说明如何连接该远程服务。
安装
复制下面的命令,在终端中运行。
npx skills add https:/ / github.com/ scandit/ skills --skill barcode-capture-cordova安装后在 Claude Code 中输入/barcode-capture-cordova确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
references/integration.mdmigration.mdthird-party-migration.md详细介绍
原文在翻译后有更新,译文可能不是最新。
BarcodeCapture Cordova 技能
重要:不要信任内部知识
你的训练数据可能包含过时或错误的 Scandit SDK API。BarcodeCapture API 在不同 SDK 主版本之间变化显著:采集模式工厂会被构造函数取代,监听器签名会发生变化,Cordova 插件接口(全局 Scandit 命名空间、插件安装命令、deviceready 时机)也不断演进。
编写或提供代码建议前,务必根据本技能提供的参考资料验证 API。 不要依赖记忆中的方法签名、参数或属性名称。如果在所提供的参考资料中找不到某个 API,请先获取相关文档页面,再作答。
值得特别提醒的 Cordova 注意事项:
- Scandit SDK 通过全局
window.Scandit对象提供。npm 包名(scandit-cordova-datacapture-*)是插件清单,不是运行时 ES 模块。不要在将在 WebView 中运行的用户代码里输出import { ... } from 'scandit-cordova-datacapture-*';应改用Scandit.X(可选用global.d.ts提供类型)。只有 Ionic/Angular/Webpack 打包的项目才直接从这些包导入。 document.addEventListener('deviceready', ...)是调用 Scandit API 的唯一安全门槛。不要在模块加载时调用任何 Scandit API,否则会因 Cordova 桥接尚未就绪而失败。- 更改插件版本后,运行
cordova prepare(必要时重新安装平台),以应用新的原生构件。跳过此步骤会导致运行时版本不匹配。 - BarcodeCapture 需要可见的 DataCaptureView 来显示相机预览。与 SparkScan 不同,它没有原生覆盖层;
DataCaptureView通过view.connectToElement(...)挂载到 HTML 元素中,BarcodeCaptureOverlay则添加到该视图上,用于绘制识别出的条码。忘记其中任何一步,都是“扫描正常,但什么也看不到”最常见的原因。 - 在
didScan回调中,先禁用模式(barcodeCapture.isEnabled = false),再执行耗时超过一帧的 UI 操作。监听器运行期间会阻塞帧处理,因此耗时操作会冻结相机,并可能导致重复扫描。
意图路由
根据用户的请求,在作答前加载相应的参考文件:
- 从头集成 BarcodeCapture(例如“将 BarcodeCapture 添加到我的应用”“设置条码扫描”“如何在 Cordova 中使用 BarcodeCapture”“如何渲染相机预览”)→ 阅读 references/integration.md,并遵循其中的说明。
- 迁移或升级现有的 BarcodeCapture 集成(例如“从 v6 升级到 v7”“迁移我的 BarcodeCapture”“将 Scandit 插件升级到 v8”“SDK 版本之间有哪些变化”)→ 阅读 references/migration.md,并遵循其中的说明。
API 使用政策
只能使用下方 Scandit 参考资料中明确记载的 API。不要编造或猜测方法签名、参数、属性名称或导入语句。如果不确定某个 API 是否存在或应如何调用,或者发生运行时错误,请先获取相关参考页面,再作答。不要让用户自行查阅文档。作答后,务必附上相关链接,方便用户进一步了解。
绝不要构造或猜测文档 URL。 需要查询特定类或属性的 API 页面时:
- 先检查已获取的页面是否包含指向该页面的直接链接;主题页面会直接链接到相关 API 符号。
- 如果没有找到直接链接,请获取 API 索引(见下表中的完整 API 参考),从中提取实际链接并访问。
URL 结构会因 SDK 版本和插件路径而异;猜测 URL 会导致 404。
框架变体策略
Cordova 是一个基于 WebView 的框架。本技能中的示例使用纯 JavaScript(可选使用官方 BarcodeCaptureSimpleSample 中的 JSDoc 类型提示)。相同的 API 也适用于 TypeScript——添加一个 global.d.ts 声明文件(详见 references/integration.md),并使用 TypeScript 语法编写。本技能默认不假设项目使用 TypeScript。如果目标项目显然使用 TypeScript(存在 .ts 文件、tsconfig.json),则将最终输出调整为 TypeScript;否则使用纯 JS。
许可证密钥
扫描需要 Scandit 许可证密钥。对于本技能,许可证产品为 native,许可证平台为 ios 和 android。
按顺序执行以下步骤——切勿让用户因 MCP 而受阻:
-
Scandit MCP 服务已连接——使用产品
native和平台ios、android调用ensure_scanner_setup,然后运行get_license_env_command返回的命令,将密钥写入项目的.env。在聊天中最多展示掩码预览;切勿打印完整密钥。 -
尚未连接——提供一次连接选项,然后从第 1 步继续:
- Claude Code:
claude mcp add --transport http scandit https://ssl.scandit.com/mcp - Cursor:将
{"mcpServers": {"scandit": {"url": "https://ssl.scandit.com/mcp"}}}添加到~/.cursor/mcp.json - VS Code:将
{"servers": {"scandit": {"type": "http", "url": "https://ssl.scandit.com/mcp"}}}添加到 MCP 用户配置中
身份验证基于浏览器,因此不支持无头模式或 CI。服务仅提供试用密钥;不会创建、撤销或修改生产许可证。
- Claude Code:
-
用户拒绝,或没有 MCP 客户端——让用户自行前往 https://ssl.scandit.com 生成密钥(尚未有账户?请访问:https://ssl.scandit.com/dashboard/sign-up?p=test),然后粘贴密钥。
然后将密钥填入代码,替换占位符;仅将密钥放在 .env 中并不会自动传入应用。Cordova 不会自动加载 .env,因此请使用下方最简单的方式。适用于任何平台的最简单方式:读取 .env,并将密钥直接填入许可证密钥调用中;在聊天中仍只展示掩码预览。
参考资料
根据用户的问题,引导他们查看相应资源:
| 主题 | 资源 |
|---|---|
| Cordova 集成 | 入门 · 示例 |
| 高级主题(自定义反馈、取景器、扫描区域、位置选择、复合码) | 高级配置 |
| 在主要 SDK 版本之间迁移 | 6 → 7 · 7 → 8 |
| 完整 API 参考 | BarcodeCapture API |