vue里的vue.config跨域无效问题...

这是vue.config 里的代码:

module.exports = {
  devServer: {
    port: "8080",
    open: false,
    proxy: {
      "/api": {
        target: "xxx",//这里我把自己测试的地址换成了xxx 自己测试的时候是用真实的地址
        changeOrign: true, // 跨域
        pathRewrite: {
          "^/api": ""
        }
      }
    }
  }
}

这是我组件里用axios发送请求的代码:

import axios from 'axios' //在最上面这个组件里引入的axios,main js里没有引入
axios.post('/api/auth/login').then(response=>{

console.log(response);

}).catch(error=>{

console.log(error);

})

执行结果: 貌似是/api并没有替换成target的地址…
vue里的vue.config跨域无效问题...
直接不使用/api 提示我跨域问题…
vue里的vue.config跨域无效问题...
自学前端半年出头,第一次接触这种东西..请大佬指教…使用的最新的脚手架和vue3…

讨论数量: 5

这个 devServer 是本地调试的时候才生效的,配置的意思是 /api 相关的请求发送到本地测试环境后,转发到 targat 对应机器上(避免跨域等问题),所以并不会跳转,而是请求 /api/xxx 就会间接请求 http://target/xxx。 如果这一流程出现问题,可以查看 target 对应的服务器日志,同时也需要查看 npm run serve 的命令行日志,都会有对 debug 有所帮助。

更多配置官网地址:webpack.docschina.org/configuratio...

3年前 评论
cy-6359 (楼主) 3年前

遇到一模一样的问题 请问楼主怎么解决的?

1年前 评论

请问解决了吗

1年前 评论

这里统一回复一下,当年自学的时候,完全就是因为自己太菜了,具体什么原因忘了,反正发完这个帖子自己仔细排查了一下就解决了,想不到还有人挖坟 。。。

1年前 评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!