diff --git a/scanner/.claude/settings.local.json b/scanner/.claude/settings.local.json new file mode 100644 index 0000000..5557eae --- /dev/null +++ b/scanner/.claude/settings.local.json @@ -0,0 +1,9 @@ +{ + "permissions": { + "allow": [ + "Bash(git add:*)" + ], + "deny": [], + "ask": [] + } +} \ No newline at end of file diff --git a/scanner/CLAUDE.md b/scanner/CLAUDE.md new file mode 100644 index 0000000..b7f17c8 --- /dev/null +++ b/scanner/CLAUDE.md @@ -0,0 +1,62 @@ +# CLAUDE.md + +This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository. + +## Project Overview + +This is a WeChat Mini Program called "徵象" (emblem-scanner) for QR code scanning and processing. The app connects to the Themblem service for QR code verification and includes camera functionality with device-specific optimizations. + +## Architecture + +**Main App Structure:** +- `app.js` - Main application entry point with global data and worker initialization +- `utils.js` - Utility functions for camera rules, device detection, and QR code extraction +- `pages/` - WeChat Mini Program pages (index, camera, debug, webview, etc.) +- `components/` - Reusable UI components (scanguide, tooltips, modals, etc.) +- `worker/` - WebAssembly worker thread for QR code processing using qrtool library +- `static/` - Static assets and resources + +**Key Components:** +- Camera system with device-specific zoom rules fetched from API +- WebAssembly-based QR processing in worker thread for performance +- Dual camera modes: native camera (`pages/camera/`) and web view (`pages/camwebview/`) +- Upload and verification system connecting to themblem.com API + +**Global Data:** +- `server_url`: 'https://themblem.com' - main API endpoint +- `session_id`: Generated unique session identifier +- `real_ip`: User's IP address fetched from external service +- `worker`: WebAssembly worker for QR processing + +## Development Commands + +This is a WeChat Mini Program project. Development is done through WeChat Developer Tools IDE. + +**Linting:** +```bash +# ESLint configuration available but no npm scripts defined +# Lint manually using WeChat Developer Tools or external ESLint +``` + +**No test framework or build scripts are configured in package.json** + +## Key Files + +- `project.config.json` - WeChat Mini Program configuration +- `app.json` - App pages, window settings, and worker configuration +- `utils.js` - Core utility functions for camera and QR code handling +- `worker/index.js` - WebAssembly QR code processing worker +- `precheck.js` - QR code frame validation logic +- `upload.js` - Image upload and verification functions + +## Dependencies + +- `lottie-miniprogram` - Lottie animations support +- WebAssembly qrtool library (`qrtool.wx.js`) - QR code processing + +## External APIs + +- `https://themblem.com/api/v1/camera-rules/` - Device-specific camera settings +- `https://themblem.com/api/v1/check-auto-torch/` - Auto torch functionality +- `https://whatsmyip.hondcloud.com` - IP address detection +- `https://research.themblem.com/event/` - Event tracking endpoint \ No newline at end of file diff --git a/scanner/app.json b/scanner/app.json index 543d2c5..20fc997 100644 --- a/scanner/app.json +++ b/scanner/app.json @@ -3,11 +3,11 @@ "pages/index/index", "pages/camera/camera", "pages/emblemscanner/emblemscanner", + "pages/test_result_page/test_result_page", "pages/debugentry/debugentry", "pages/debuguploaded/debuguploaded", "pages/camwebview/camwebview", "pages/camentry/camentry", - "pages/productinfo/productinfo", "pages/test/test", "pages/article/article", "pages/nav/nav", diff --git a/scanner/pages/emblemscanner/emblemscanner.js b/scanner/pages/emblemscanner/emblemscanner.js index 520b900..66a59d8 100644 --- a/scanner/pages/emblemscanner/emblemscanner.js +++ b/scanner/pages/emblemscanner/emblemscanner.js @@ -1,84 +1,16 @@ // QR Scanner Module - Self-contained QR scanning page // Adapted from existing camera implementation -// Utility functions (copied from utils.js for self-contained module) -var camera_rules = null; - -function get_system_info() { - return wx.getSystemInfoSync(); -} - -function get_phone_model() { - var ret = get_system_info().model; - console.log("phone model", ret); - return ret; -} - -function match_camera_rules(model, rules, default_zoom) { - console.log(model, "apply zoom rules:", rules); - var best_match = null; - for (var rule of rules) { - if (model.toLowerCase().startsWith(rule.model.toLowerCase())) { - if (!best_match || rule.model.length > best_match.model.length) { - best_match = rule; - } - } - } - if (best_match) { - console.log("found best match", best_match); - return best_match; - } - var ret = { - zoom: default_zoom, - web_view: false - }; - console.log("using default", ret); - return ret; -} - -function get_camera_rule(max_zoom, cb) { - var default_zoom = 4; - if (max_zoom && max_zoom >= 60) { - /* - * 2024.06.01: in some Huawei/Honor models, the scale is different, use 40 - * in this case so we don't need to set up rules for each specific model - */ - console.log(`max zoom is ${max_zoom}, default zoom will be 40`); - default_zoom = 40; - } - if (camera_rules) { - let rule = match_camera_rules(get_phone_model(), camera_rules, default_zoom); - cb(rule); - } else { - var url = 'https://themblem.com/api/v1/camera-rules/'; - wx.request({ - url, - complete: (res) => { - var rules = res.data; - camera_rules = rules; - let rule = match_camera_rules(get_phone_model(), rules, default_zoom); - cb(rule); - } - }); - } -} - -function make_query(zoom, return_page) { - var gd = getApp().globalData; - var ret = "zoom=" + zoom; - var ui = wx.getStorageSync('userinfo') || {}; - ret += "&phonemodel=" + encodeURIComponent(get_phone_model()); - ret += "&realip=" + (gd.real_ip || ""); - ret += "&emblem_id=" + (ui.emblem_id || ""); - ret += "&nick_name=" + encodeURIComponent(ui.nickName || ""); - ret += "&tenant=" + (gd.tenant_id || ""); - ret += "&tk=" + Date.now(); - if (return_page) { - ret += "&return_page=" + encodeURIComponent(return_page); - } - console.log("Web-view query:", ret); - return ret; -} +// Import utility functions from library +const { + get_system_info, + get_phone_model, + get_camera_rule, + make_query, + fetch_real_ip, + get_tenant_id, + is_emblem_qr_pattern +} = require('./libemblemscanner.js'); Page({ /** @@ -91,7 +23,6 @@ Page({ phone_model: 'unknown', zoom: -1, max_zoom: 1, - use_worker: false, show_tip: false, show_modal: '', busy: true, @@ -105,12 +36,18 @@ Page({ frame_upload_interval_ms: 2000, return_page: '', // Page to navigate to after successful scan server_url: 'https://themblem.com', // Default server URL + real_ip: '', // User's real IP address + tenant_id: '', // Tenant identifier debug_msgs: [], debug_image_data_url: '', rule_zoom: -1, camera_rule: null, use_web_view: false, - emblem_camera_url: null + emblem_camera_url: null, + // State machine: loading -> scanning -> verifying -> result + app_state: 'loading', // 'loading', 'scanning_camera', 'scanning_webview', 'verifying', 'result' + scan_mode: 'unknown', // 'camera', 'webview' + force_camera: false // Override web-view rule, force native camera }, /** @@ -119,63 +56,62 @@ Page({ onLoad(options) { console.log('QR Scanner module loaded', options); - // Store return page from query parameters - if (options.return_page) { - this.setData({ - return_page: options.return_page - }); - } + // Store query parameters + const force_camera = options.force_camera === '1' || options.force_camera === 'true'; + + this.setData({ + return_page: options.return_page || '', + force_camera: force_camera + }); // Initialize image data storage this.image_data_urls = []; - // Handle debug mode + // Handle debug mode locally options = options || {}; - if (options.debug || options.scene == 'debug') { - getApp().globalData.debug = true; - } - const enable_debug = getApp().globalData.debug || false; + const enable_debug = options.debug || options.scene == 'debug' || false; // Get system information this.initializeSystem(enable_debug); - // Load camera rules + // Fetch IP address and tenant info, then load camera rules + this.fetchRealIP(); + this.fetchTenantID(); this.loadCameraRules(); }, + /** + * Fetch real IP address + */ + fetchRealIP() { + fetch_real_ip((err, ip) => { + this.setData({ real_ip: ip }); + }); + }, + + /** + * Fetch tenant ID (can be customized based on app logic) + */ + fetchTenantID() { + const tenant_id = get_tenant_id(); + this.setData({ tenant_id }); + }, + /** * Initialize system information and device detection */ initializeSystem(enable_debug) { const systemInfo = get_system_info(); const phone_model = systemInfo.model; - const use_worker = phone_model.toLowerCase().includes('iphone'); this.setData({ enable_debug, phone_model, window_width: systemInfo.windowWidth, - window_height: systemInfo.windowHeight, - use_worker + window_height: systemInfo.windowHeight }); - console.log(`Phone model: ${phone_model}, Use worker: ${use_worker}`); - - // Store phone model in global data - getApp().globalData.phone_model = phone_model; - - // Initialize worker for iPhone devices - if (use_worker) { - this.initializeWorker(); - } - }, - - /** - * Initialize WebAssembly worker for QR processing - */ - initializeWorker() { - // TODO: Initialize worker - requires qrtool.wx.js and worker setup - console.log('Worker initialization would happen here'); + console.log(`Phone model: ${phone_model}, Using native camera mode`); }, /** @@ -185,15 +121,20 @@ Page({ get_camera_rule(null, (rule) => { console.log('Camera rule loaded:', rule); - const use_web_view = rule.web_view || false; + // Check for force_camera override + const should_use_webview = rule.web_view && !this.data.force_camera; let emblem_camera_url = null; // Set up web-view URL if needed - if (use_web_view) { - emblem_camera_url = "https://themblem.com/camera-5.0/?" + make_query(rule.zoom, this.data.return_page); + if (should_use_webview) { + emblem_camera_url = "https://themblem.com/camera-5.0/?" + make_query(rule.zoom, this.data.return_page, this.data.real_ip, this.data.tenant_id); this.addDebugMessage(`Using web-view camera: ${emblem_camera_url}`); } else { - this.addDebugMessage('Using native WeChat camera'); + if (this.data.force_camera && rule.web_view) { + this.addDebugMessage('Forcing native camera (override web-view rule)'); + } else { + this.addDebugMessage('Using native WeChat camera'); + } } this.setData({ @@ -201,66 +142,45 @@ Page({ zoom: rule.zoom, rule_zoom: rule.zoom, camera_sensitivity: rule.sensitivity || 1, - use_web_view: use_web_view, - emblem_camera_url: emblem_camera_url, - busy: false + use_web_view: should_use_webview, + emblem_camera_url: emblem_camera_url }); // Add rule info to debug messages - this.addDebugMessage(`Camera rule: zoom=${rule.zoom}, web_view=${rule.web_view}`); + this.addDebugMessage(`Camera rule: zoom=${rule.zoom}, web_view=${rule.web_view}${this.data.force_camera ? ' (FORCED_CAMERA)' : ''}`); + + // Transition to appropriate scanning state + if (should_use_webview) { + this.startWebviewScanning(); + } else { + this.startCameraScanning(); + } }); }, /** - * Camera initialization callback + * Camera ready callback */ - setup_camera(e) { - console.log('Camera setup', e); + onCameraReady(e) { + console.log('Camera ready', e); this.camera_context = wx.createCameraContext(); - - // Set up camera frame listener - this.camera_context.onCameraFrame((frame) => { - this.processFrame(frame); - }); + this.addDebugMessage('Camera initialized in scanCode mode'); + // State transition is handled in loadCameraRules + }, + /** + * Camera error callback + */ + onCameraError(e) { + console.error('Camera error', e); + this.addDebugMessage(`Camera error: ${JSON.stringify(e.detail)}`); this.setData({ - busy: false, - hint_text: '查找二维码' + show_modal: 'verifyfailed', + hint_text: '相机初始化失败' }); }, - /** - * Process camera frame for QR detection - */ - processFrame(frame) { - if (this.data.busy) return; - - // TODO: Implement QR detection logic - console.log('Processing frame', frame.width, frame.height); - }, - /** - * Handle successful QR verification - */ - onVerificationSuccess(qrCode) { - console.log('QR verification successful:', qrCode); - - if (this.data.return_page) { - wx.navigateTo({ - url: `${this.data.return_page}?qr_code=${encodeURIComponent(qrCode)}`, - success: () => { - console.log(`Navigated to return page: ${this.data.return_page}`); - }, - fail: (err) => { - console.error('Failed to navigate to return page:', err); - this.restart_camera(); - } - }); - } else { - console.warn('No return page specified'); - this.restart_camera(); - } - }, /** * Toggle torch/flash @@ -293,14 +213,10 @@ Page({ }, /** - * Close modal and restart camera + * Close modal and restart camera (legacy method name for WXML compatibility) */ restart_camera() { - this.setData({ - show_modal: '', - hint_text: '查找二维码', - busy: false - }); + this.restartScanning(); }, /** @@ -332,20 +248,92 @@ Page({ }, 3000); }, + /** - * Generate hint text based on QR detection result + * State Machine: Transition to new state */ - make_hint_text(result) { - if (result && result.qrcode && result.qrcode.length > 0) { - const err = result.err || ''; - if (err.includes('margin too small')) { - return '对齐定位点'; - } else if (err.includes('energy check failed') || err.includes('cannot detect angle')) { - return '移近一点'; - } - return '对齐定位点'; + transitionToState(newState, mode = null) { + const oldState = this.data.app_state; + this.addDebugMessage(`State: ${oldState} -> ${newState}${mode ? ` (${mode})` : ''}`); + + const stateData = { app_state: newState }; + if (mode) stateData.scan_mode = mode; + + this.setData(stateData); + }, + + /** + * State: Loading -> Scanning (Camera) + */ + startCameraScanning() { + this.transitionToState('scanning_camera', 'camera'); + this.setData({ + hint_text: '查找二维码', + busy: false + }); + }, + + /** + * State: Loading -> Scanning (Web-view) + */ + startWebviewScanning() { + this.transitionToState('scanning_webview', 'webview'); + this.setData({ + hint_text: '查找二维码', + busy: false + }); + }, + + /** + * State: Scanning -> Verifying (only for camera mode) + */ + startVerifying() { + this.transitionToState('verifying'); + this.setData({ + hint_text: '识别成功', + show_modal: 'verifying' + }); + }, + + /** + * State: Any -> Result (jump to return page) + */ + goToResult(qrCode) { + this.transitionToState('result'); + + if (this.data.return_page) { + wx.navigateTo({ + url: `${this.data.return_page}?qr_code=${encodeURIComponent(qrCode)}`, + success: () => { + this.addDebugMessage(`Navigated to: ${this.data.return_page}`); + }, + fail: (err) => { + this.addDebugMessage(`Navigation failed: ${err.errMsg}`); + this.restartScanning(); + } + }); + } else { + this.addDebugMessage('No return page specified'); + this.restartScanning(); } - return '查找二维码'; + }, + + /** + * State: Any -> Loading (restart) + */ + restartScanning() { + this.transitionToState('loading'); + this.setData({ + show_modal: '', + hint_text: '初始化相机...', + busy: true, + qr_position: null, + qr_sharpness: 0, + qr_size: 0 + }); + + // Reload camera rules to restart the flow + this.loadCameraRules(); }, /** @@ -381,14 +369,23 @@ Page({ if (e.detail && e.detail.data && e.detail.data.length > 0) { const messageData = e.detail.data[0]; if (messageData.qr_code) { - this.onVerificationSuccess(messageData.qr_code); + // Web-view results go directly to result (no verification step) + this.goToResult(messageData.qr_code); } else if (messageData.error) { this.addDebugMessage(`Web-view error: ${messageData.error}`); this.setData({ - show_modal: 'verifyfailed', hint_text: '识别失败' }); } } - } + }, + + /** + * Check if QR code matches Emblem pattern + */ + isEmblemQRPattern(qrCode) { + return is_emblem_qr_pattern(qrCode); + }, + + }); \ No newline at end of file diff --git a/scanner/pages/emblemscanner/emblemscanner.wxml b/scanner/pages/emblemscanner/emblemscanner.wxml index 88a0c0d..2f38668 100644 --- a/scanner/pages/emblemscanner/emblemscanner.wxml +++ b/scanner/pages/emblemscanner/emblemscanner.wxml @@ -1,65 +1,65 @@ - - - - - - - - - - - - - - - - - {{ hint_text }} - - - - -