一、真机测试

有时候我们做了一个静态页面，需要手机查看效果，使用nginx。

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

13444494-dd3332023d342288.png

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

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

#gzip on;

    server {

        listen      8088;

        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {

            root  C:/Users/lalalalala/Desktop/hongbao/templates;

            index  index.html index.htm;

        }

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复杂解决跨域、手机真机调试
)

 server {

        listen      8088;

        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {

            root  C:/Users/lalalalala/Desktop/hongbao/templates;

            index  index.html index.htm;

        }
        #新添加的，/marketing为代表http://192.168.1.1:8080;，
        location /marketing {
            proxy_pass http://192.168.1.1:8080;  # 设置代理服务器的地址，即你同事给你的数据接口，域名是另一台电脑的域名。
            # proxy_cookie_domain b.test.com  a.test.com; # 修改cookie，针对request和response互相写入cookie
        }