单机下Vue项目通过Nginx配置反向代理(1)

proxy_set_header Host $host;

proxy_set_header X-Real-IP $remote_addr;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

}

最终的配置文件:

#user nobody;

worker_processes 1;

#error_log logs/error.log;

#error_log logs/error.log notice;

#error_log logs/error.log info;

#pid logs/nginx.pid;

events {

worker_connections 1024;

}

http {

include mime.types;

default_type application/octet-stream;

#log_format main '$remote_addr - r e m o t e u s e r [ remote_user [ remoteuser[time_local] “$request” ’

'$status b o d y b y t e s s e n t " body_bytes_sent " bodybytessent"http_referer" ’

‘“ h t t p u s e r a g e n t " " http_user_agent" " httpuseragent""http_x_forwarded_for”’;

#access_log logs/access.log main;

sendfile on;

#tcp_nopush on;

#keepalive_timeout 0;

keepalive_timeout 65;

#gzip on;

server {

监听端口

listen 7788;

服务器名

server_name localhost;

前端项目根目录

root /Users/mac/WebstormProjects/sims/dist;

#charset koi8-r;

#access_log logs/host.access.log main;

#location / {

root html;

index index.html index.htm;

#}

#location / {

try_files $uri $uri/ /index.html;

#}

前端项目中的/api重写

location /api {

rewrite ^.+api/?(.*)$ /$1 break;

proxy_pass http://localhost:8899;

proxy_redirect off;

proxy_set_header Host $host;

proxy_set_header X-Real-IP $remote_addr;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

}

#error_page 404 /404.html;

redirect server error pages to the static page /50x.html

error_page 500 502 503 504 /50x.html;

location = /50x.html {

root html;

}

proxy the PHP scripts to Apache listening on 127.0.0.1:80

#location ~ .php$ {

proxy_pass http://127.0.0.1;

#}

pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000

#location ~ .php$ {

root html;

fastcgi_pass 127.0.0.1:9000;

fastcgi_index index.php;

fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;

include fastcgi_params;

#}

deny access to .htaccess files, if Apache’s document root

concurs with nginx’s one

#location ~ /.ht {

deny all;

#}

}

another virtual host using mix of IP-, name-, and port-based configuration

#server {

listen 8000;

listen somename:8080;

server_name somename alias another.alias;

location / {

root html;

index index.html index.htm;

}

#}

HTTPS server

#server {

listen 443 ssl;

server_name localhost;

ssl_certificate cert.pem;

ssl_certificate_key cert.key;

ssl_session_cache shared:SSL:1m;

ssl_session_timeout 5m;

ssl_ciphers HIGH:!aNULL:!MD5;

ssl_prefer_server_ciphers on;

location / {

root html;

index index.html index.htm;

}

#}

include servers/*;

}

检查是否成功

======================================================================

在本机运行后台项目(我这里的是SpringBoot项目)。

然后在浏览器上访问,注意是serve_name 和 端口号都是在 上面的 配置文件里面的,而不是后

端的端口号,这就实现了真正服务地址的隐藏,这也正是所谓的反向代理!

访问成功!

在这里插入图片描述

  1. 附录 —— 菜鸟的vim教程

  2. 参考 —— 关于Nginx的URL重写问题


最近新换了Mac,在新电脑上配了一下。

#user nobody;

worker_processes 1;

#error_log logs/error.log;

#error_log logs/error.log notice;

#error_log logs/error.log info;

#pid logs/nginx.pid;

events {

worker_connections 1024;

}

http {

include mime.types;

default_type application/octet-stream;

#log_format main '$remote_addr - r e m o t e u s e r [ remote_user [ remoteuser[time_local] “$request” ’

'$status b o d y b y t e s s e n t " body_bytes_sent " bodybytessent"http_referer" ’

‘“ h t t p u s e r a g e n t " " http_user_agent" " httpuseragent""http_x_forwarded_for”’;

#access_log logs/access.log main;

sendfile on;

#tcp_nopush on;

#keepalive_timeout 0;

keepalive_timeout 65;

#gzip on;

server {

监听端口

listen 7788;

服务器名

server_name localhost;

前端项目根目录

root /Users/jisongyang/WebstormProjects/sims/dist;

#charset koi8-r;

#access_log logs/host.access.log main;

#location / {

root html;

index index.html index.htm;

#}

#location / {

try_files $uri $uri/ /index.html;

#}

前端项目中的/api重写

location /api {

rewrite ^.+api/?(.*)$ /$1 break;

proxy_pass http://localhost:8899;

proxy_redirect off;

proxy_set_header Host $host;

proxy_set_header X-Real-IP $remote_addr;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

}

#error_page 404 /404.html;

redirect server error pages to the static page /50x.html

error_page 500 502 503 504 /50x.html;

location = /50x.html {

root html;

}

proxy the PHP scripts to Apache listening on 127.0.0.1:80

#location ~ .php$ {

proxy_pass http://127.0.0.1;

#}

pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000

#location ~ .php$ {

root html;

fastcgi_pass 127.0.0.1:9000;

fastcgi_index index.php;

fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;

include fastcgi_params;

#}

deny access to .htaccess files, if Apache’s document root

concurs with nginx’s one

#location ~ /.ht {

deny all;

#}

}

最后

前15.PNG

前16.PNG

由于文档内容过多,为了避免影响到大家的阅读体验,在此只以截图展示部分内容

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

;

fastcgi_index index.php;

fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;

include fastcgi_params;

#}

deny access to .htaccess files, if Apache’s document root

concurs with nginx’s one

#location ~ /.ht {

deny all;

#}

}

最后

[外链图片转存中…(img-aIGI84kJ-1714637210276)]

[外链图片转存中…(img-XwWuKZT5-1714637210277)]

由于文档内容过多,为了避免影响到大家的阅读体验,在此只以截图展示部分内容

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

  • 14
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值