惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Scott Helme
Scott Helme
N
Netflix TechBlog - Medium
AI
AI
Security Latest
Security Latest
GbyAI
GbyAI
P
Proofpoint News Feed
Y
Y Combinator Blog
A
Arctic Wolf
G
Google Developers Blog
U
Unit 42
爱范儿
爱范儿
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
V
Vulnerabilities – Threatpost
Know Your Adversary
Know Your Adversary
Cisco Talos Blog
Cisco Talos Blog
T
Tor Project blog
C
CXSECURITY Database RSS Feed - CXSecurity.com
T
Threatpost
L
Lohrmann on Cybersecurity
C
CERT Recently Published Vulnerability Notes
C
Check Point Blog
B
Blog RSS Feed
The GitHub Blog
The GitHub Blog
Microsoft Azure Blog
Microsoft Azure Blog
博客园 - 【当耐特】
博客园 - Franky
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
C
Cisco Blogs
云风的 BLOG
云风的 BLOG
NISL@THU
NISL@THU
D
Darknet – Hacking Tools, Hacker News & Cyber Security
Microsoft Security Blog
Microsoft Security Blog
T
The Blog of Author Tim Ferriss
阮一峰的网络日志
阮一峰的网络日志
Latest news
Latest news
L
LINUX DO - 最新话题
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
美团技术团队
WordPress大学
WordPress大学
L
LangChain Blog
Stack Overflow Blog
Stack Overflow Blog
Exploit-DB.com RSS Feed
Exploit-DB.com RSS Feed
酷 壳 – CoolShell
酷 壳 – CoolShell
大猫的无限游戏
大猫的无限游戏
The Hacker News
The Hacker News
Simon Willison's Weblog
Simon Willison's Weblog
V
V2EX
Project Zero
Project Zero
博客园_首页

博客园 - 正怒月神

windows 安装 openclaw docker-compose 启动 elk linux mysql 备份 maven 打包时优先选择本地仓库 minio 设置IP MapStruct-plus cannot find converter from jenkins pipeline 发布 jar并运行 MapperStruct 嵌套模型中 List<> 转 List<String> Easy es问题总结 Logstash docker发布 Docker 无法拉取 springmvc 多事务提交和回滚 springMvc 配置 UReport2 java 通过 microsoft graph 调用outlook(三) JPA Example 默认 join jackson.dataformat.xml 反序列化 对象中包含泛型 OR-TOOL 背包算法 解决JIRA、Confluence自动注销登录的问题 java 通过 microsoft graph 调用outlook(二)
nginx 部署2个相同的vue
正怒月神 · 2024-11-07 · via 博客园 - 正怒月神

起因:

最近遇到一个问题,在前端用nginx 部署 vue,

发现如果前端有改动,如果不适用热更新,而是直接复制项目过去,会404

因此想到用nginx 负载两套相同vue项目,然后一个个复制vue项目就可以了。

废话不多:

一 在nginx下创建两个vue的路径

二 修改nginx的配置文件

worker_processes  1;
 
#error_log  /var/log/nginx/error.log warn;
#pid        /var/run/nginx.pid;
 
events {
    worker_connections  1024;
}
 
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    # 限制body大小
    client_max_body_size 100m;
 
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                          '$status $body_bytes_sent "$http_referer" '
                          '"$http_user_agent" "$http_x_forwarded_for"';
 
    #access_log  /var/log/nginx/access.log  main;
 
    #负载vue
    upstream vueapp {
        server 127.0.0.1:81 weight=1;
        server 127.0.0.1:82 weight=1;
    }    
 
    # 负载 后端api
    upstream k2_api {
        ip_hash;
        # gateway 地址
        server localhost:9600;
    }
 
    #节点1
    server {
        listen       81;
        server_name  127.0.0.1;
        location / {
            root /usr/local/nginx/html;
            try_files $uri $uri/ /index.html index  index.html index.htm;
        }
        location /prod-api/ {
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            # websocket参数
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_pass http://k2_api/;         # java api 路径
        }
    }
   
    #节点2
    server {
        listen       82;
        server_name  127.0.0.1;
        location / {
            root /usr/local/nginx/html2;
            try_files $uri $uri/ /index.html index  index.html index.htm;
        }
        location /prod-api/ {
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            # websocket参数
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_pass http://k2_api/;         # java api 路径
        }
    }
 
 
    #反向代理负载均衡
    server {
        listen       80;
        server_name  127.0.0.1;
        location / {
            proxy_pass http://vueapp/;
            proxy_set_header    Host                $http_host;
            proxy_set_header    X-Real-IP           $remote_addr;
            proxy_set_header    X-Forwarded-For     $proxy_add_x_forwarded_for;
            proxy_set_header    X-NginX-Proxy       true;
        }
    }
}

总结:

① 配置2个server节点,

listen 分别为 81,82

root 分别为: /usr/local/nginx/html; /usr/local/nginx/html2;

② 配置upstream vueapp

负载2个server节点

③ 配置反向代理80端口

通过80端口,反向代理vueapp

④ /nginx/sbin目录下

运行:./nginx -s reload