Vue3高拍仪接入实战：本地服务代理与跨域解决方案-育师

1. 项目概述：为什么在 Vue3 Web 项目里“硬刚”高拍仪是个典型又棘手的落地场景

高拍仪不是普通摄像头——它不是点开浏览器就能调用的navigator.mediaDevices.getUserMedia那种即插即用设备。它是带独立固件、专用驱动、私有通信协议、物理按键触发、多档图像增强（自动对焦/背光补偿/去阴影/OCR预处理）的工业级外设。你在 Vue3 后台管理系统里加个“扫描合同”按钮，用户点下去，弹出的不是系统默认摄像头窗，而是深视智能或海康威视 SDK 封装的本地弹窗；拍完图不走 base64，而是通过 SDK 内置 HTTP 接口把 JPEG 原图直传到你后端的/api/upload-scan；更麻烦的是，这个接口不是标准 RESTful，它可能要求Content-Type: multipart/form-data但字段名固定为fileData，还强制带deviceId=SN123456789这类设备指纹参数。我去年在给某政务服务平台做电子档案模块时就踩过全套坑：前端用 Vue3 + Pinia 管理状态，后端是 Spring Boot，高拍仪用的是深视智能 DS-6000 系列。当时最大的认知偏差是以为“SDK 就是 npm 包”，结果发现所谓“Web SDK”本质是一套需手动集成的本地服务桥接层——它根本不是纯 JS 库，而是一个运行在用户本机的微型 HTTP Server（监听http://127.0.0.1:8081），Vue3 页面通过axios调它的 API，再由它转发指令给 USB 设备。所以标题里“引入高拍仪”四个字背后，其实是三重环境耦合：浏览器沙箱限制、本地服务进程权限、设备驱动兼容性。这不是写个useCamera()Hook 就能搞定的事，而是要亲手把 Web 页面和物理世界焊死在一起。适合谁参考？正在开发 OA、档案系统、银行柜面、医保报销等需要现场采集纸质材料的 Vue3 工程师；也适合被产品经理一句“加个拍照功能”忽悠进坑的前端负责人——这篇就是给你拆解那层“看不见的胶水”怎么配比、怎么固化、怎么防脱落。

2. 整体架构设计与技术选型逻辑：为什么必须绕开“纯前端 SDK”幻觉

2.1 高拍仪 Web 接入的本质是“本地服务代理”，不是“浏览器 API 扩展”

市面上所有主流高拍仪厂商（深视智能、海康威视、方正、紫光）提供的所谓“Web SDK”，99% 都不是真正意义上的前端库。它们的真实形态是：

一个 Windows/macOS/Linux 可执行文件（.exe/.dmg/.deb），安装后注册为系统服务；
该服务在本地启动一个 HTTP Server（如http://127.0.0.1:8080），暴露/capture、/getDeviceInfo、/setParam等 REST 接口；
浏览器页面通过axios或fetch向该本地地址发请求，服务进程再通过 USB/HID 协议与高拍仪硬件通信；
整个链路中，浏览器永远无法直接访问 USB 设备——这是 Chromium 内核的硬性安全策略，连navigator.usbAPI 在非 Chrome OS 环境下也基本不可用。

提示：别信官网文档里“一行代码接入”的宣传话术。我实测过深视智能 DS-6000 的 v2.3.1 Web SDK 安装包，解压后看到SmartScanService.exe和config.json，立刻明白这根本不是 npm 模块。真正的“SDK”是那个后台进程，JS 文件只是它的遥控器。

2.2 Vue3 项目中的分层设计：为什么不能把 SDK 调用逻辑塞进组件

在 Vue3 Composition API 下，新手常犯的错误是把高拍仪操作写成一个useScanner()Hook，里面直接axios.post('http://127.0.0.1:8080/capture')。这会导致三个致命问题：

跨域拦截：现代浏览器默认禁止http://127.0.0.1与生产环境域名（如https://admin.example.com）的跨域请求，即使你开了cors，localhost和127.0.0.1在浏览器眼里是不同源；
服务状态不可控：用户没装服务、服务崩溃、端口被占用时，组件内try/catch只能报错，无法引导用户修复；
状态污染：多个页面同时调用扫描，axios请求并发无队列管理，设备忙时返回503 Service Unavailable，前端却还在渲染“正在扫描中”。

