Warm tip: This article is reproduced from serverfault.com, please click

reactjs-NextJs CORS问题

(reactjs - NextJs CORS issue)

发布于 2020-11-29 09:20:28

我在Vercel的www.example.com上托管了一个Next.js应用程序,该应用程序需要与在另一服务器api.example.com上托管的后端.NET Core Web API进行通信。.NET核心Web API已配置为允许CORS,但我的Next.js一直抱怨当我使用AXIOS提取数据时无法显示数据,因为响应缺少allow-cors标头:

从CORS策略阻止对来自源“ http://www.example.com”的“ https://api.example.com”处的XMLHttpRequest的访问:对预检请求的响应未通过访问控制检查:否“访问” -Control-Allow-Origin'标头出现在请求的资源上

当我使用本地运行它时,它工作正常npm run dev,但在构建然后运行时不起作用npm run start

有谁知道如何在生产中解决cors问题?

Questioner
Yoope
Viewed
11
3,597 2021-03-27 19:57:39

我在这里找到了解决方案

基本上,我只需要在根目录中添加next.config.js文件并添加以下内容:

// next.config.js
module.exports = {
    async rewrites() {
        return [
          {
            source: '/api/:path*',
            destination: 'https://api.example.com/:path*',
          },
        ]
      },
  };