config-check.html 6.82 KB
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>配置文件检查</title>
  <script src="config.js"></script>
  <style>
    body {
      font-family: 'PingFang SC', 'Microsoft YaHei', Arial, sans-serif;
      margin: 20px;
      background: #f5f5f5;
    }
    .container {
      max-width: 800px;
      margin: 0 auto;
      background: white;
      padding: 20px;
      border-radius: 10px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    }
    .status {
      padding: 15px;
      margin: 15px 0;
      border-radius: 8px;
      font-family: monospace;
    }
    .status.success {
      background: #e8f5e9;
      border: 1px solid #4caf50;
      color: #2e7d32;
    }
    .status.error {
      background: #ffebee;
      border: 1px solid #f44336;
      color: #c62828;
    }
    .status.info {
      background: #e3f2fd;
      border: 1px solid #2196f3;
      color: #1565c0;
    }
    .btn {
      background: #2196f3;
      color: white;
      border: none;
      padding: 10px 20px;
      border-radius: 5px;
      cursor: pointer;
      margin: 5px;
    }
    .btn:hover {
      background: #1976d2;
    }
    pre {
      background: #f5f5f5;
      padding: 10px;
      border-radius: 5px;
      overflow-x: auto;
    }
  </style>
</head>
<body>
  <div class="container">
    <h1>🔧 配置文件检查工具</h1>
    
    <div class="status info">
      <strong>页面加载时间:</strong> <span id="loadTime">-</span>
    </div>
    
    <div class="status info">
      <strong>配置文件状态:</strong> <span id="configStatus">检查中...</span>
    </div>
    
    <div class="status info">
      <strong>当前环境信息:</strong> <span id="envInfo">-</span>
    </div>
    
    <div class="status info">
      <strong>API地址:</strong> <span id="apiUrl">-</span>
    </div>
    
    <div class="status info">
      <strong>环境切换测试:</strong>
      <button class="btn" onclick="testSwitchEnv('development')">切换到开发环境</button>
      <button class="btn" onclick="testSwitchEnv('production')">切换到正式环境</button>
    </div>
    
    <div class="status info">
      <strong>API连接测试:</strong>
      <button class="btn" onclick="testApiConnection()">测试API连接</button>
    </div>
    
    <div class="status info">
      <strong>详细配置信息:</strong>
      <pre id="configDetails">-</pre>
    </div>
    
    <div class="status info">
      <strong>控制台日志:</strong>
      <button class="btn" onclick="clearLog()">清除日志</button>
      <pre id="consoleLog">-</pre>
    </div>
  </div>

  <script>
    let logMessages = [];
    
    // 添加日志
    function addLog(message) {
      const timestamp = new Date().toLocaleTimeString();
      logMessages.push(`[${timestamp}] ${message}`);
      updateLogDisplay();
    }
    
    // 更新日志显示
    function updateLogDisplay() {
      document.getElementById('consoleLog').textContent = logMessages.join('\n');
    }
    
    // 清除日志
    function clearLog() {
      logMessages = [];
      updateLogDisplay();
    }
    
    // 页面加载完成后检查配置
    document.addEventListener('DOMContentLoaded', function() {
      document.getElementById('loadTime').textContent = new Date().toLocaleString();
      addLog('页面加载完成');
      
      // 开始检查配置
      checkConfig();
    });
    
    // 检查配置
    function checkConfig() {
      addLog('开始检查配置文件...');
      
      if (window.APP_CONFIG) {
        addLog('✅ APP_CONFIG 对象存在');
        document.getElementById('configStatus').textContent = '已加载';
        
        // 显示环境信息
        const envName = window.APP_CONFIG.getEnvName();
        const apiUrl = window.APP_CONFIG.getApiBaseUrl();
        
        document.getElementById('envInfo').textContent = envName;
        document.getElementById('apiUrl').textContent = apiUrl;
        
        addLog(`当前环境: ${envName}`);
        addLog(`API地址: ${apiUrl}`);
        
        // 显示详细配置
        const configDetails = {
          CURRENT_ENV: window.APP_CONFIG.CURRENT_ENV,
          ENV_CONFIG: window.APP_CONFIG.ENV_CONFIG,
          getApiBaseUrl: window.APP_CONFIG.getApiBaseUrl(),
          getEnvName: window.APP_CONFIG.getEnvName(),
          isDevelopment: window.APP_CONFIG.isDevelopment(),
          isProduction: window.APP_CONFIG.isProduction()
        };
        
        document.getElementById('configDetails').textContent = JSON.stringify(configDetails, null, 2);
        
      } else {
        addLog('❌ APP_CONFIG 对象不存在');
        document.getElementById('configStatus').textContent = '未加载';
        
        // 等待配置加载
        setTimeout(checkConfig, 100);
      }
    }
    
    // 测试环境切换
    function testSwitchEnv(env) {
      if (window.APP_CONFIG) {
        addLog(`尝试切换到 ${env} 环境...`);
        
        if (window.APP_CONFIG.switchEnvironment(env)) {
          addLog(`✅ 成功切换到 ${env} 环境`);
          
          // 更新显示
          const envName = window.APP_CONFIG.getEnvName();
          const apiUrl = window.APP_CONFIG.getApiBaseUrl();
          
          document.getElementById('envInfo').textContent = envName;
          document.getElementById('apiUrl').textContent = apiUrl;
          
          addLog(`新环境: ${envName}`);
          addLog(`新API地址: ${apiUrl}`);
        } else {
          addLog(`❌ 切换到 ${env} 环境失败`);
        }
      } else {
        addLog('❌ APP_CONFIG 未加载,无法切换环境');
      }
    }
    
    // 测试API连接
    async function testApiConnection() {
      if (!window.APP_CONFIG) {
        addLog('❌ APP_CONFIG 未加载,无法测试API');
        return;
      }
      
      const apiUrl = window.APP_CONFIG.getApiBaseUrl();
      if (!apiUrl) {
        addLog('❌ API地址为空');
        return;
      }
      
      addLog(`测试API连接: ${apiUrl}/api/oauth/Login`);
      
      try {
        const response = await fetch(`${apiUrl}/api/oauth/Login`, {
          method: 'GET'
        });
        
        if (response.status === 405) {
          addLog('✅ API连接成功!端点存在(GET方法不被允许是正常的)');
        } else {
          addLog(`API响应状态: HTTP ${response.status}`);
        }
      } catch (error) {
        addLog(`❌ API连接失败: ${error.message}`);
      }
    }
    
    // 重写console.log来捕获日志
    const originalLog = console.log;
    console.log = function(...args) {
      originalLog.apply(console, args);
      addLog('LOG: ' + args.join(' '));
    };
    
    const originalError = console.error;
    console.error = function(...args) {
      originalError.apply(console, args);
      addLog('ERROR: ' + args.join(' '));
    };
  </script>
</body>
</html>