Vue3项目打包后部署到服务器 请求不到后台接口解决方法


Posted in Javascript onFebruary 06, 2020

本地开发没问题能正常请求到接口,部署后页面也能展示出来就是接口的数据请求不到

network一看是这么个情况

Vue3项目打包后部署到服务器 请求不到后台接口解决方法

对比了本地的页面

Vue3项目打包后部署到服务器 请求不到后台接口解决方法

可以发现是remote address出了问题。

经过查询得知:Remote Address代表的是当前HTTP请求的远程地址,即HTTP请求的源地址。

我的猜想是proxy代理在本地环境下用的是localhost即127.0.0.1进行转发代理的,而部署到服务器后相当于换了个环境( ip地址和端口已经改变 ),此时proxy代理就出错了。

解决方法:

地址错误了,那就换到正确的地址。

即:本地开发环境 代理时用127.0.0.1,生产环境用服务器的ip

在Vue中要实现这个效果就需要用到全局环境变量了

Vue3项目打包后部署到服务器 请求不到后台接口解决方法

 

然后proxy代理和axios请求那也要改一下Vue3项目打包后部署到服务器 请求不到后台接口解决方法

 Vue3项目打包后部署到服务器 请求不到后台接口解决方法

至此问题解决

如果大家在学习中有任何补充,可以联系三水点靠木小编,感谢大家的学习。

Javascript 相关文章推荐
javascript eval和JSON之间的联系
Dec 31 Javascript
自制轻量级仿jQuery.boxy对话框插件代码
Oct 26 Javascript
使用js判断控件是否获得焦点
Jan 03 Javascript
高效的jquery数字滚动特效
Dec 17 Javascript
常用的js验证和数据处理总结
Aug 02 Javascript
在javascript中使用com组件的简单实现方法
Aug 17 Javascript
jQuery插件FusionCharts实现的2D柱状图效果示例【附demo源码下载】
Mar 06 Javascript
JavaScript学习总结(一) ECMAScript、BOM、DOM(核心、浏览器对象模型与文档对象模型)
Jan 07 Javascript
跨域请求两种方法 jsonp和cors的实现
Nov 11 Javascript
js实现的在本地预览图片功能示例
Nov 09 Javascript
JS获取表格视图所选行号的ids过程解析
Feb 21 Javascript
原生js中运算符及流程控制示例详解
Jan 05 Javascript
node.JS的crypto加密模块使用方法详解(MD5,AES,Hmac,Diffie-Hellman加密)
Feb 06 #Javascript
node.js开发辅助工具nodemon安装与配置详解
Feb 06 #Javascript
Vue表单控件数据绑定方法详解
Feb 05 #Javascript
Vue过渡效果之CSS过渡详解(结合transition,animation,animate.css)
Feb 05 #Javascript
vue 翻页组件vue-flip-page效果
Feb 05 #Javascript
在博客园博文中添加自定义右键菜单的方法详解
Feb 05 #Javascript
Vue中多元素过渡特效的解决方案
Feb 05 #Javascript
You might like
用PHP实现的随机广告显示代码
2007/06/14 PHP
php smarty截取中文字符乱码问题?gb2312/utf-8
2011/11/07 PHP
Zend的Registry机制的使用说明
2013/05/02 PHP
Laravel框架中扩展函数、扩展自定义类的方法
2014/09/04 PHP
9条PHP编程小知识及易犯的小错误
2015/01/22 PHP
php使用parse_str实现查询字符串解析到变量中的方法
2017/02/17 PHP
javascript Math.random()随机数函数
2009/11/04 Javascript
jQuery 开天辟地入门篇一
2009/12/09 Javascript
基于jquery的jqDnR拖拽溢出的修改
2011/02/12 Javascript
跨域请求之jQuery的ajax jsonp的使用解惑
2011/10/09 Javascript
这段js代码得节约你多少时间
2011/12/20 Javascript
jQuery中remove()方法用法实例
2014/12/25 Javascript
jQuery UI插件自定义confirm确认框的方法
2015/03/20 Javascript
简介AngularJS中使用factory和service的方法
2015/06/17 Javascript
nodejs 的 session 简单使用
2016/06/06 NodeJs
Google Maps基础及实例解析
2016/08/06 Javascript
Knockout结合Bootstrap创建动态UI实现产品列表管理
2016/09/14 Javascript
NodeJS实现图片上传代码(Express)
2017/06/30 NodeJs
input 标签实现输入框带提示文字效果(两种方法)
2017/10/09 Javascript
10 种最常见的 Javascript 错误(频率最高)
2018/02/08 Javascript
Node.js爬取豆瓣数据实例分析
2018/03/05 Javascript
你应该了解的JavaScript Array.map()五种用途小结
2018/11/14 Javascript
mpvue实现左侧导航与右侧内容的联动
2019/10/21 Javascript
[02:46]解说DC:感谢430陪伴我们的DOTA2国际邀请赛岁月
2016/06/29 DOTA
在Python中处理字符串之ljust()方法的使用简介
2015/05/19 Python
Python错误提示:[Errno 24] Too many open files的分析与解决
2017/02/16 Python
动态规划之矩阵连乘问题Python实现方法
2017/11/27 Python
对Python中range()函数和list的比较
2018/04/19 Python
在Tensorflow中实现梯度下降法更新参数值
2020/01/23 Python
Python 解析pymysql模块操作数据库的方法
2020/02/18 Python
基于pygame实现童年掌机打砖块游戏
2020/02/25 Python
详解HTML5通讯录获取指定多个人的信息
2016/12/20 HTML / CSS
物流仓储实习自我鉴定
2013/09/25 职场文书
专业销售业务员求职信
2013/11/18 职场文书
三十年同学聚会致辞
2015/07/28 职场文书
详解nodejs内置模块
2021/05/06 NodeJs