Springboot + VUE 前后端分离 Nginx部署记录

最新推荐文章于 2024-07-06 20:20:43 发布

链乔教育在线

最新推荐文章于 2024-07-06 20:20:43 发布

阅读量280

点赞数

分类专栏：网站开发经验谈

本文链接：https://blog.csdn.net/jomante/article/details/118611542

版权

网站开发经验谈专栏收录该内容

2 篇文章 0 订阅

订阅专栏

本文记录了使用Springboot作为后端API支持，打包成jar进行微服务部署，以及Vue前端通过Nginx部署的过程。在Vue中配置axios代理解决跨域问题，同时详细介绍了如何在Nginx服务器上配置SSL证书进行安全通信。

摘要由CSDN通过智能技术生成

Springboot + VUE 前后端分离 Nginx部署记录

Springboot作为后端API支持，打包成jar文件，采用微服务的形式进行部署和运行。
VUE 构建之后以Nginx为容器进行运行，部署在自定义的html项目目录下
配置Vue axios代理

"devServer":{
      "proxy" : {
        "/api": {
          "target" : "http://127.0.0.1:6060",
          "changeOrigin" : true, //跨域需要设置
          "ws" : true,
          "pathRewrite" : {
             "^/api" : ""
          }
        }
      }
    }

4.Nginx服务配置，包括SSL证书配置

在nginx服务器上创建文件夹用于存放ssl证书，如 /usr/local/ssl 。证书可以通过阿里云或腾讯云申请免费的ssl证书，请自行搜索申请方法。以下是nginx配置文件，nginx版本：1.21.1。

server {
        listen 443 ssl;     #监听443端口  
        server_name www.jomante.cn; #此处设置域名
        #开启log日志
    	access_log /usr/local/nginx/logs/host.access.log main; 
        #设置pem证书及密码
        ssl_certificate /usr/local/ssl/证书名.pem;
        ssl_certificate_key /usr/local/ssl/证书名.key;
        #设置session超时时间
        ssl_session_timeout 5m;
        #设置加密套件，不同的浏览器支持的套件不同,这里的写法参考阿里云证书介绍
        ssl_ciphers ECDHE-RSA-AES129-GCM-SHA256:ECDHE:ECDh:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
        #使用的TLS协议的类型
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
        ssl_prefer_server_ciphers on;
        location / {
                root /usr/local/jomanteweb;
                index index.html ;
                try_files $uri $uri/ @router;  #此处是为了防止VUE子页面刷新404而配置的
        }
        location @router {
                rewrite ^.*$ /index.html last;
        }
        location /api/ {  #api接口请求配置。
                proxy_pass http://127.0.0.1:6060/;
        }
}
server { #设置对http协议80端口的跳转
    listen       80;   
    server_name  www.jomante.cn;
    rewrite ^(.*)$ https://$host$1;  
}