因此我采用三层隔离架构：

层级	职责	技术实现	关键约束
设备适配层	封装厂商 SDK 通信细节，统一返回 Promise	`ScannerService.ts`单例类，含`init()`、`capture()`、`getDeviceList()`方法	必须全局唯一实例，避免重复初始化
业务逻辑层	处理扫描流程（预检→触发→上传→校验），对接 Pinia store	`useScanWorkflow()`组合式函数，依赖`ScannerService`	不含 UI，只管状态流转和错误分类
界面交互层	渲染按钮、进度条、预览图、重试逻辑	`<ScanButton>`、`<ScanPreview>`等原子组件	通过`defineEmits`向上抛事件，不直接调用 SDK

这种设计让ScannerService成为整个项目的“设备中枢”，Pinia store 只存扫描结果和错误码，组件彻底无状态——哪怕你明天换成海康威视 SDK，只需重写ScannerService的capture()方法，上层业务代码零修改。

2.3 为什么 axios 是唯一合理选择，而非 fetch 或原生 XMLHttpRequest

对比三种 HTTP 客户端在高拍仪场景下的表现：

fetch：无法设置timeout（需 AbortController 配合，代码冗长）；对503错误默认不 reject，需手动response.ok判断；不支持请求重试中间件；
XMLHttpRequest：API 陈旧，Promise 封装麻烦，错误堆栈不友好；
axios：天然支持timeout: 10000、validateStatus: status => status < 500、retry: 2（配合axios-retry）、transformRequest自定义序列化。

更重要的是，高拍仪本地服务返回的响应体结构极不规范。例如深视智能的/capture接口成功时返回：

{"code":0,"msg":"success","data":{"imagePath":"C:\\Scan\\IMG_20231015_142233.jpg"}}

而失败时返回纯文本：

Error: Device not connected

用axios可以在transformResponse中统一处理：

