yeguodong
/
mhCardReader


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
							<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>华视读卡器详细调试</title>
    <style>
        body { font-family: Arial, sans-serif; margin: 20px; line-height: 1.6; }
        .container { max-width: 1200px; margin: 0 auto; }
        button { background: #007cba; color: white; border: none; padding: 10px 20px; margin: 5px; cursor: pointer; border-radius: 4px; }
        button:hover { background: #005a87; }
        .result { background: #f5f5f5; border: 1px solid #ccc; padding: 15px; margin: 10px 0; border-radius: 4px; max-height: 300px; overflow-y: auto; }
        .error { color: red; }
        .success { color: green; }
        .info { color: blue; }
        .warning { color: orange; }
        pre { white-space: pre-wrap; word-wrap: break-word; font-size: 12px; }
        .photo-section { border: 2px solid #ddd; padding: 15px; margin: 15px 0; border-radius: 8px; }
        .debug-tip { background: #e8f5e8; border: 1px solid #4caf50; padding: 10px; margin: 10px 0; border-radius: 4px; }
    </style>
</head>
<body>
    <div class="container">
        <h1>华视读卡器详细调试 - 照片功能专项测试</h1>
        
        <div class="debug-tip">
            <strong>🔍 本次更新内容：</strong><br>
            1. 添加了CVR_Read_Content函数支持<br>
            2. 增强了调试信息输出<br>
            3. 改进了照片获取策略<br>
            4. 添加数据有效性检查
        </div>

        <div class="test-section">
            <h2>测试功能</h2>
            <button onclick="testPhotoReading()">🖼️ 专项照片读取测试</button>
            <button onclick="testStepByStep()">📋 分步调试测试</button>
            <button onclick="clearResults()">🗑️ 清除结果</button>
        </div>

        <div id="results"></div>
    </div>

    <script>
        function addResult(title, data, type = 'info') {
            const results = document.getElementById('results');
            const div = document.createElement('div');
            div.className = `result ${type}`;
            
            let content = `<h3>${title} <small>${new Date().toLocaleTimeString()}</small></h3>`;
            if (typeof data === 'object') {
                content += `<pre>${JSON.stringify(data, null, 2)}</pre>`;
            } else {
                content += `<pre>${data}</pre>`;
            }
            
            div.innerHTML = content;
            results.appendChild(div);
            results.scrollTop = results.scrollHeight;
        }

        function testPhotoReading() {
            addResult('🚀 开始专项照片读取测试', '测试华视读卡器照片功能的多种方法...', 'info');
            
            fetch('http://localhost:8321/readcard/huashi/simple?action=readcard&port=1001', {
                method: 'GET',
                headers: { 'Content-Type': 'application/json' }
            })
            .then(response => response.json())
            .then(data => {
                const type = data.code === 200 ? 'success' : 'error';
                addResult('📋 读卡结果', data, type);
                
                // 详细分析照片数据
                if (data.data) {
                    analyzePhotoDataDetailed(data.data);
                }
            })
            .catch(error => {
                addResult('❌ 请求错误', error.message, 'error');
            });
        }

        function testStepByStep() {
            addResult('📝 开始分步测试', '逐步验证每个环节...', 'info');
            
            // 步骤1：健康检查
            fetch('http://localhost:8321/readcard/huashi/health')
            .then(response => response.json())
            .then(data => {
                addResult('1️⃣ 健康检查', data, data.healthy ? 'success' : 'warning');
                
                // 步骤2：设备状态
                return fetch('http://localhost:8321/readcard/huashi/status');
            })
            .then(response => response.json())
            .then(data => {
                addResult('2️⃣ 设备状态', data, data.connected ? 'success' : 'warning');
                
                // 步骤3：读卡测试
                addResult('3️⃣ 开始读卡', '请确保身份证已放置在读卡器上...', 'info');
                return fetch('http://localhost:8321/readcard/huashi/simple?action=readcard&port=1001');
            })
            .then(response => response.json())
            .then(data => {
                addResult('3️⃣ 读卡完成', data, data.code === 200 ? 'success' : 'error');
                
                if (data.data) {
                    analyzePhotoDataDetailed(data.data);
                }
            })
            .catch(error => {
                addResult('❌ 分步测试错误', error.message, 'error');
            });
        }

        function analyzePhotoDataDetailed(data) {
            const photoSection = document.createElement('div');
            photoSection.className = 'photo-section';
            
            let analysis = '<h3>🖼️ 照片数据详细分析</h3>';
            
            // 基础信息
            analysis += '<h4>📊 基础信息：</h4>';
            analysis += `• photoBase64字段存在: ${data.hasOwnProperty('photoBase64')}<br>`;
            analysis += `• photoBase64长度: ${data.photoBase64 ? data.photoBase64.length : 0}<br>`;
            analysis += `• hasPhoto: ${data.hasPhoto}<br>`;
            analysis += `• photoFormat: ${data.photoFormat || '未设置'}<br>`;
            analysis += `• photoSize: ${data.photoSize || 0}<br><br>`;
            
            // 数据分析
            if (data.photoBase64 && data.photoBase64.length > 0) {
                analysis += '<h4>🔍 数据内容分析：</h4>';
                const preview = data.photoBase64.substring(0, 100);
                analysis += `• 前100字符: "${preview}"<br>`;
                
                // 检查数据特征
                if (data.photoBase64.length > 100) {
                    const uniqueChars = new Set(data.photoBase64.split('')).size;
                    analysis += `• 字符种类数: ${uniqueChars}<br>`;
                    
                    if (uniqueChars < 5) {
                        analysis += `• ⚠️ 警告：字符种类过少，可能是无效数据<br>`;
                    }
                    
                    // 检查常见问题
                    if (data.photoBase64.replace(/A/g, '').length < 10) {
                        analysis += `• ❌ 检测到：主要是'A'字符，这是空数据<br>`;
                    } else if (data.photoBase64.replace(/0/g, '').length < 10) {
                        analysis += `• ❌ 检测到：主要是'0'字符，这是空数据<br>`;
                    }
                }
                
                // BASE64有效性检查
                try {
                    atob(data.photoBase64.substring(0, Math.min(100, data.photoBase64.length)));
                    analysis += `• ✅ BASE64格式: 有效<br>`;
                } catch (e) {
                    analysis += `• ❌ BASE64格式: 无效 - ${e.message}<br>`;
                }
                
                // 图片格式检测
                analysis += '<h4>🖼️ 图片格式检测：</h4>';
                const firstBytes = data.photoBase64.substring(0, 20);
                if (firstBytes.startsWith('/9j/')) {
                    analysis += '• 🎯 检测到JPEG格式标识<br>';
                } else if (firstBytes.startsWith('iVBORw0KGgo')) {
                    analysis += '• 🎯 检测到PNG格式标识<br>';
                } else if (firstBytes.startsWith('Qk') || firstBytes.startsWith('BM')) {
                    analysis += '• 🎯 检测到BMP格式标识<br>';
                } else {
                    analysis += '• ⚠️ 未识别的图片格式<br>';
                }
                
            } else {
                analysis += '<h4>❌ 问题诊断：</h4>';
                analysis += '• 没有获取到照片数据<br>';
                analysis += '• 可能原因：<br>';
                analysis += '  - 华视SDK版本不支持照片读取<br>';
                analysis += '  - 身份证芯片中没有照片数据<br>';
                analysis += '  - 读卡器硬件不支持照片功能<br>';
                analysis += '  - SDK函数调用顺序有误<br>';
            }
            
            photoSection.innerHTML = analysis;
            document.getElementById('results').appendChild(photoSection);
        }

        function clearResults() {
            document.getElementById('results').innerHTML = '';
        }

        // 页面加载提示
        window.onload = function() {
            addResult('🎯 华视读卡器照片功能专项调试', 
                `本页面专门用于调试华视读卡器的照片读取功能。

🔧 本次更新特性：
• 添加CVR_Read_Content函数支持
• 增强调试信息和错误诊断
• 改进照片获取策略
• 添加详细的数据分析

🧪 测试建议：
1. 先进行"专项照片读取测试"查看基本结果
2. 如有问题，使用"分步调试测试"定位具体环节
3. 查看详细的照片数据分析报告

📋 调试信息说明：
所有调试信息会在程序后台输出，如果需要查看可以：
- 查看ThCardReader程序的控制台输出
- 使用Visual Studio的输出窗口
- 查看系统调试日志`, 'info');
        };
    </script>
</body>
</html>