论坛 › linux › 【后台部署】Windows服务器部署RuoYi-Vue前后端分离项目

滴水恩情 发表于 2024-6-14 22:21:12

【后台部署】Windows服务器部署RuoYi-Vue前后端分离项目

一、Ruoyi-Vue前后端分离项目布局

https://img-blog.csdnimg.cn/9ed9fba55b914f5c8464687f71cb13a9.png#pic_center
二、Redis部署

1、下载Windows版本Redis
https://img-blog.csdnimg.cn/293138b2c5dd481490f2df31c285c4a9.png#pic_center
2、解压缩到安装目次
https://img-blog.csdnimg.cn/7b18af7a54134148bd4085c03d0da573.png#pic_center
3、在安装目次栏输入cmd，按回车键
https://img-blog.csdnimg.cn/c75e436a861b437bbbe376a10f8e0ab5.png#pic_center
4、将Redis绑定为 Windows 服务，设置为后台启动
redis-server --service-install redis.windows.conf --loglevel verbose
或者
redis-server --service-install redis.windows-service.conf --loglevel verbose
5、常用命令
启动服务
redis-server --service-start
停止服务
redis-server --service-stop
卸载命令
redis-server --service-uninstall
6、停止和启动也可以通过页面来操纵
   右键 此电脑 -->管理–>服务 --> 找到"Redis"
https://img-blog.csdnimg.cn/a13e641cbee640f79dd41dac4d660da8.png#pic_center
三、后端部署

1、项目下\RuoYi-Vue\ruoyi-admin\src\main\resources\application.yml 下查看后端端口
https://img-blog.csdnimg.cn/f90cecd9da454e3193d7fbc21d61596a.png#pic_center
2、打开项目文件夹下的bin目次，先执行clean.bat，再执行打包命令package.bat
https://img-blog.csdnimg.cn/47c24fdbe7c9404a8b8c9e4af673d8e1.png#pic_center
3、后端打包乐成后，jar包存放于项目目次\RuoYi-Vue\ruoyi-admin\target\ruoyi-admin.jar
https://img-blog.csdnimg.cn/14697b999abd4ad3a0e0ec0210ff1cd4.png#pic_center
4、查看Windows服务器上的jdk环境变量
   右键 此电脑 -->属性–>高级体系设置 --> 环境变量 --> 体系变量
https://img-blog.csdnimg.cn/5cbbcfa8757c4e51ba0a170bfa384afa.png#pic_center
5、在jdk环境变量设置路径的bin目次下找到javaw.exe，复制一份修改成xxx.exe（名字恣意取，原则和jar包的名称保持同等）
   比方 D:\Java\jdk1.8.0_131\bin 下面将javaw.exe改成test-ruoyi-admin.exe
https://img-blog.csdnimg.cn/0cdaadff1982448b8899b90ab740ef6c.png#pic_center
6、编写执行启动的bat脚本文件，首先需要将jar包放到自己的工作目次下，同时在此目次下新建一个启动脚本：start-ruoyi-admin.bat
   留意启动脚本，jar包要放在同一个目次
@echo off
start test-ruoyi-admin -jar D:\test\ruoyi-admin.jar >> D:\test\log&
exit
7、内容说明
内容说明test-ruoyi-admin第5步在jdk的bin目次下自定义的文件D:\test\ruoyi-admin.jarjar包存放的绝对路径D:\test\log &为log日记存储路径 8、文件布局
https://img-blog.csdnimg.cn/21feee3c2e3c43ecb0d5d6d8d6501a08.png#pic_center
9、启动脚本，右键，以管理员身份运行
https://img-blog.csdnimg.cn/08612f75fea74e5bad681e7fc8668b47.png#pic_center
10、打开使命管理器，查看自己的程序历程号
https://img-blog.csdnimg.cn/3dc3531f02044fb2a570915becea314c.png#pic_center
四、前端部署

1、vue.config.js文件下修改前端端口
   默认是80端口，但不推荐利用80端口。因为80端口在部署到服务器上和nginx可能存在占用等问题
    target的url和端口要和服务器上能访问到的后台接口同等
