Vue框架的跨域问题

vue框架中的跨域解决:

​ 解决方法千千万,这里我只提供了两种解决方法:

方法1:下载插件 http-proxy-middleware

使用详情传送门(C站大佬文):
https://blog.csdn.net/kuangshp128/article/details/77714128
官方文档传送门:
https://www.npmjs.com/package/http-proxy-middleware

方法2:使用Vue自带的跨域配置(推荐使用)

​ vue-cli内置了跨域插件,我们使用时只需要在vue.config.js文件下配置相关所需配置即可使用,简单快捷,所以推荐使用.

// 跨域配置(vue自带)
  devServer:{
    proxy:{
        //名称自定义,不可重复
      "/api":{
        // 目标URL
        target:'https://m.mafengwo.cn',
        changeOrigin:true,//允许跨域
        // 路径重写
        pathRewrite:{
          "^/api":''
        }
         //如需多个接口跨域,重复上述操作
      }
    }
  }


//使用时,用  /api (自定义名称)代替域名
fetch('/api/index/login')