支付宝上架

pages/scan/index.vue

@@ -63,7 +63,7 @@
 <script setup>
 import { ref, onMounted, onUnmounted } from 'vue';
 import { getQueryString } from '../../util/index.js';
-import { Html5Qrcode } from 'html5-qrcode';
+import { Html5Qrcode, Html5QrcodeSupportedFormats } from 'html5-qrcode';
 
 const inputPopup = ref(null);
 const manualDeviceNo = ref('');
@@ -75,6 +75,21 @@ const flashOn = ref(false);
 let html5QrCode = null;
 let isProcessing = false; // 防止重复处理
 
+// 统一扫描配置：增大识别区域，提升低清晰度二维码识别成功率
+const getScanConfig = () => ({
+	fps: 12,
+	qrbox: (viewfinderWidth, viewfinderHeight) => {
+		const minEdge = Math.min(viewfinderWidth, viewfinderHeight);
+		const size = Math.max(220, Math.floor(minEdge * 0.72));
+		return { width: size, height: size };
+	},
+	disableFlip: false,
+	formatsToSupport: [Html5QrcodeSupportedFormats.QR_CODE],
+	experimentalFeatures: {
+		useBarCodeDetectorIfSupported: true
+	}
+});
+
 // 初始化扫码
 const initScan = async () => {
 	try {
@@ -124,11 +139,7 @@ const startScanning = async () => {
 		console.log('html5QrCode.start 方法:', typeof html5QrCode.start);
 		
 		// 配置扫描参数
-		const config = {
-			fps: 10, // 每秒10帧
-			qrbox: 250, // 扫描框大小（正方形）
-			disableFlip: false
-		};
+		const config = getScanConfig();
 		
 		console.log('扫描配置:', config);
 		console.log('准备调用 html5QrCode.start()...');
@@ -163,11 +174,7 @@ const startScanning = async () => {
 		// 尝试使用前置摄像头
 		console.log('尝试使用前置摄像头...');
 		try {
-			const config = {
-				fps: 10,
-				qrbox: 250,
-				disableFlip: false
-			};
+			const config = getScanConfig();
 			
 			await html5QrCode.start(
 				{ facingMode: "user" },
@@ -190,11 +197,7 @@ const startScanning = async () => {
 			// 最后尝试：不指定摄像头
 			console.log('最后尝试：使用默认摄像头...');
 			try {
-				const config = {
-					fps: 10,
-					qrbox: 250,
-					disableFlip: false
-				};
+				const config = getScanConfig();
 				
 				// 获取摄像头列表
 				const cameras = await Html5Qrcode.getCameras();