➢ window
前端设置nginx
反向代理
在项目开发过程中,前端需要模拟服务端数据并解决跨越问题.
mock
的方式有很多种:
-
直接在项目组件中写入静态数据,无需服务端返回
-
本地设置服务器,如node等,返回
json
等数据格式,更改host
文件达到ip
代理的效果 -
本地设置服务器,直接在当前电脑设置
nginx
反向代理,对数据进行各种底层设置
第一种前期速度快,但是后期需要把静态数据更改为请求api
,会增加工作内容,并且前期无法测试请求的真实状态,比如响应时间,数据格式等
第二种有效果,但是相比nginx
在使用上会有一些局限性,具体的这里就不作说明了
➢ 下载nginx
官网地址: http://nginx.org/en/download.html
这里使用的是window
,下载window
压缩包即可
➢ 修改nginx
配置
打开解压缩后的conf
文件夹下的nginx.conf
文件
把server_name
改为发起api
的请求地址
server_name test.com;
把localtion
中的代码改为你需要指向的代理地址
proxy_set_header host $host; proxy_pass http://127.0.0.1:8092;
➢ 运行nginx
进入到有nginx.exe
的文件夹
打开当前文件夹的终端,输入./nginx.exe
,回车(Enter
)
如果光标换行并且保持不动,说明nginx
已经成功启动了
➢ 测试API
这里使用PostMan
测试,测试成功
➢ Tips
在window
下可能会有一些因为进程未关闭导致的代码未生效的假象
这里注意,当修改nginx
配置,关闭终端后,再次开启另一个终端运行nginx.exe
,可能会有进程遗留
如果始终有异常,先打开任务管理器,看看进程,如果有多个同样的nginx
进程,要先把nginx
进程全部关闭,再次开启服务就没问题了