[项目部署]Windows下使用Nginx代理的方式进行部署后实现开机自启动

本文档详细介绍了如何在Windows环境下部署SpringCloud项目,并使用Nginx作为反向代理服务器。步骤包括下载安装Nginx,配置Nginx代理以实现前端与后端的通信,以及设置开机自启动。通过配置,使得所有通过指定URL的请求都被代理到后端服务。同时提供了自启动项目的bat脚本内容。

将项目部署在Windows下,部署参考以下链接

部署参考
项目:若依SpringCloud

一.下载安装Nginx

Nginx下载地址 http://nginx.org/en/download.html

二.Nginx代理配置

进入到上面解压的conf目录下,编辑Nginx的配置文件nginx.conf
在这里插入图片描述
在这里插入图片描述
1.首先这里的listen下的端口就是代理前的接口,要与前端项目的vue.config.js中的端口一致。

    server {
        listen       70;
        server_name  10.229.36.158;

2.server_name是你服务器的ip,这里即使是使用的本地也建议不要用localhost,避免修改hosts文件导致的问题。
所以这里就直接设置你要部署项目的服务器的ip。

        location / {
            root   D:/www/kaoqin/dist/;
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }

3.location /下面配置的就是代理前前端静态资源的路径等。
root 对应的就是在服务器上前端资源的dist目录的全路径,即代表根路径。
下面的两个配置保持默认不要更改,配置的是防止404和入口页面。

  location /prod-api/ {
  
            proxy_set_header Host $http_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;
   proxy_pass http://localhost:8080/;
        }
这里的 /prod-api/就是跟前面前端项目设置代理的路径重写一致。
下面的一些是设置请求头等,防止出现跨域问题。
然后最下面的proxy_pass就是设置的代理后的地址,即你的服务器上后台接口的url。
通过上面两个配置就能实现在服务器上所有的请求
只要是通过http://10.229.36.158/70/dev-api/
发送过来的请求全部会被代理到http://localhost:8080/下。这样就能实现前后端项目的请求代理。

三.启动nginx

来到上面Nginx解压之后的目录下(服务器上)即含有nginx.exe的目录下,在此处打开命令行

start nginx.exe

如果对nginx的配置文件进行修改的话

nginx -s reload

正常停止或关闭Nginx

nginx -s quit

启动Nginx成功后打开浏览器验证,输入:http://127.0.0.1:70/
如果能出现页面,即对应的前端静态资源的index.html的页面,并且能显示验证码,验证码是通过代理后的后台接口获取。那么就是代理成功,记住不要关闭此nginx的命令行。

在这里插入图片描述

四.实现开机自启动

一.首先需要将项目前后端分别打包,并把nacos和jar整理到同一个文件夹:testWindows,方便操作
在这里插入图片描述
二.用bat命令的方式,自启动项目,在此文件夹下添加bat和nginx.exe的快捷方式

C:\ProgramData\Microsoft\Windows\Start Menu\Programs\StartUp

在这里插入图片描述

启动的顺序会影响运行所以启动顺序为

  1. .mysql和redis 必须在jar包之前
  2. nacos
  3. 多个jar包
  4. nginx

三.两个bat文件的内容如下:
这些jar包之间不能有空格,有空格会导致运行到一半就不往下运行了,
socialInsurance-JAR.bat

@echo off
D:
cd "D:\testWindows"
echo start nacos
start socialInsurance-NACOS.bat
TIMEOUT /T 10   

start "auth" java "-Dfile.encoding=utf-8" -jar ruoyi-auth.jar
echo end auth
TIMEOUT /T 10   
start "gateway" java "-Dfile.encoding=utf-8" -jar ruoyi-gateway.jar
echo end gateway
TIMEOUT /T 10   
start "system" java "-Dfile.encoding=utf-8" -jar ruoyi-modules-system.jar
echo end system
TIMEOUT /T 10   
pause

socialInsurance-NACOS.bat

@echo off

taskkill /f /im java.exe
title nacos
for /f "skip=3 tokens=4" %%i in ('sc query MYSQL') do set "zt=%%i" &goto :next
:next
if /i "%zt%"=="RUNNING" (goto 1)
if /i "%zt%"=="STOPPED" (goto 2)
:1
echo mysql is running......
echo nacos server start......
D:
cd D:\testWindows\nacos-socialInsurance\nacos\bin
startup.cmd -m standalone

:2
echo mysql server start
net start MYSQL
echo mysql server start successful,Nacos start in 10 seconds  
ping 127.0.0.1 -n 10 >nul
D:
cd D:\testWindows\nacos-socialInsurance\nacos\bin
startup.cmd -m standalone





<think> 我们参考用户提供的引用和需求,用户需要将Vue项目打包后部署Windows Server服务器,配置Nginx并设置开机自启动。根据引用[1][2][3][4],我们可以总结出以下步骤: 1. 打包Vue项目使用`npm run build`生成dist文件夹。 2. 将dist文件夹放到Windows服务器的某个目录下(例如:`C:\web\dist`)。 3. 下载Nginx for Windows,并解压到服务器(例如:`C:\nginx`)。 4. 配置Nginx:修改`nginx.conf`文件,设置root为dist文件夹的路径,并配置try_files等。 5. Nginx测试配置是否正确。 6. 设置Nginx开机自启动。 下面详细说明: 步骤1:打包Vue项目 在Vue项目根目录下执行: ``` npm run build ``` 生成dist文件夹。 步骤2:将dist文件夹放到Windows服务器 例如放到`C:\web\dist`目录下。 步骤3:下载并解压NginxNginx官网(http://nginx.org/en/download.html)下载Windows版本的Nginx,解压到`C:\nginx`。 步骤4:配置Nginx 打开`C:\nginx\conf\nginx.conf`文件,在http块中添加一个server块,参考如下: ```nginx http { server { listen 80; # 监听80端口 server_name localhost; # 可以是域名或IP location / { root C:\web\dist; # 这里替换为你的dist目录 index index.html index.htm; try_files $uri $uri/ /index.html; # 用于支持Vue的路由模式 } # 如果有后端接口,可以配置反向代理,例如: # location /api { # proxy_pass http://backend_server; # 后端服务地址 # } } } ``` 步骤5:Nginx测试 打开命令行,进入Nginx目录(`C:\nginx`),执行: ``` start nginx ``` 或直接双击nginx.exe。然后在浏览器访问服务器的IP(或localhost)查看是否成功。 步骤6:设置Nginx开机自启动Windows Server上可以通过创建计划任务来实现开机自启动。 方法如下: 1. 打开“任务计划程序”(可以在开始菜单搜索)。 2. 在右侧操作栏选择“创建任务”。 3. 在“常规”选项卡中,输入任务名称,例如“Nginx自启动”,并勾选“使用最高权限运行”。 4. 在“触发器”选项卡中,点击“新建”,选择“在系统动时”触发。 5. 在“操作”选项卡中,点击“新建”,操作选择“动程序”,在“程序或脚本”一栏填写nginx的路径(例如:`C:\nginx\nginx.exe`),在“起始于(可选)”一栏填写nginx所在目录(例如:`C:\nginx`)。 6. 点击“确定”并输入管理员密码保存。 这样每次服务器重后,Nginx就会自动动。 注意:如果服务器有重Nginx动的情况,请检查任务计划程序中的设置以及路径是否正确。 另外,引用[4]中提到了一个开机自启动的配置,虽然是针对Linux的,但我们在Windows中通过计划任务实现了类似的效果。 至此,我们就完成了Vue项目Windows Server上的部署Nginx开机自启动设置。 相关问题: 1. Vue项目打包后部署到Linux服务器上,如何配置Nginx并设置开机自启动? 2. 如何配置Nginx的反向代理以解决前端跨域问题? 3. 在Windows Server中部署Nginx,如何监控其运行状态并在崩溃时自动重? </think> ### Vue项目部署Windows Server服务器并设置开机自启动的方法 根据引用内容,以下是详细步骤: #### 1. **打包Vue项目** ```bash npm run build ``` 生成`dist`文件夹(包含编译后的静态文件)[^1][^2]。 #### 2. **部署文件到服务器** - 将`dist`文件夹复制到Windows服务器的目标目录(如`C:\web\project\dist`)[^1][^2]。 - 确保文件夹权限:右键文件夹 → **属性** → **安全** → 添加用户并赋予**读取/执行**权限(避免403错误)[^2]。 #### 3. **配置Nginx** 1. 下载[WindowsNginx](https://nginx.org/en/download.html)并解压(如`C:\nginx`)。 2. 修改`conf/nginx.conf`文件: ```nginx server { listen 80; # 监听端口 server_name localhost; # 域名或IP location / { root C:\web\project\dist; # dist文件夹路径 index index.html; try_files $uri $uri/ /index.html; # 支持Vue路由[^3][^4] } # 配置后端代理(可选) location /api { proxy_pass http://localhost:8080; # 后端服务地址 } } ``` #### 4. **测试并Nginx** - 命令行进入Nginx目录: ```cmd cd C:\nginx start nginx # 动服务 nginx -s reload # 修改配置后重载 ``` - 浏览器访问`http://localhost`验证部署[^1][^3]。 #### 5. **设置开机自启动** 通过Windows计划任务实现: 1. 按`Win+R`输入`taskschd.msc`打开**任务计划程序**。 2. 创建任务: - **常规**:勾选“使用最高权限运行”。 - **触发器**:选择“登录时”或“系统动时”。 - **操作**:添加操作 → 动程序 → 填写Nginx路径(如`C:\nginx\nginx.exe`)。 3. 完成后重服务器测试[^4]。 --- ### 关键注意事项 1. **路径问题**: - Windows路径使用反斜杠`\`,但Nginx配置中可用正斜杠`/`(如`C:/web/project/dist`)[^3][^4]。 2. **端口冲突**: - 确保Nginx的`listen`端口(如80)未被IIS或其他进程占用。 3. **权限问题**: - 若访问报403错误,需检查`dist`文件夹的读取权限[^2]。 --- ### 相关问题 1. Vue项目部署Linux服务器时,如何配置Nginx反向代理后端接口? 2. 如何优化Vue项目的打包体积和加载速度? 3. Windows Server中如何监控Nginx运行状态并实现故障自动重? [^1]: Vue编译包Linux及Window服务器Nginx部署 [^2]: vue项目打包部署Nginx服务器 [^3]: 使用 nginx 服务器部署Vue项目 [^4]: springboot+vue项目部署配置开机自启动
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值