nginx 解决跨域、手机测试 2019-05-27

Posted 2023-03-13

参考技术A 1，手机和电脑在同一个局域网下（电脑可以放个wifi出来给手机连）。
2，安装nginx，网上查。
3，找这个目录下的这个文件，打开。

4，配置文件，listen 配置端口，location下的root 后面跟着index.html所在文件夹路径，
直接复制的路径是这个C:\Users\lalalalala\Desktop\hongbao\templates，注意要把“\”换成“/”，否者会报错（我就是在这里坑了很久）。

5，特别强调，注意开发调试时的console.log（），打印过多会撑爆微信浏览器缓存，就打不开页面了，坑死。

6，nginx 命令

注意，敲命令一定要用cmd，Window powerShell会报错。

cd 到nginx.exe所在文件目录下，

开始 ：start nginx

重启 ：nginx -s reload （改了配置文件就要重启）

停止 ：nginx -s stop

6，打开后，查一下电脑ip，在cmd里面直接输入ipconfig，回车就会出现啦。

ip:端口（如 192.168.1.1），就能看到网页啦

假设我们在开发一个项目，我这边写好了页面，同事写好了服务器，给的测试接口是： http://192.168.1.1:8080/mobile/operation/reportForm/recordingTime.json ，
那么跨域就是如下解决。
修改nginx.conf， 在server里添加一个location，如下，
/marketing为代表http://192.168.1.1:8080，在ajax请求中
url直接写成 /marketing/****/****/***.json，就行了，
当然，上线到生产环境得改回来。这样就是可以实现跨域测试了。
这种适用于直接写HTML页面时使用，如果用vuecli的话，可以参考这里 vue cli3 简单解决跨域问题 ，也可以参考这里 vuecli3复杂解决跨域、手机真机调试
)