预检响应中的 Access-Control-Allow-Header 中的允许请求标头字段

Posted 2023-03-04

【中文标题】预检响应中的 Access-Control-Allow-Header 中的允许请求标头字段

【英文标题】：Allow request header filed in Access-Control-Allow-Header in preflight response

【发布时间】：2018-10-19 00:27:59

【问题描述】：

我尝试 axios 调用外部域： https://viacep.com.br/ws/20021040/json/（拨打电话以返回有关邮政编码的任何信息）

axios.get('https://viacep.com.br/ws/20021040/json')
              .then((response) => 
                alert(JSON.stringify(response))
              )
              .catch((error) => 
                alert(error)
              )

在前端我使用：

axios: v0.17.1 vue: v2.5.3 webpack：3.6.0

在后端我使用 expressjs/nodejs 并安装 express cors 来处理这种情况。

节点 9.8.0 表达 4.15.2 cors 2.8.4

我需要弄清楚如何在预检响应中允许 Access-Control_allow-Headers 中的 Request 标头字段授权正常工作。

我正在我的 localhost:8021 中开发

授权是带有我的身份验证凭据（JWT）的令牌。

在下面的图片中，所有测试都有注释。

最好的问候。

我最后的测试是：

var corsOptions = 
    origin: true,
    allowedHeaders: ['Content-Type', 'authorization', 'Content-Length', 'X-Requested-With', 'Accept'],
    exposedHeaders: ['authorization'],
    methods: ['GET', 'PUT', 'POST', 'DELETE', 'OPTIONS'],
    // optionsSuccessStatus: 204, // some legacy browsers (IE11, various SmartTVs) choke on 204
    preflightContinue: false

app.use(cors(corsOptions))

但无论如何它都不起作用... =(

【问题讨论】：

Link1 和 Link2 可能重复

不，因为我试过了，但不起作用。 app.use(function(req,res,next) // res.header('Access-Control-Allow-Origin', "localhost:8021") // res.header('Access-Control-Allow-Methods', "GET,PUT,POST,DELETE,OPTIONS") console.log('vou fazer'); res.header("Access-Control-Allow-Headers", "authorization, vai tomar no cu"); next() )

【参考方案1】：

试试：

res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept')
res.header('Access-Control-Allow-Methods', 'GET, PUT, POST, DELETE, PATCH, OPTIONS');