Nuxt JS项目调用本地Node JS接口遇CORS错误请求失败求助

方法一：在Node JS后端开启CORS支持 #

Postman能正常请求说明后端接口本身没问题，只是没允许前端域名的跨域请求，直接在后端配置即可：

• 安装cors包：npm install cors
• 在Node项目入口文件（比如app.js）添加配置：

const cors = require('cors');
const app = express();

// 允许Nuxt项目所在域名跨域（默认Nuxt运行在3000端口）
app.use(cors({
  origin: 'http://localhost:3000',
  credentials: true // 不需要携带Cookie等凭证可删除该行
}));

重启Node后端后再测试请求。

方法二：用Nuxt代理功能转发请求 #

如果不想修改后端，可通过Nuxt服务器做反向代理绕开浏览器的同源限制：

1. 安装代理依赖：npm install @nuxtjs/proxy
2. 修改nuxt.config.js配置：

export default {
  modules: [
    '@nuxtjs/axios',
    '@nuxtjs/proxy' // 新增代理模块
  ],
  axios: {
    baseURL: '/api', // 改为相对路径
    proxy: true // 开启代理
  },
  proxy: {
    '/api': {
      target: 'http://localhost:3001', // 你的Node后端地址
      pathRewrite: { '^/api': '' } // 转发时去掉/api前缀
    }
  }
}

3. 代码中发起请求时用相对路径，比如this.$axios.get('/api/users')，会自动转发到http://localhost:3001/users，不会触发CORS错误。

为什么你之前的配置无效？ #

你直接将baseURL设为后端地址，相当于浏览器直接向后端发请求，触发了浏览器的同源策略限制。Postman不属于浏览器环境，不受同源策略约束，所以能正常请求。

内容的提问来源于stack exchange，提问作者Hanifi Çorak