Question

我尝试调试在本地主机上运行的由Next.js前台管理的API。我遇到了CORS的麻烦。

我的API文件是：

import Cors from "micro-cors"

const handler = async (req, res) => {
    ...
    return res.status(STATUS_200_OK).json(askers)
}

const cors = Cors({
   allowMethods: ["GET", "OPTIONS"],
})

export default cors(handler)

当我的下一页要获取此端点时，出现错误500，内容如下：

可以从原始位置获取“ https://my-beautiful-url.fr/api/login” “ http://localhost:3000”已被CORS政策屏蔽：对预检请求未通过访问控制检查：它没有 HTTP正常状态。

请求标头

Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: fr-FR,fr;q=0.9,en-US;q=0.8,en;q=0.7
Access-Control-Request-Headers: content-type
Access-Control-Request-Method: POST
Connection: keep-alive
Host: medle-dev.fabrique.social.gouv.fr
Origin: http://localhost:3000
Referer: http://localhost:3000/
Sec-Fetch-Mode: cors
Sec-Fetch-Site: cross-site
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.117 Safari/537.36

响应头

Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: X-Requested-With,Access-Control-Allow-Origin,X-HTTP-Method-Override,Content-Type,Authorization,Accept
Access-Control-Allow-Methods: POST,OPTIONS
Access-Control-Allow-Origin: *
Access-Control-Max-Age: 86400
Connection: keep-alive
Content-Length: 108
Content-Type: application/json; charset=utf-8
Date: Wed, 22 Jan 2020 18:25:16 GMT
Vary: Accept-Encoding

我相信Access-Control-Allow-Methods: POST,OPTIONS和Access-Control-Allow-Origin: *可以解决问题，但不能满足要求。

我已经阅读了Stack Overflow上的一些答案，告诉我Chrome过去在支持本地主机的CORS时出现问题，但是Firefox返回相同类型的错误。

我怀疑主机上的http和远程主机上的https之间的通信被禁止。是原因吗？有办法克服吗？

响应CORS飞行前选项请求出现500错误

0 个答案: