nginx 部署2个相同的vue

起因:

最近遇到一个问题,在前端用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;#负载vueupstream vueapp {server 127.0.0.1:81 weight=1;server 127.0.0.1:82 weight=1;}    # 负载 后端apiupstream k2_api {ip_hash;# gateway 地址server localhost:9600;}#节点1server {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 路径}}#节点2server {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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/60558.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL:CRUD

MySQL表的增删改查(操作的是表中的记录) CRUD(增删改查) C-Create新增R-Retrieve检查,查询U-Update更新D-Delete删除 新增(Create) 语法: 单行数据全列插入 insert into 表名[字段一,字段…

centos7 node升级到node18

使用jenkins发布vue3项目提示node18安装失败 错误日志: /var/lib/jenkins/tools/jenkins.plugins.nodejs.tools.NodeJSInstallation/Node18/bin/node: /lib64/libm.so.6: version GLIBC_2.27 not found (required by /var/lib/jenkins/tools/jenkins.plugins.node…

万字长文解读深度学习——ViT、ViLT、DiT

文章目录 🌺深度学习面试八股汇总🌺ViT1. ViT的基本概念2. ViT的结构与工作流程1. 图像分块(Image Patch Tokenization)2. 位置编码(Positional Encoding)3. Transformer 编码器(Transformer En…

MFC中Excel的导入以及使用步骤

参考地址 在需要对EXCEL表进行操作的类中添加以下头文件:若出现大量错误将其放入stdafx.h中 #include "resource.h" // 主符号 #include "CWorkbook.h" //单个工作簿 #include "CRange.h" //区域类,对Excel大…

前端开发中常用的包管理器(npm、yarn、pnpm、bower、parcel)

文章目录 1. npm (Node Package Manager)2. Yarn (Yarn Package Manager)3. pnpm4. Bower5. Parcel总结 前端开发中常用的包管理器主要有以下几个: 1. npm (Node Package Manager) 简介: npm 是 Node.js 的默认包管理器,也是最广泛使用的包…

Linux(CentOS)安装 Nginx

CentOS版本:CentOS 7 Nginx版本:1.24.0 两种安装方式: 一、通过 yum 安装,最简单,一键安装,全程无忧。 二、通过编译源码包安装,需具备配置相关操作。 最后附:设置 Nginx 服务开…

深度学习项目启动(笔记用)

深度学习项目启动 项目配置虚拟环境 项目配置虚拟环境

万字长文解读深度学习——卷积神经网络CNN

推荐阅读: 卷积神经网络(CNN)详细介绍及其原理详解 CNN笔记:通俗理解卷积神经网络 文章目录 🌺深度学习面试八股汇总🌺主要组件输入层卷积层 (Convolutional Layer)批归一化层(Batch Normalizat…

交易术语汇总(Technical Trading Dictionary)

Arbitrage (套利) --- 一种利用交易所之间的差价获利的方法。 Accumulation (累积) --- 在一种资产中建立头寸的过程。 Ask/Bid (询价/竞价) --- 卖出订单是询价(Ask),买入订单是出价(Bid)。 ATH(历史最高价) --- All-time high 全时高。 Bearish MS…

搭建高效稳定的ChatGPT网络环境:从网络专线到IP地址管理的全流程解析

随着人工智能技术的迅猛发展,ChatGPT作为自然语言处理领域的前沿应用,已经在各行各业得到广泛使用。无论是企业的客户服务系统,还是个人用户的智能助手,ChatGPT的稳定运行都离不开一个高效的网络环境。在企业级部署或私有化使用的…

VBA10-处理Excel的动态数据区域

一、end获取数据边界 1、基本语法 1-1、示例: 2、配合row和column使用 2-1、示例1 2-2、示例2 此时,不管这个有数值的区域,怎么增加边界,对应的统计数据也会跟着变的! 二、end的缺陷 若是数据区域不连贯,则…

【CICD】GitLab Runner 和执行器(Executor

GitLab Runner 和执行器(Executor)是 GitLab CI/CD 管道中的两个重要组成部分。理解它们之间的关系有助于更好地配置和使用 CI/CD 流水线。runer是gitlab的ci-agent对接gitlab,而执行器是接受runer下发的ci的任务来干活的。也就是说gitrunner…

Spring boot + Vue2小项目基本模板

Spring boot Vue2小项目基本模板 基本介绍基本环境安装项目搭建最终效果展示 基本介绍 项目来源哔哩哔哩的青戈,跟着学习搭建自己的简单vue小项目;看别人的项目总觉得看不懂,需要慢慢打磨 这里目前只简单的搭建了菜单导航和表格页面&#x…

“箱体分析”,箱体支撑压力位,分析市场方向 通达信主图 源码

使用技巧 该指标用于在通达信的K线图上绘制箱体分析图形,主要通过支撑位、波浪顶、箱体上下限等多个技术指标来识别股票的支撑和压力区域。 支撑位分析:可以帮助用户识别股价的支撑区域,并判断是否会反弹。 箱体震荡区间识别:通…

PostgreSQL 锁判断

我们在使用 PostgreSQL 的时候经常会遇到有关锁的信息。那么如何判断是否有死锁或者锁等待呢&#xff1f; WITH lock_pid AS ( SELECT DISTINCT pid FROM pg_locks WHERE pid <> pg_backend_pid() ) SELECT psa.* FROM pg_stat_activity psa INNER JOIN lock_pid lp ON …

hadoop大数据平台

java环境 java-1.8.0-openjdk-devel jvm虚拟机 hadoop软件解压即可用 JAVA_HOME是java的安装路径 hadoop对主机名强依赖&#xff0c;意思是主机名hostname要能ping通 jar命令 是运行一个jar文件 hadoop要运行&#xff0c;主要依赖两个的配置 JAVA_HOME HADOOP_CONF_DIR hadoop里…

深入Zookeeper节点操作:高级功能与最佳实践

Zookeeper之节点基本操作&#xff08;二&#xff09; 在《Zookeeper之节点基本操作&#xff08;一&#xff09;》中&#xff0c;我们介绍了如何创建、读取、更新、删除节点的基本操作。接下来将进一步探讨Zookeeper中节点的进阶操作和更多细节&#xff0c;包括节点的监视&…

PICO+Unity MR视频透视

官方链接&#xff1a;视频透视 | PICO 开发者平台 在 PXR_Manager (Script) 面板上&#xff0c;勾选 Video Seethrough 选框 2.将 Clear Flags 设置为 Solid Color。颜色设置为黑色&#xff0c;Alpha 通道设置为完全透明 3.在代码中开启透视 using System.Collections; usin…

Linux系统中,列出当前目录下所有文件和文件夹的大小,并按大小从大到小排序

du -sh * | sort -nr用于列出当前目录下所有文件和文件夹的大小&#xff0c;并按大小从大到小排序。 du -sh *&#xff1a;du&#xff08;disk usage&#xff09; 是一个用于检查文件和目录在磁盘上占用空间的命令。 -s&#xff08;summarize&#xff09; 选项意味着只显示每个…

单例模式详解:如何优雅地实现线程安全的单例

一、什么是单例模式&#xff1f; 单例模式是一种常用的设计模式&#xff0c;目的就是确保某个类在程序中只有一个实例&#xff0c;并且提供一个全局访问入口。通过这个模式&#xff0c;我们能够保证全局共享同一个对象实例&#xff0c;避免了多次实例化同一个对象&#xff0c;…