VUE解决跨域问题

182 阅读1分钟

发送请求时如果我们发送请求所在的服务器端口,与请求的端口不一致,不会拒绝,但是我们收不到信息,解决方法是配置一个代理服务器,我们请求发到代理服务器,由代理服务器给我们发送请求给目标服务器。

首先我们需要配置一台代理服务器,在vue中很简单,只需要在创建Vue实例时传入一个derServer配置对象,如下
//我们配置的代理服务器端口为8080
//derServer{
        proxy{
            '/api':{  //api为了防止发送多个请求时,走不同的配置
            target:url //代表的是目标服务器地址
            changeOrigin :true //对目标服务器是否伪装,如果伪装,则端口号与目标服务器一致,解决跨域问题,
            pathRewriter:{'/api',''} 重写请求信息,用正则把'/api'替换为空
            }
        
     } 
 }

请求发送

axios.get('http://127.0.0.1:8080')

这样就完成了跨域请求问题