解决开发跨域环境. 使用代理proxy

第一步..在  env.development 中修改. 开发环境

 # 第一步
VUE_APP_BASE_API ='/api'

-------------------------------------------

'/api' 这个可以随意填写.

import axios from 'axios'
const _axios = axios.create({
  baseURL: process.env.VUE_APP_BASE_API
})

VUE_APP_BASE_API  //这个和自己的配置有关系.

第二步..找到vue.config.js 文件

 devServer: {

    proxy: {
      '/api': //这里是你第一步配置的对应  基地址{
        target: 'http://localhost:3000'

        // 因为我自己本身的是  http://localhost:3000/api 所以我省略
        // 否则会在最后默认拼接/abc
        // 如果及地址不是你默认的/拼接.就使用下面方法去除.如果不去除结果就是
        // http://localhost:3000/abc
        // pathRewrite: {
        //   '^/abc': ''
        // }
      }
    }
}

-----------------------------------------------------
//'设置与自己接口拼接默认一致的情况下.不添加忽视'
 proxy: {
      '/api': {
        target: 'http://localhost:3000'
      }
    }

----------------------------------------------------
//如果不一样请添加忽视
 proxy: {
      '/abc': {
        target: 'http://localhost:3000/api'
         pathRewrite: {
           '^/abc': ''  //忽视为空.代表不需要拼接 否则效果 http://localhost:3000/api/abc
         }
      }
    }

方法2

1.创建一个文件夹.        C:\aaa

2.创建一个谷歌浏览器的快捷方式

3.在快捷方式点右键=>属性=>目标  移动到最后,加入空格,粘贴   --disable-web-security --user-data-dir=C:\aaa

//注意这里是在目标地址的最后面. 加上一个空格再复制下面全部代码

--disable-web-security --user-data-dir=C:\aaa  

4.点击确定,打开后就是跨域浏览器

Guess you like

Origin blog.csdn.net/wangyangzxc123/article/details/121308097