axios.create({ transformResponse: [(data, headers) => { if (headers['content-type']?.includes('application/json')) { return JSON.parse(data); } // 非 JSON 响应转为 { code: -1, msg: data } return { code: -1, msg: data.trim() }; }] });

这种灵活性是fetch无法低成本实现的。我坚持用axios的另一个原因是企业级封装经验——我们团队已沉淀request.ts，内置 token 注入、错误码映射（如code: 401→ 触发登录态刷新）、监控上报，高拍仪请求复用同一套基建，日志可追溯、告警可联动。

3. 核心细节解析与实操要点：从安装服务到捕获图像的全链路拆解

3.1 本地服务安装与端口校验：让用户一眼看懂“为什么点不动”

高拍仪 SDK 的安装包本质是 installer，但用户往往忽略关键步骤。以深视智能 DS-6000 为例，安装后需验证三件事：

服务进程是否存活：Windows 下打开任务管理器，查找SmartScanService.exe；macOS 下执行ps aux | grep SmartScan；
HTTP Server 是否监听：命令行运行curl -v http://127.0.0.1:8080/ping，应返回{"status":"ok"}；
端口是否被占用：若返回Connection refused，检查是否其他程序占用了 8080 端口（常见于本地开发服务器）。

我在项目中写了checkLocalService()工具函数：

// utils/scanner-check.ts export async function checkLocalService(): Promise<{ isRunning: boolean; port: number; errorMsg?: string }> { const ports = [8080, 8081, 9000]; // 深视默认8080，海康默认9000 for (const port of ports) { try { const res = await axios.get(`http://127.0.0.1:${port}/ping`, { timeout: 3000, validateStatus: () => true // 允许404/503，我们自己判断 }); if (res.status === 200 && res.data?.status === 'ok') { return { isRunning: true, port }; } } catch (e) { continue; } } return { isRunning: false, port: 0, errorMsg: '未检测到高拍仪服务，请确认已安装并启动SDK' }; }

这个函数被注入到ScannerService.init()的前置校验中。当用户点击扫描按钮时，先执行此检查，失败则弹出明确提示框（附带下载链接和图文安装指南），而不是让axios报一堆Network Error。

注意：千万别在mounted钩子中自动调用init()！我见过太多项目在首页就初始化 SDK，结果用户根本不用扫描功能，却因服务未启动导致白屏。正确做法是“按需初始化”——首次点击按钮时才触发init()，且加防抖（防止用户狂点）。

3.2 设备连接状态监听：如何让前端感知“USB 插拔”

高拍仪 USB 断连时，本地服务不会主动通知浏览器。但我们可以通过轮询/getDeviceInfo接口来模拟“连接状态”。深视 SDK 的该接口在设备断开时返回：

{"code":1001,"msg":"Device not found"}

我设计了startDeviceMonitor()方法：

// ScannerService.ts private deviceMonitorTimer: NodeJS.Timeout | null = null; startDeviceMonitor() { if (this.deviceMonitorTimer) return; this.deviceMonitorTimer = setInterval(() => { this.getDeviceInfo().then(res => { if (res.code === 0) { // 设备在线，更新 store 中的 isConnected 状态 useScannerStore().isConnected = true; } else if ([1001, 1002].includes(res.code)) { // 1001=未找到，1002=忙 useScannerStore().isConnected = false; } }).catch(() => { useScannerStore().isConnected = false; }); }, 5000); // 5秒轮询一次 } stopDeviceMonitor() { if (this.deviceMonitorTimer) { clearInterval(this.deviceMonitorTimer); this.deviceMonitorTimer = null; } }

这个监听器在ScannerService初始化时启动，在组件onUnmounted时停止。UI 层通过isConnected计算属性控制按钮禁用态和图标颜色（绿色=在线，灰色=离线），比单纯靠try/catch更及时。

3.3 图像捕获与参数配置：为什么“自动”不如“可控”

高拍仪 SDK 默认开启“自动模式”（自动对焦+自动曝光），但在实际场景中极易翻车：

用户扫描深色合同，自动曝光拉高亮度导致文字发白；
扫描带印章的红头文件，自动白平衡把红色印泥变成粉色；
A4 纸边缘有阴影，自动去阴影算法误删公章。

因此我强制关闭自动模式，改用手动参数：

// 深视 SDK 手动参数示例 await axios.post(`http://127.0.0.1:${this.port}/setParam`, { brightness: 128, // 0-255，128为中性 contrast: 64, // 0-128，64为中性 saturation: 80, // 0-100，提升饱和度让红章更准 sharpness: 50, // 0-100，适度锐化防文字模糊 autoFocus: false, // 关闭自动对焦，用固定焦距 autoFocusDistance: 300 // 单位mm，A4纸最佳距离 });

这些参数不是拍脑袋定的。我用色卡和灰阶卡在不同光照下实测 37 次，最终确定政务场景的黄金组合：brightness=135（补偿办公室顶灯冷光）、contrast=72（增强黑白反差）、saturation=85（保红章不失真）。参数值存在 Pinia store 中，用户可在设置页微调，避免每次扫描都重置。

4. 实操过程与核心环节实现：从 Vue3 项目初始化到稳定交付

4.1 Vue3 项目环境准备：避开 Webpack/Vite 的坑

Vue3 项目分两类构建工具，高拍仪接入方式不同：

Vite 项目：默认启用strict MIME type checking，当axios请求http://127.0.0.1:8080/capture返回image/jpeg时，Vite 开发服务器会拦截并报MIME type mismatch。解决方案是在vite.config.ts中添加：
```
export default defineConfig({ server: { proxy: { '/scan-api': { target: 'http://127.0.0.1:8080', changeOrigin: true, rewrite: (path) => path.replace(/^\/scan-api/, '') } } } });
```
前端请求改为axios.post('/scan-api/capture')，Vite 代理到本地服务，绕过浏览器同源策略。

Webpack 项目（Vue CLI）：在vue.config.js中配置 devServer proxy：

module.exports = { devServer: { proxy: { '/scan-api': { target: 'http://127.0.0.1:8080', changeOrigin: true, pathRewrite: { '^/scan-api': '' } } } } }

实操心得：生产环境部署时，Nginx 必须配置反向代理，否则用户访问https://admin.example.com时，浏览器拒绝向http://127.0.0.1:8080发请求。Nginx 配置片段：
location /scan-api/ { proxy_pass http://127.0.0.1:8080/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; }
注意末尾的/，它决定路径重写行为——/scan-api/capture会被代理为http://127.0.0.1:8080/capture，而非.../capture。

4.2 ScannerService 核心类实现：单例模式与错误分类

ScannerService是整个方案的基石，必须用 TypeScript 严格定义：

// services/ScannerService.ts interface DeviceInfo { deviceId: string; model: string; firmwareVersion: string; } interface CaptureResult { code: number; msg: string; data: { imagePath: string; // 本地绝对路径，仅作标识 imageUrl: string; // 本地服务生成的临时 HTTP URL，如 http://127.0.0.1:8080/tmp/IMG_123.jpg }; } class ScannerService { private static instance: ScannerService; private port: number = 0; private baseUrl: string = ''; private constructor() {} static getInstance(): ScannerService { if (!ScannerService.instance) { ScannerService.instance = new ScannerService(); } return ScannerService.instance; } async init(port?: number): Promise<boolean> { const checkRes = await checkLocalService(); if (!checkRes.isRunning) throw new ScannerError('SERVICE_NOT_FOUND', checkRes.errorMsg); this.port = checkRes.port; this.baseUrl = `http://127.0.0.1:${this.port}`; return true; } async getDeviceInfo(): Promise<DeviceInfo> { try { const res = await axios.get(`${this.baseUrl}/getDeviceInfo`); if (res.data.code !== 0) { throw new ScannerError('DEVICE_ERROR', res.data.msg); } return res.data.data; } catch (e) { throw new ScannerError('NETWORK_ERROR', '获取设备信息失败'); } } async capture(options: { format: 'jpg' | 'png'; quality: number; // 1-100 }): Promise<CaptureResult> { try { const res = await axios.post(`${this.baseUrl}/capture`, { format: options.format, quality: options.quality, // 深视 SDK 需要额外参数 saveToTemp: true, // 保存到临时目录供后续上传 autoRotate: true // 自动纠正歪斜 }, { timeout: 30000, // 高拍仪对焦+拍摄耗时较长 validateStatus: (status) => status >= 200 && status < 500 }); if (res.data.code !== 0) { throw new ScannerError('CAPTURE_FAILED', res.data.msg); } // 深视返回的 imageUrl 是相对路径，需补全 res.data.data.imageUrl = `${this.baseUrl}${res.data.data.imageUrl}`; return res.data; } catch (e) { if (axios.isCancel(e)) { throw new ScannerError('REQUEST_CANCELLED', '请求已取消'); } throw new ScannerError('CAPTURE_TIMEOUT', '扫描超时，请检查设备连接'); } } } // 自定义错误类，便于上层分类处理 class ScannerError extends Error { constructor(public code: string, message: string) { super(message); this.name = 'ScannerError'; } } export const scannerService = ScannerService.getInstance();

这个类的关键设计点：

getInstance()确保全局唯一，避免多次init()导致端口冲突；
capture()方法显式声明timeout: 30000，因为高拍仪对焦+拍摄平均耗时 8~12 秒；
错误码SERVICE_NOT_FOUND、DEVICE_ERROR、CAPTURE_FAILED一一对应用户可理解的场景，Pinia store 中用switch(code)分发不同 Toast 提示。

4.3 业务逻辑层：useScanWorkflow 的状态机设计

useScanWorkflow()不是简单封装scannerService.capture()，而是实现一个扫描状态机：

// composables/useScanWorkflow.ts export function useScanWorkflow() { const store = useScannerStore(); const { t } = useI18n(); // 国际化支持 const scanState = ref<'idle' | 'checking' | 'capturing' | 'uploading' | 'success' | 'error'>('idle'); const startScan = async (options: { uploadUrl: string; metadata?: Record<string, any> }) => { scanState.value = 'checking'; try { // 1. 检查服务与设备 await scannerService.init(); const device = await scannerService.getDeviceInfo(); store.deviceInfo = device; // 2. 执行捕获 scanState.value = 'capturing'; const captureRes = await scannerService.capture({ format: 'jpg', quality: 95 }); // 3. 上传到业务后端 scanState.value = 'uploading'; const formData = new FormData(); formData.append('file', await urlToFile(captureRes.data.imageUrl, 'scan.jpg')); Object.entries(options.metadata || {}).forEach(([k, v]) => { formData.append(k, String(v)); }); await axios.post(options.uploadUrl, formData, { headers: { 'Content-Type': 'multipart/form-data' }, onUploadProgress: (progressEvent) => { store.uploadProgress = Math.round( (progressEvent.loaded * 100) / progressEvent.total ); } }); scanState.value = 'success'; store.scanResult = captureRes; setTimeout(() => { scanState.value = 'idle'; store.uploadProgress = 0; }, 2000); } catch (e) { scanState.value = 'error'; if (e instanceof ScannerError) { store.errorMessage = t(`scanner.error.${e.code}`) || e.message; } else { store.errorMessage = t('scanner.error.unknown'); } console.error('Scan workflow failed:', e); } }; return { scanState, startScan, reset: () => { scanState.value = 'idle'; store.errorMessage = ''; store.uploadProgress = 0; } }; } // 辅助函数：将图片 URL 转为 File 对象（用于 formData） async function urlToFile(url: string, filename: string): Promise<File> { const response = await fetch(url); const data = await response.blob(); return new File([data], filename, { type: 'image/jpeg' }); }

这个 Hook 的价值在于：

scanState提供清晰的 UI 状态（idle/checking/capturing/uploading/success/error），组件可精准绑定 loading 动画；
startScan()将“捕获”和“上传”解耦，允许业务方传入任意uploadUrl，适配不同后端（Spring Boot、Node.js、PHP）；
urlToFile()解决了axios无法直接上传远程 URL 的问题——必须先 fetch 下来转成 Blob，再构造成 File。

4.4 界面交互层：原子组件与用户体验细节

<ScanButton>组件的核心逻辑：

<!-- components/ScanButton.vue --> <template> <button :disabled="isDisabled" @click="handleClick" class="scan-btn" > <span v-if="scanState === 'idle'">📷 扫描文件</span> <span v-else-if="scanState === 'checking'">🔍 检测设备...</span> <span v-else-if="scanState === 'capturing'">⚡ 正在拍摄...</span> <span v-else-if="scanState === 'uploading'"> 📤 上传中 {{ store.uploadProgress }}% </span> <span v-else-if="scanState === 'success'">✅ 扫描成功</span> <span v-else-if="scanState === 'error'">❌ {{ store.errorMessage }}</span> </button> </template> <script setup lang="ts"> import { computed } from 'vue'; import { useScannerStore } from '@/stores/scanner'; import { useScanWorkflow } from '@/composables/useScanWorkflow'; const props = defineProps<{ uploadUrl: string; metadata?: Record<string, any>; }>(); const store = useScannerStore(); const { scanState, startScan } = useScanWorkflow(); const isDisabled = computed(() => { return scanState.value !== 'idle' && scanState.value !== 'error'; }); const handleClick = () => { if (scanState.value === 'error') { store.reset(); } startScan({ uploadUrl: props.uploadUrl, metadata: props.metadata }); }; </script>

关键体验优化点：

防抖点击：isDisabled计算属性锁住按钮，避免用户连续点击触发多次扫描；
错误恢复：当scanState === 'error'时，点击按钮自动reset()，无需用户手动刷新页面；
进度可视化：上传阶段显示百分比，比单纯loading更让用户安心；
国际化占位符：t('scanner.error.SERVICE_NOT_FOUND')映射到多语言 JSON，如中文"请先安装高拍仪SDK"，英文"Please install the scanner SDK first"。

5. 常见问题与排查技巧实录：那些官网文档绝不会告诉你的坑

5.1 高频问题速查表

问题现象	根本原因	解决方案	我的实测耗时
`Network Error`（axios）	浏览器阻止`http://127.0.0.1`请求	检查 Vite/Webpack 代理配置；生产环境确认 Nginx 反向代理已生效	2小时（首次）
`Device not found`（深视 SDK）	USB 线松动或驱动未加载	拔插 USB 线；Windows 设备管理器中卸载“未知设备”后重装驱动	5分钟
扫描图像全黑	自动曝光失效，手动 brightness 设为 0	在`setParam`中显式设置`brightness: 135`	15分钟（需实测调参）
上传后端报`400 Bad Request`	高拍仪返回的`imagePath`是 Windows 绝对路径（`C:\Scan\...`），后端无法读取	绝不传`imagePath`，必须用`imageUrl`通过`fetch`下载后再上传	3小时（踩坑最深）
多次扫描后内存泄漏	`ScannerService`未清理定时器	在`onUnmounted`中调用`scannerService.stopDeviceMonitor()`	40分钟（Chrome Memory Profiler 定位）
Edge 浏览器下无法触发扫描	Edge 对本地服务 CORS 处理更严格	在`axios`请求头中添加`mode: 'no-cors'`（仅限开发环境）；生产环境强制用户用 Chrome	1天（最终妥协方案）

5.2 深度避坑技巧：来自 37 次现场部署的血泪总结

技巧一：用chrome://flags/#unsafely-treat-insecure-origin-as-secure临时绕过 HTTPS 限制（仅开发）
当测试环境是http://localhost:3000时，Chrome 89+ 版本会拒绝http://127.0.0.1:8080的请求。官方方案是启用本地 HTTPS，但更简单的是在 Chrome 地址栏输入chrome://flags，搜索Insecure origins treated as secure，将http://localhost:3000加入列表并重启。注意：此 flag 仅限开发，上线前必须用 Nginx 代理。

技巧二：为高拍仪服务指定固定端口，避免端口冲突
深视 SDK 默认随机端口，我修改其config.json：

{ "port": 8080, "autoStart": true, "logLevel": "INFO" }

然后在ScannerService.init()中硬编码port: 8080，不再轮询。这样axios请求更稳定，Nginx 代理配置也更简洁。

技巧三：扫描结果预览图必须用object-fit: cover
高拍仪返回的图片尺寸不固定（A4 纸扫描是 2480x3508，身份证是 480x640），直接img.src会导致拉伸变形。CSS 必须写：

.scan-preview img { width: 100%; height: 300px; object-fit: cover; /* 保持比例裁剪 */ object-position: center; }

否则用户看到扭曲的合同，第一反应是“设备坏了”，而不是“前端没适配”。

技巧四：错误码映射表必须覆盖厂商全部返回值
深视 SDK 文档只写了code: 0成功，但实际还有：

1001: Device not found
1002: Device busy
1003: No paper detected
1004: Paper jam
2001: Invalid parameter
2002: Timeout

我在ScannerError类中建立完整映射：

const ERROR_MAP: Record<string, string> = { '1001': '设备未连接，请检查USB线', '1002': '设备正忙，请稍后重试', '1003': '未检测到纸张，请放入文件', '1004': '卡纸，请清理进纸通道', '2001': '参数错误，请联系管理员', '2002': '扫描超时，可能设备故障' };

用户看到中文提示，90% 的问题无需工程师介入。

5.3 兼容性兜底方案：当用户死活不装 SDK 怎么办？

总有用户拒绝安装任何本地程序（尤其金融客户）。我的兜底方案是：

降级为手机扫码：在 PC 端检测到 SDK 未安装时，显示二维码，引导用户用微信/支付宝“扫一扫”跳转 H5 扫描页；
H5 扫描页用MediaStreamTrack.getSettings()获取摄像头能力，优先启用focusMode: 'manual'和exposureMode: 'manual'；
用canvas.toDataURL('image/jpeg', 0.95)压缩图片，再axios上传。

虽然画质不如高拍仪，但保证业务流程不中断。这个方案写在useScanWorkflow.ts的startScan()最外层catch中，作为最后防线。

6. 后续扩展与维护建议：让这套方案持续跑得稳

这套高拍仪接入方案上线半年后，我们新增了两个关键能力：

批量扫描支持：修改capture()接口为captureBatch(count: number)，SDK 服务端循环拍摄，返回数组；前端用Promise.allSettled()并行上传；
OCR 结果回填：在uploadUrl后端增加 OCR 引擎（如 PaddleOCR），扫描上传后自动识别文字，回传text: "甲方：XXX，金额：¥10000"到前端表单，用户只需核对无需手动录入。

维护建议有三点：
第一，SDK 版本锁死：深视 SDK v2.3.1 与 v2.4.0 的/capture接口参数名变了（saveToTemp→saveToCache），我们在package.json中用resolutions锁定版本，避免 CI 自动升级；
第二，服务健康检查自动化：在 CI 流程中加入curl http://127.0.0.1:8080/ping检查，失败则阻断发布，防止新版本 SDK 与前端不兼容；
第三，用户反馈闭环：在扫描失败时，自动收集navigator.userAgent、screen.width、localStorage.getItem('scanner_version')，上报到 Sentry，我们据此发现 83% 的Device busy错误集中在双屏办公用户——他们习惯一边扫描一边开 Excel，导致设备被占用，于是增加了“扫描中禁止切换窗口”的提示。