uni-app解决接口跨域问题

编程知识 更新时间:2023-05-01 22:59:29

1. uniapp在前后台分离开发中,调试请求接口时,出现跨域问题

跨域原因:由于浏览器同源策略,即:端口号、域名、协议、IP地址必须一致,否则请求将被浏览器拦截。

2、解决方法

服务器之间的请求无需遵循同源策略,则使用代理作为中间服务器,代理服务器向后台服务器请求数据,然后返回给浏览器。uniapp给我们提供了一个node.js的代理服务器,我们只需要按照配置即可。
![在这里插入图片描述](https://img-blog.csdnimg/60b7e233f34642418bbf390dd0251e27.png#pic_center

配置代码:

"h5" : {
		"devServer" : {
		"port" : 8080, //端口号
		"disableHostCheck" : true,
		"proxy" : {
			  "/api" : {
			  "target" : "https://www.jisuapo/", //自己项目接口域名
			  "changeOrigin" : true,  //是否跨域
			  "secure" : true,  // 设置支持https协议的代理
			  "pathRewrite": {"^/api":"/api"}   //api路径重定向,根据具体情况调整,也可不写
				}
			}
		
		},
		"optimization" : {
		   "treeShaking" : {
			   "enable" : false
			}
		}
	}

*最后!最后!最重要的!配置完成,一定要重新编译项目!*

最后效果

测试中如果遇到请求还是不成功

请仔细检查:
一:查看manifest.json 源码视图 检查 devServer配置代理属性是否写错了,建议直接赋值粘贴文中代码(记得修改成自己的路径,"/api"为你所有的请求中都共有的部分)
二:检查请求封装的base url 是否正确
三:最后重新运行项目

共同攻克前端难题,解决方案供大家参考

更多推荐

uni-app解决接口跨域问题

本文发布于:2023-04-24 10:07:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/27a0c1c42a80ef9f192b224b1088f192.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:接口   uni   app

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!

  • 100267文章数
  • 26024阅读数
  • 0评论数