开发环境hbuilderx及上线服务器nginx下跨域接口配置及理解

前后端分离的项目都会存在跨域的问题.

比如,前端项目域名为www.xxxx.com,api接口为api.xxxx.com.这就是跨域,两个域名不一样。

1.开发环境的跨域,开发环境hbuilderx内置服务器,支持配置代理转发,可解决跨域问题

在uni-app 的项目中找到manifest.json这个配置文件,在该配置文件中配置跨域代理(代理服务器)

manifest.json

“h5”: {

“devServer”: {

“port”: 80,

“proxy”: {

“/api/”: {//根据实际请求接口写,以api开头的接口都会转发,如api/user

“target”: “http://www.coding60.com”,//要访问的api接口 址

“changeOrigin”: true,

“secure”: false

}

},

“https”: false//ssl协议

}

2.上线后的跨域问题解决,上线后的运行环境为nginx,nginx是支持代理转发的。

找到该项目的配置文件,版本不同,配置文件位置不同,自行查找。

一般是xxxx.com.conf,在server{}里增加如下内容:

location /api/ {

proxy_pass https://api.xxxx.com;//注意细节 址末尾不要加/

proxy_set_header Host $host:$server_port;

}

总结,上线后的跨域一定要依赖于后端程序员进行服务器配置,前端没有配置权限此方法无法解决。

声明:本站部分文章内容及图片转载于互联 、内容不代表本站观点,如有内容涉及侵权,请您立即联系本站处理,非常感谢!

(0)
上一篇 2021年11月18日
下一篇 2021年11月18日

相关推荐