ExpressJS默认CORS设置是什么？跨域报错及opaque response咨询

Express默认的CORS规则是什么？ #

Express框架本身默认不会添加任何CORS相关的响应头。它既没有主动拦截跨域请求，也没有做跨域放行配置，你看到的CORS报错本质是浏览器默认同源策略的生效逻辑：浏览器检测到接口响应里没有要求的Access-Control-Allow-Origin头，就会拦截前端脚本对响应内容的读取——实际上请求本身已经正常发到你的Express服务端了。
这也是你搜"禁用Express CORS"出来全是启用CORS教程的原因：CORS是浏览器端实现的安全规则，服务端根本不存在"禁用CORS"的开关，你能做的只有返回符合CORS规范的响应头，告诉浏览器"这个来源的请求我认可，允许前端脚本读取响应"。

你需要怎么配置？ #

如果你的需求是允许任意来源的请求正常访问接口、拿到响应结果，本质就是配置CORS允许所有来源，也就是教程里说的"启用CORS"的最宽松场景，有两种常用实现方式：

• 用生态内通用的cors中间件，配置成本最低：
  1. 安装依赖：npm install cors
  2. 在所有路由定义前挂载中间件，即可全局放行所有跨域请求：

  const express = require('express')
  const cors = require('cors')
  const app = express()
  
  // 挂载后所有路由自动支持任意来源跨域
  app.use(cors())
  app.use(express.json())
  
  app.post('/api', (req, res) => {
    // 你的接口业务逻辑
    res.json({ code: 0, msg: 'success' })
  })
  
  app.listen(3000)
  

• 不想引入第三方依赖的话，自己写几行中间件加响应头也能实现：

  app.use((req, res, next) => {
    // 允许所有来源访问
    res.setHeader('Access-Control-Allow-Origin', '*')
    // 允许的跨域请求方法
    res.setHeader('Access-Control-Allow-Methods', 'GET,POST,PUT,DELETE,OPTIONS')
    // 允许前端携带的请求头
    res.setHeader('Access-Control-Allow-Headers', 'Content-Type')
    // 跨域预检OPTIONS请求直接返回200，不需要走业务逻辑
    if (req.method === 'OPTIONS') return res.sendStatus(200)
    next()
  })
  

注意：如果你的接口需要校验Cookie、Authorization这类身份凭证，Access-Control-Allow-Origin不能设为通配符*，必须动态匹配请求的Origin值，同时要加上Access-Control-Allow-Credentials: true的响应头，否则凭证不会被携带，浏览器也会拦截响应。

报错里的"opaque response（不透明响应）"是什么意思？ #

报错提示里提到的设置mode: 'no-cors'的方案，是fetch提供的特殊请求模式：开启这个模式后浏览器不会做CORS校验，请求能正常发出去，但你拿到的是不透明响应：

• 你无法读取响应的状态码、响应头、响应体的任何有效内容
• 你只能确认请求已经发出，拿不到任何服务端返回的业务数据
  这种模式只适合单向发数据、完全不需要关心返回结果的场景（比如简单的埋点上报、像素追踪），如果你需要拿到接口返回的数据做后续业务处理，这个模式完全没用，还是得通过配置CORS响应头解决问题。

内容的提问来源于stack exchange，提问作者c136