vue4 axios代理 跨域

常见跨域的解决办法
前端常见跨域解决方案（全）

vue cli webpack相关

vue cli 的 devServer.proxy配置

axios中文说明

新建文件vue.config.js

module.exports = {
    
    
  devServer: {
    
    
    proxy: {
    
    
      '/api': {
    
    // 使用"/api"来代替"http://f.apiplus.c"
        // target: 'http://192.168.0.102:8080', // 源地址
        target: 'http://118.178.84.155:5050/api', // 源地址
        changeOrigin: true, // 改变源
        pathRewrite: {
    
    
          '^/api': '' // 路径重写
        }
      }
    }
  }
}

this.$axios.get('/api/4g/status').then((res) => {
    
    
      console.log(res)
    })

分割线

这里一定注意为什么一直爆红波浪线，因为开启了eslints，格式有问题

找了好久，才发现是空格的问题，只让空两格而tab键是四格

这里特别感谢我王哥
最初是为了解决跨域问题

侬，就是这个

服务器和本地的地址不一样，浏览器的保护策略，不同源不能访问
这里不叙述什么是同源等等
就记录问题出现和解决的过程

百度了好多vue如何解决跨域什么的，搜出来的都不是想要的答案

问了那边前端的，没得到相应的答案，最后还是王哥厉害
他丢给我一个 链接
他让我全局搜proxy
搜devServer
然后 找到对应的配置放在哪里的
我就去官网找，也就是最开头那两个官网，
后来就被我弄好了，其实也不难

反正开心了，干别的去了