123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141 |
- <!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: 1000px; 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; }
- .error { color: red; }
- .success { color: green; }
- .info { color: blue; }
- pre { white-space: pre-wrap; word-wrap: break-word; }
- </style>
- </head>
- <body>
- <div class="container">
- <h1>华视读卡器简单测试</h1>
-
- <div class="test-section">
- <h2>测试功能</h2>
- <button onclick="testSimpleCall()">简单读卡测试</button>
- <button onclick="testHealthCheck()">健康检查</button>
- <button onclick="testDeviceStatus()">设备状态</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}</h3>`;
- if (typeof data === 'object') {
- content += `<pre>${JSON.stringify(data, null, 2)}</pre>`;
- } else {
- content += `<p>${data}</p>`;
- }
-
- div.innerHTML = content;
- results.appendChild(div);
- results.scrollTop = results.scrollHeight;
- }
- function testSimpleCall() {
- addResult('开始简单读卡测试', '使用简单API端点...', 'info');
-
- // 使用简单的GET请求避免路由冲突
- 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) {
- analyzePhotoData(data.data);
- }
- })
- .catch(error => {
- addResult('请求错误', error.message, 'error');
- });
- }
- function testHealthCheck() {
- fetch('http://localhost:8321/readcard/huashi/health', {
- method: 'GET'
- })
- .then(response => response.json())
- .then(data => {
- addResult('健康检查', data, 'info');
- })
- .catch(error => {
- addResult('健康检查错误', error.message, 'error');
- });
- }
- function testDeviceStatus() {
- fetch('http://localhost:8321/readcard/huashi/status', {
- method: 'GET'
- })
- .then(response => response.json())
- .then(data => {
- const type = data.connected ? 'success' : 'warning';
- addResult('设备状态', data, type);
- })
- .catch(error => {
- addResult('设备状态错误', error.message, 'error');
- });
- }
- function analyzePhotoData(data) {
- let analysis = [];
-
- analysis.push(`photoBase64字段: ${data.hasOwnProperty('photoBase64') ? '存在' : '不存在'}`);
- analysis.push(`photoBase64长度: ${data.photoBase64 ? data.photoBase64.length : 0}`);
- analysis.push(`hasPhoto: ${data.hasPhoto}`);
- analysis.push(`photoFormat: ${data.photoFormat || '未设置'}`);
- analysis.push(`photoSize: ${data.photoSize || 0}`);
-
- if (data.photoBase64 && data.photoBase64.length > 0) {
- const preview = data.photoBase64.substring(0, 20);
- analysis.push(`BASE64前20字符: "${preview}"`);
- }
-
- addResult('📸 照片数据分析', analysis.join('\n'), 'info');
- }
- function clearResults() {
- document.getElementById('results').innerHTML = '';
- }
- // 页面加载完成后的说明
- window.onload = function() {
- addResult('测试说明',
- `华视读卡器简单测试页面
-
- 使用GET方法避免路由冲突问题。
-
- 测试步骤:
- 1. 先点击"健康检查"确认服务正常
- 2. 点击"设备状态"检查读卡器状态
- 3. 将身份证放在读卡器上
- 4. 点击"简单读卡测试"
- 5. 查看照片数据分析结果
- 注意:这个页面使用简化的API端点,避免复杂的POST请求路由冲突。`, 'info');
- };
- </script>
- </body>
- </html>
|