test_huashi_debug.html 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>华视读卡器照片功能调试</title>
  7. <style>
  8. body { font-family: Arial, sans-serif; margin: 20px; line-height: 1.6; }
  9. .container { max-width: 1200px; margin: 0 auto; }
  10. button { background: #007cba; color: white; border: none; padding: 10px 20px; margin: 5px; cursor: pointer; border-radius: 4px; }
  11. button:hover { background: #005a87; }
  12. .result { background: #f5f5f5; border: 1px solid #ccc; padding: 15px; margin: 10px 0; border-radius: 4px; }
  13. .error { color: red; }
  14. .success { color: green; }
  15. .info { color: blue; }
  16. .warning { color: orange; }
  17. .debug-info { background: #fff3cd; border: 1px solid #ffeaa7; padding: 10px; margin: 10px 0; border-radius: 4px; }
  18. </style>
  19. </head>
  20. <body>
  21. <div class="container">
  22. <h1>华视读卡器照片功能调试</h1>
  23. <div class="test-section">
  24. <h2>调试测试</h2>
  25. <button onclick="testReadCard()">读取身份证(调试模式)</button>
  26. <button onclick="clearResults()">清除结果</button>
  27. </div>
  28. <div class="debug-info">
  29. <h3>调试说明</h3>
  30. <p>本页面专门用于调试华视读卡器的照片BASE64功能。会显示详细的调试信息。</p>
  31. <p><strong>预期行为:</strong></p>
  32. <ul>
  33. <li>如果华视SDK支持BASE64函数,应该能看到详细的调用过程</li>
  34. <li>如果不支持,会显示函数调用失败的信息</li>
  35. <li>备用方法会尝试获取二进制数据并手动转换</li>
  36. </ul>
  37. </div>
  38. <div id="results"></div>
  39. </div>
  40. <script>
  41. function addResult(title, data, type = 'info') {
  42. const results = document.getElementById('results');
  43. const div = document.createElement('div');
  44. div.className = `result ${type}`;
  45. let content = `<h3>${title}</h3>`;
  46. if (typeof data === 'object') {
  47. content += `<pre>${JSON.stringify(data, null, 2)}</pre>`;
  48. } else {
  49. content += `<p>${data}</p>`;
  50. }
  51. div.innerHTML = content;
  52. results.appendChild(div);
  53. results.scrollTop = results.scrollHeight;
  54. }
  55. function testReadCard() {
  56. addResult('开始调试测试', '正在读取身份证,请确保卡片已放置...', 'info');
  57. fetch('http://localhost:8321/readcard/huashi/readcard', {
  58. method: 'POST',
  59. headers: { 'Content-Type': 'application/json' },
  60. body: JSON.stringify({ autoClose: true })
  61. })
  62. .then(response => response.json())
  63. .then(data => {
  64. const type = data.code === 200 ? 'success' : 'error';
  65. addResult('读卡结果', data, type);
  66. // 分析调试信息
  67. if (data.data) {
  68. analyzePhotoData(data.data);
  69. }
  70. })
  71. .catch(error => {
  72. addResult('请求错误', error.message, 'error');
  73. });
  74. }
  75. function analyzePhotoData(data) {
  76. let analysis = [];
  77. // 检查照片相关字段
  78. analysis.push(`photoBase64字段存在: ${data.hasOwnProperty('photoBase64')}`);
  79. analysis.push(`photoBase64长度: ${data.photoBase64 ? data.photoBase64.length : 0}`);
  80. analysis.push(`hasPhoto: ${data.hasPhoto}`);
  81. analysis.push(`photoFormat: ${data.photoFormat || '未设置'}`);
  82. analysis.push(`photoSize: ${data.photoSize || 0}`);
  83. // 如果有照片数据,分析前几个字符
  84. if (data.photoBase64 && data.photoBase64.length > 0) {
  85. const preview = data.photoBase64.substring(0, 50);
  86. analysis.push(`BASE64前50字符: "${preview}"`);
  87. // 检查是否是有效的BASE64
  88. try {
  89. atob(data.photoBase64.substring(0, Math.min(100, data.photoBase64.length)));
  90. analysis.push('BASE64格式: 有效');
  91. } catch (e) {
  92. analysis.push('BASE64格式: 无效 - ' + e.message);
  93. }
  94. }
  95. addResult('照片数据分析', analysis.join('\n'), 'warning');
  96. }
  97. function clearResults() {
  98. document.getElementById('results').innerHTML = '';
  99. }
  100. // 页面加载完成后的说明
  101. window.onload = function() {
  102. addResult('调试模式启动',
  103. `华视读卡器照片功能调试模式已启动。
  104. 本次修复内容:
  105. 1. 修正函数名:Getbase64JpgDataU 和 Getbase64BMPDataU (添加U后缀)
  106. 2. 修正缓冲区大小:JPG=38862*2字节,BMP=38862*4字节
  107. 3. 改进判断逻辑:只有长度>50才认为是有效照片
  108. 4. 添加详细调试信息
  109. 如果仍然获取不到照片,可能的原因:
  110. 1. 华视SDK版本不支持这些BASE64函数
  111. 2. 需要特殊的初始化或权限
  112. 3. 函数签名不正确
  113. 请先测试读卡,然后查看调试信息。`, 'info');
  114. };
  115. </script>
  116. </body>
  117. </html>