问答

vue 内置代理服务器配置不生效?

作者:admin 2021-05-13 我要评论

今天在测试vue内置的代理服务器的时候出现了问题,在配置好之后所发的请求并没有改变。(代理配置没有生效) 因为使用的是vuecli3创建的项目,所以自己在与src同级...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

今天在测试vue内置的代理服务器的时候出现了问题,在配置好之后所发的请求并没有改变。(代理配置没有生效)

因为使用的是vuecli3创建的项目,所以自己在与src同级下创建了vue.config.js文件,下面就是里面的代码。

module.exports = {
    devServer: {
        proxy: {
            "/api": {
                target: "http://***.***.***.***:3000",  // 外部引入的url,连接的后端的服务器
                ws: false,
                changeOrigin: true,
                pathRewrite: {
                    '^/api': ''
                }
            }
        }
    }
}

图片.png
项目重启是使用的serve,也就是说项目使用了vue.config.js

图片.png
这事我在页面中简单请求方式这里使用了axios。

图片.png
发送请求后看到的请求地址就是图中显示的,并不是我在vue.config.js中配置的接口地址。

找了好多文章也没有解决的方法! 请大佬们指点迷津。 小子在这里谢过了。

###
devServer: {
    proxy: {
        logLevel: "debug",
    }
}

可以打开日志,看下转发过程中终端输出的内容,方便定位问题。

###

前端部分没有问题,axios发出的/api/fenlei请求是发给devServer的,然后devServer再转发给你真实的后端地址,所以请检查后端是否有该接口。

###

还有一个问题就是提醒一下。 再配置好代理服务器时前端在浏览器中展示得请求地址不是自己配置后得转发地址,而是自己得本地地址。只要自己的配置没有问题就行。最后可以使用上面的打印日志的方式打印出具体的转发信息。(注日志的输出不是在浏览器中而是在自己的启动服务的命令行中。)

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • vue 内置代理服务器配置不生效?

    vue 内置代理服务器配置不生效?

  • this.$route.query 获取不到值

    this.$route.query 获取不到值

  • react antd  里面的tree title 自定义

    react antd 里面的tree title 自定义

  • 这里的屏蔽 this 是什么语法?

    这里的屏蔽 this 是什么语法?

腾讯云代理商
海外云服务器