介绍
这篇文章主要为大家展示了“如何利用Nginx处理Vue开发环境的跨域”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“如何利用Nginx处理Vue开发环境的跨域”这篇文章吧。
<强> 1。需求强>
本地测试域名与线上域名相同,以便正确传递饼干和进行SSO测试。
注:由于SSO登录后,相关饼干被加在四级域名上,因而需要做到本地测试域名和线上接口域名相同。
<强> 2。方案强>
配置主机文件使线上域名指向Localhost:
<代码> 127.0.0.1 product.xxx.xxx.com 代码>
配置Nginx进行对应转发:
server { listen 才能,,,,80; listen 才能,,,,[:]:80; server_name 才能;$ {product.xxx.xxx.com}; 的位置才能/api { ,,,proxy_pass https://$ {ip.ip.ip.ip}; ,,,proxy_set_header Host $主机; ,,} 的位置才能/,{ ,,,proxy_pass http://localhost: 8080; ,,,proxy_set_header Host $主机; ,,}, }
配置vue.config。js以免出现无效的主机头报错:
{ ,,devServer: { ,,,disableHostCheck:真实 ,,} }
以上是“如何利用Nginx处理Vue开发环境的跨域”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注行业资讯频道!