yeguodong
/
mhCardReader


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
							<!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; background: #f5f5f5; }
        .container { max-width: 800px; margin: 0 auto; background: white; padding: 20px; border-radius: 8px; }
        .test-section { margin: 20px 0; padding: 15px; border: 1px solid #ddd; border-radius: 5px; }
        .result { margin: 10px 0; padding: 10px; border-radius: 4px; }
        .result.success { background: #d4edda; border: 1px solid #28a745; }
        .result.error { background: #f8d7da; border: 1px solid #dc3545; }
        .result.info { background: #d1ecf1; border: 1px solid #17a2b8; }
        button { padding: 10px 20px; margin: 5px; border: none; border-radius: 4px; cursor: pointer; background: #007bff; color: white; }
        button:hover { background: #0056b3; }
        pre { background: #f8f9fa; padding: 10px; border-radius: 4px; overflow-x: auto; }
    </style>
</head>
<body>
    <div class="container">
        <h1>🔧 路由修复验证测试</h1>
        
        <div class="test-section">
            <h2>测试各个路由端点</h2>
            <p>点击下面按钮逐一测试各个API端点，验证路由冲突是否已解决：</p>
            
            <button onclick="testEndpoint('/readcard/huashi/health', '健康检查')">🏥 健康检查</button>
            <button onclick="testEndpoint('/readcard/huashi/status', '设备状态')">📊 设备状态</button>
            <button onclick="testEndpoint('/readcard/huashi/help', 'API帮助')">📖 API帮助</button>
            <button onclick="testEndpoint('/readcard/huashi/simple?action=status', '简单调用')">🔧 简单调用</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 testEndpoint(endpoint, name) {
            const url = `http://localhost:8321${endpoint}`;
            addResult(`🚀 测试 ${name}`, `正在访问: ${url}`, 'info');
            
            fetch(url, {
                method: 'GET',
                headers: { 'Content-Type': 'application/json' }
            })
            .then(response => {
                if (response.ok) {
                    return response.json();
                } else {
                    throw new Error(`HTTP ${response.status}: ${response.statusText}`);
                }
            })
            .then(data => {
                addResult(`✅ ${name} 成功`, data, 'success');
            })
            .catch(error => {
                addResult(`❌ ${name} 失败`, error.message, 'error');
            });
        }

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

        // 页面加载提示
        window.onload = function() {
            addResult('🎯 路由修复验证', 
                `本页面用于验证Web API路由冲突修复是否成功。

🔧 修复内容：
• 在Startup.cs中启用了属性路由 (MapHttpAttributeRoutes)
• 保留约定路由作为后备
• 所有GET方法现在应该能正确路由

✅ 预期结果：
• 健康检查 → 返回服务状态信息
• 设备状态 → 返回读卡器连接状态
• API帮助 → 返回完整API文档
• 简单调用 → 返回设备状态（通过action=status参数）

❌ 如果仍有问题：
请检查程序是否重启，以及路由配置是否正确加载。`, 'info');
        };
    </script>
</body>
</html>