项目部署——SpringBoot+Vue部署上线

一、Vue打包+部署

1. 打包(npm run build:prod)

打完之后会在src同级目录下生成dist文件下,点开index.html页面在浏览器打开,==会发现报错==

解决步骤:

  1. 打开webpack.dev.conf.js文件,找到publicPath: config.dev.assetsPublicPath,按Ctrl点击,跳转到index.js文件
  2. 其中dev是开发环境,build是构建版本,找到build下面的assetsPublicPath: '/',然后修改为assetsPublicPath: './',即“/”前加点。
  3. 重新运行npm run build

2.nginx部署前端vue项目

  1. 把打完的dist文件夹拉至服务器(/home/laowang/lw-music/lw-music-client)

  2. 配置nginx.conf文件(/usr/local/webserver/nginx/conf/nginx.conf)

  3. 改下面2处地方 项目部署——SpringBoot+Vue部署上线_第1张图片

  4. 浏览器打开访问主机,看是否成功!

二、Springboot打包+部署

1.打包(mvn clean package)

  1. mvn clean package,看到以下jar包即成功!

    项目部署——SpringBoot+Vue部署上线_第2张图片

  2. 先在本地跑起来看是否能跑起来(java -jar ***)

    启动命令为

    //开发环境

    java -jar ***.jar --spring.profiles.active=dev

    //测试环境

    java -jar ***.jar --spring.profiles.active=qa

    //生产环境

    nohup java -jar lw-music-server-0.0.1-SNAPSHOT.jar --spring.profiles.active=prod &

2.部署

  1. 把jar包拉到服务器

  2. 执行nohup java -jar lw-music-server-0.0.1-SNAPSHOT.jar --spring.profiles.active=prod

  3. cat nohup 日志文件看控制台是否成功运行

  4. 修改nginx配置,使120.78.211.205/music所有请求全部转发到8150端口

    location /music/{
    	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://120.78.211.205:8150/music/;
    }
  5. linux开启防火墙对应端口和阿里云对应安全组端口(很重要)

==注意:nginx是如果匹配/music,则会把原有路径的/music截取掉,因此转发路径需要地址+匹配的路径==

三、大功告成!

坑爹一幕:nginx默认会过滤掉请求header中包含下划线的属性,这次把我的token截取掉了,坑爹!!!

解决办法:在nginx的http配置中加入以下:默认是off(不允许下划线属性)

underscores_in_headers on;

来源:https://juejin.cn/post/6923135346880282631?share_token=98fefebb-6a46-4248-807e-771198549afb

你可能感兴趣的:(spring,boot,vue.js,前端,后端,java)