https://img-blog.csdnimg.cn/db812c52009e44b6addb68425a7d3639.png#pic_center
2、打开项目文件夹下的D:\workspace\RuoYi-Vue\ruoyi-ui\bin目次，执行打包命令build.bat
https://img-blog.csdnimg.cn/a557d1648f534ebcb6b53c06f1c518be.png#pic_center
3、天生dist文件 ，前端打包乐成
https://img-blog.csdnimg.cn/5667ebc0de024eea9cce416cb42d222e.png#pic_center
五、nginx部署

1、进入nginx官网，下载自己所需的版本
https://img-blog.csdnimg.cn/4f49670c7d0c4c729ab09032d99a81aa.png#pic_center
2、打开解压后文件，修改设置文件
https://img-blog.csdnimg.cn/e0593183c8504871a6a2920c4e445333.png#pic_center
https://img-blog.csdnimg.cn/6ad33094dfaf4dd1b913dc041014e9f3.png#pic_center
#usernobody;
worker_processes1;

#error_loglogs/error.log;
#error_loglogs/error.lognotice;
#error_loglogs/error.loginfo;

#pid      logs/nginx.pid;


events {
    worker_connections1024;
}


http {
    include       mime.types;
    default_typeapplication/octet-stream;

    #log_formatmain'$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_loglogs/access.logmain;

    sendfile      on;
    #tcp_nopush   on;

    #keepalive_timeout0;
    keepalive_timeout65;

    #gzipon;

    server {
      # listen下的端口就是代理前的接口，要与前面前端项目的vue.config.js中的端口一致
      listen       8800;
      # server_name是部署项目的服务器ip,即使是使用的本地也建议不要用localhost，避免修改hosts文件导致的问题
      server_namelocalhost;

      #charset koi8-r;

      #access_loglogs/host.access.logmain;

      # location /下面配置的就是代理前前端静态资源的路径等
      location / {
            # root 对应的就是在服务器上前端资源的dist目录的全路径，即代表根路径
            root   D:/workspace/RuoYi-Vue/ruoyi-ui/dist;
            # 保持默认不要更改，防止404和入口页面
                        try_files $uri $uri/ /index.html;
            indexindex.html index.htm;
      }

      # location /prod-api/ 是配置的代理后的地址
                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就是设置的代理后的地址，即自己服务器后台接口的url
                   proxy_pass http://localhost:8080/;
                }

      #error_page404            /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_indexindex.php;
      #    fastcgi_paramSCRIPT_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 {
      #    denyall;
      #}
    }


    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_namesomenamealiasanother.alias;

    #    location / {
    #      root   html;
    #      indexindex.html index.htm;
    #    }
    #}


    # HTTPS server
    #
    #server {
    #    listen       443 ssl;
    #    server_namelocalhost;

    #    ssl_certificate      cert.pem;
    #    ssl_certificate_keycert.key;

    #    ssl_session_cache    shared:SSL:1m;
    #    ssl_session_timeout5m;

    #    ssl_ciphersHIGH:!aNULL:!MD5;
    #    ssl_prefer_server_cipherson;

    #    location / {
    #      root   html;
    #      indexindex.html index.htm;
    #    }
    #}

}
3、只要是通过http://localhost/8800/发送过来的哀求全部会被署理到http://localhost:8080/。如许就能实现前后端项目的哀求署理
4、常用命令
常用命令说明start nginx启动命令nginx.exe -s stop强制停止命令nginx.exe -s reload重启命令 https://img-blog.csdnimg.cn/c418c65f9cef4b13908da184c826a737.png#pic_center
六、部署完成

部署完成，浏览器输入http://localhost/8800，登录体系
https://img-blog.csdnimg.cn/01f72e49bc594f0d84662ea22e0d207f.png#pic_center
常见问题：端口占用
①查找被占用的端口
# 查找使用的端口
netstat -ano
# 查找指定的端口
netstat -ano |findstr 1883
https://img-blog.csdnimg.cn/e7d8bb49908a43559ba68c9bafe454a0.png#pic_center
②停止端口
# 停用端口
taskkill -PID 8984 -F
# 查看占用此端口的进程，在任务管理器中强制结束
tasklist|findstr 8984

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

查看完整版本: 【后台部署】Windows服务器部署RuoYi-Vue前后端分离项目