Nuxt.js 解决跨域CORS问题 has been blocked by CORS policy: No 'Access-Control-Allow-Origin'

  1. 安装:
npm install @nuxtjs/axios @nuxtjs/proxy --save

     2.nuxt.config.js 配置

modules: [
    '@nuxtjs/axios',
    '@nuxtjs/proxy'
  ],
  axios: {
      proxy: true, // 表示开启代理
      prefix: '/api', // 表示给请求url加个前缀 /api
      credentials: true // 表示跨域请求时是否需要使用凭证
  },
  proxy: {
    '/api': {
      target: 'http://127.0.0.1:8080', // 目标接口域名
      changeOrigin: true, // 表示是否跨域
      pathRewrite: {
        '^/api': '/', // 把 /api 替换成 /
      }
    }
  },
  build: {
    vendor: ['axios'] //为防止重复打包
  }

3.测试,发现跨域请求成功

主要增加四点内容:
1、modules
2、axios配置
3、proxy配置
4、build 打包配置

 

posted @   LilLazy  阅读(1221)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?
点击右上角即可分享
微信分享提示