webpack中，devServer.proxy跨域无效的解决办法

最新推荐文章于 2024-05-12 21:27:07 发布
最新推荐文章于 2024-05-12 21:27:07 发布
阅读量8.1k 收藏 8
点赞数 6
分类专栏： 前端 webpack
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/aexwx/article/details/105989931
版权

首先是常规配置,重点是看后面的2个细节

 

重点是留意2个细节，那就是发起请求时，网址不要填写完整域名，用/开头即可。

第一个细节：

错误网址：

正确网址，用/开头即可

第二个细节

如果使用了axios,那么axios.defaults.baseURL这个功能一定要注释掉！

如果使用了axios,那么axios.defaults.baseURL这个功能一定要注释掉！

如果使用了axios,那么axios.defaults.baseURL这个功能一定要注释掉！

大猫会长
关注
  • 6
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
webpack-dev-server原理解析及其中跨域解决方法
陈开心的博客
01-21 1562
webpack proxy ,就是 webpack 提供的解决跨域的方案。其基本行为是接受客户端发送的请求后转发给其他的服务器，目的是为了解决在开发模式下的跨域问题。
proxy跨域不生效_webpack proxy 不生效
weixin_29028611的博客
12-24 1415
配置的代理未生效，还是会报跨域请求，请问下，配置哪里有问题谢谢wepack.config.dev.js:devServer: {inline: true,port: 3333,historyApiFallback: true,proxy: {'/crm-manage-web/': {target: 'http://192.168.27.27:7002',secure: true,changeOri...
抽丝剥茧：详述一次DevServer Proxy配置无效问题的细致排查过程
最新发布
hello ice cream
05-12 999
事情的起因是这样的，在一个已上线的项目中，其中一个包含登录和获取菜单的接口因响应时间较长，后端让我尝试未经服务转发的另一域名下的新接口，旧接口允许跨域请求，但新接口不允许本地访问（只允许发布测试/生产的域名访问）。
vue-cli之webpack的proxyTable无效的解决方案
dearbaba_8520的博客
06-09 212
vue-cli之webpack的proxyTable无效的解决方案
devServer.proxy不生效问题解决
k0933的博客
11-14 2089
devServer.proxy不生效问题解决
使用webpack的proxy来解决跨域
qq_33759361的博客
12-23 1416
使用webpack的proxy来解决跨域
webpack使用proxy代理时pathRewrite不生效的分析
热门推荐
追风Programer的博客
12-21 3万+
目录   写在前面 概述前端打包工具 直入主题pathRewrite 写在前面 近日来，连续高压的做项目，都没时间来写点东西，今天浏览帖子时发现好多同学在问proxy使用pathRewrite重写路径时不生效的问题，一时兴起就想写篇文章告诉还不清楚的同学们。 概述前端打包工具 由于近些年来react、vue等MVVM框架的流行，使得前端的打包工具更倾向于webpack，相比传统的打...
Webpack devServer中的 proxy 实现跨域的解决
08-27
主要介绍了Webpack devServer中的 proxy 实现跨域的解决，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
使用webpack-dev-server处理跨域请求的方法
08-27
首先，需要在build/webpack.dev.conf.js中添加proxy配置项，这个配置项可以将所有请求代理到指定的网站。例如： proxyTable: { '/': { target: 'http://api.xxx.com', changeOrigin: true, secure: false } } ...
详解webpack-dev-server使用http-proxy解决跨域问题
08-28
主要介绍了详解webpack-dev-server使用http-proxy解决跨域问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Webpack-dev-server的proxy用法
轻风细雨_林木木
03-03 1153
参考资料：https://www.jianshu.com/p/f489e7764cb8 实际使用：
博客摘录「 vue.config.js 中 devServer.proxy 配置说明，以及配置正确不生效问题」2023年5月17日
m0_49916028的博客
05-17 141
还有一点就是，即使我们的代理生效了，但是在浏览器请求头中展示的也不是配置的代理地址；
详解Webpack devServer的proxy用法
muzidanwu的博客
09-30 2224
解决开发环境的跨域问题(不用在去配置nginx和host, 爽歪歪~~) F12查看网络请求路径，还是原来的，所以只能从效果上去观察是否正确代理了 基本用法 mmodule.exports = { //... devServer: { proxy: { '/api': 'http://localhost:3000' } } }; //请求到 /api/xxx 现在会被代理到请求 http://localhost:3000/api/xxx, //例如 /api/us
proxy代理不生效、vue config.js不生效解决方法
weixin_47379721的博客
01-06 7943
vue config.js 配置跨域不生效已解决、proxy代理不生效已解决、axios配置跨域不生效已解决、springboot跨域设置已解决
【解决webpack-dev-server 动态配置代理问题】
Z_huade的博客
04-25 5709
在常规开发中，基本上都会有好几套环境，开发环境dev.com,测试环境test.com。我们在对接不同的环境联调的时候，一般是通过切换target，来实现连接不同的环境。然而，总是需要切换不同的域名，或者与多个后端同事协同开发的时候，经常切换target，那就得经常重启服务，这就让人很难受了
踩坑-vue项目用webpack中devServer配置proxy代理解决跨域 不生效问题
qq_41554101的博客
05-27 4638
vue项目用webpack中devServer配置proxy代理解决跨域 不生效问题 登录接口写入cookie一直失败，导致后续接口请求发不出去跨域报401 后端在各种原因之下暂时无法解决，只能前端暂时配代理开发 但是发现代理配了之后一直不生效，仍然存在跨域问题 ...
vue devServer.proxy代理，统一后端域名配置和跨域解决
向宇
07-21 1649
vue devServer.proxy代理，统一后端域名配置和跨域解决，在实际开发过程中，前后端分离必定会存在跨域，配置同意域名，设置代理解决这个问题。—— 向宇
vue-cli3.x 4.x通过devServer配置代理解决跨域问题
bamboozjy的博客
08-03 1340
在vue.config.js中配置devServer项目,如下:可以配置多个代理地址 devServer: { // open: process.platform === 'demo', // host: 'localhost', // port: 8080, // open: true, //配置自动启动浏览器 proxy: { "/opAdmin": { target: "http://116.65.61.193:8081",
axios proxy代理不成功
m0_50233720的博客
08-24 2169
跨域代理
vue中怎么在devserver中解决跨域问题
04-21
可以通过配置webpack.dev.conf.js文件来解决vue中的跨域问题，具体方法如下： 1. 在config目录下新建一个文件proxyTable.js，用来配置跨域代理。 2. 在webpack.dev.conf.js文件中引用proxyTable.js文件，并在devServer中的proxy属性配置中增加proxyTable.js中的代理设置。 例如，你的后端服务地址是http://localhost:8080，而你的前端开发地址是http://localhost:8081，那么你可以在proxyTable.js文件中配置如下的代理： module.exports = { "/api": { target: "http://localhost:8080", changeOrigin: true, pathRewrite: { "^/api": "" } } } 在webpack.dev.conf.js文件中引用proxyTable.js文件，并在devServer中的proxy属性配置中增加上面的代理设置： const proxyTable = require('./proxyTable') devServer: { proxy: proxyTable } 这样，当你在前端访问/api/foo时，代理会将请求转发到http://localhost:8080/foo。这样就能解决vue中devserver的跨域问题了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值