[nginx]Windows和Mac下,nginx反向代理服务器配置

时间:2023-03-09 06:58:43
[nginx]Windows和Mac下,nginx反向代理服务器配置

最近做项目,前端需要用到nginx反向代理来转发请求,总结了一下在Windows和Mac上的配置,以备查询。

一、Windows

修改nginx的配置文件,nginx.conf。

1)nginx.conf文件,http下,默认打开的server只有一个,监听的是80端口:

 http{
 XXXXX
 server{
   listen 80;
      XXXX
 }
 }

2)我们手动添加一个server(虚拟机),这样本地使用假数据来模拟请求json文件时,不会因为跨域而请求不到。

 http{
 XXXX
 server{
      listen 80;
      XXXX
 }
 server{
 # 端口,自己定义,注意不要重名
     listen 8088;
     server_name localhost;
 # Path for static files 项目所在的文件夹,指向编译后的文件夹
 # 我这里指向的路径是编译后的文件夹,实际指向你要运行html的文件夹都可以
     root  D:\BigCity\americanschool\frontend\output;
 #Specify a charset
     charset utf-8;
 # 开启SSI
     ssi on;
     ssi_silent_errors off;
 # ssi针对所有文件类型生效
    ssi_types *;

 #转发所有的json文件的请求
23 location ~(.*\.json){
24 #我这里json文件放的目录和工程目录是同一个,所以root的地址和上面相同;另外,注意,如果用npm 来编译源文件,源文件中的json可能不会生成到output文件夹,需要手动拷贝,才能正常请求到;
25     root D:\BigCity\americanschool\frontend\output;
26     error_page 405 =200 $1;
27 }
28 }
29 }    

3)当后端程序部署后,前端联调时,需要把请求都转到实际的后端,需要再次修改ngnix.conf如下:

 server {
 # 端口,自己定义,注意不要重名
  listen 8088;
  server_name localhost;
  # Path for static files 项目所在的文件夹,指向编译后的文件夹
 # 我这里指向的路径是编译后的文件夹,实际指向你要运行html的文件夹都可以
  root  D:\BigCity\americanschool\frontend\output;
  #Specify a charset
  charset utf-8;
  # 开启SSI
  ssi on;
  ssi_silent_errors off;
  # ssi针对所有文件类型生效
  ssi_types *;
  # error_log  logs/km.error.log warn;
  #将/test/开头的请求转发到后端服务器
 #XXXX是你的后端服务器的ip
 #对应前端js中的ajax的请求是:/rest/aaaaa/bbbbbb
   location ^~ /rest/ {
20     proxy_pass http://XXXX/rest/;
 }}

这样配置后,路径D:\BigCity\americanschool\frontend\output下发起的ajax请求,只要是以/rest/开头的,都会被转发到proxy_pass指向的地址,也就是把http://XXXX和ajax访问的url拼接起来,得到:http://XXXX/rest/aaaaa/bbbbbb

二、MAC下的配置

MAC下,安装好的nginx无法在文本编辑器中修改,只能在“终端”查看;并且没有修改的权限;因此,只能先把nignx.conf文件拷贝出来,更改后,再拷贝回去,注意需要使用sudo。