前言
在开发静态页面时,类似Vue的应用,我们常会调用一些接口,这些接口极可能是跨域,然后浏览器就会报cross-origin问题不给调。
最简单的解决方法,就是把浏览器设为忽略安全问题,设置--disable-web-security。不过这种方式开发PC页面到还好,如果是移动端页面就不行了。
解决办法
使用Nginx转发请求。把跨域的接口写成调本域的接口,然后将这些接口转发到真正的请求地址。
举个栗子
例如我们在开发一个Vue应用。
原先:
调试页面是: http://192.168.1.100:8080/
请求的接口是: http://ni.hao.sao/api/get/info
步骤一:
请求的接口是: http://192.168.1.100:8080/api/get/info
PS:这样就解决了跨域问题。
步骤二:
安装好Nginx后,去到/usr/local/etc/nginx/目录(这是Mac的),修改nginx.conf文件。
步骤三:
把默认的server配置注释掉。
在下面增加:
server{ listen 8888; server_name 192.168.1.100; location /{ proxy_pass http://192.168.1.100:8080; } location /api{ proxy_pass http://ni.hao.sao/api; } }
保存后,启动Nginx。
PS:并不需要太了解Nginx的配置,很简单的。
步骤四:
访问: http://192.168.1.100:8888/
搞定。
PS:注意访问的端口是‘8888',有其他域的地址继续加location就行了。
错误示范
我一开始不太懂Nginx的配置,以为可以如下配置。
server{ listen 8080; server_name 192.168.1.100; location /api{ proxy_pass http://ni.hao.sao/api; } }
之所以这么写,是我认为这样可以让Nginx帮我监听8080的请求,然后只转发匹配的请求。我没有意识到的是Nginx这么写后,是需要占用8080端口的。
既然需要占用端口,那也就不能再被其他相同协议的进程占用,就导致开发的页面无法以8080端口启用。经同事提点,才想起这事情,换下思路,就有了最上面的方法。
总结
其实不仅是在开发调试时候能这么干,在生产环境也能这么玩。利用Nginx转发请求之后,就能够让所要部署的静态页面不需要放在跟请求接口同域的地方。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
RTX 5090要首发 性能要翻倍!三星展示GDDR7显存
三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。
首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。
据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。