Node.js Express预检请求成功但实际GET请求遇CORS问题求助

问题背景 #

使用Node.js + Express开发后端服务，前端部署在GitHub Pages，后端通过ngrok对外暴露。出现以下CORS相关异常：

• 浏览器预检OPTIONS请求成功，能正常获取后端配置的所有响应头
• GET请求失败，无法获取后端返回的响应头，且ngrok日志显示未收到该实际GET请求
• POST请求无异常，可正常交互
• 尝试使用官方cors模块替换自定义CORS中间件，问题未得到改善

相关代码片段 #

自定义CORS中间件配置 #

app.use((req, res, next) => {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'Content-Type,Authorization,Access-Control-Allow-Origin');
    res.header('Access-Control-Allow-Methods', 'GET,POST,PUT,DELETE');

    next();
});

异常GET请求代码 #

fetch('https://causal-scorpion-rapidly.ngrok-free.app/api/classes?teacherId=own', {
    method: 'GET',
    headers: {
        'Content-Type': 'application/json',
        'Authorization': localStorage.getItem('authorization')
    }
})
    .then(res => {
        if (res.ok) return res.json();
        if (res.status === 401 || res.status === 403) {
            // 权限校验失败处理逻辑
        }
        throw new Error(res);
    })
    .then(response => {
        // 业务处理逻辑
    })

正常POST请求代码 #

fetch('https://causal-scorpion-rapidly.ngrok-free.app/api/classes', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
        'Authorization': localStorage.getItem('authorization')
    },
    body
})
    .then(res => {
        // 响应处理逻辑
    })
    .then(response => {
        // 业务处理逻辑
    })
}

解决方案 #

在GET请求的请求头中添加ngrok-skip-browser-warning: 'true'字段，修改后的请求代码如下：

fetch('https://causal-scorpion-rapidly.ngrok-free.app/api/classes?teacherId=own', {
    method: 'GET',
    headers: {
        'Content-Type': 'application/json',
        'Authorization': localStorage.getItem('authorization'),
        'ngrok-skip-browser-warning': 'true'
    }
})
// 后续处理逻辑保持不变

内容的提问来源于stack exchange，提问作者Valdir José Wermann Júnior