前后端分离+nginx实现动静分离搭建https图解

一、前后端不分离：

项目运行在同一个域名以及端口下，通过controller调转到springboot中resources的static下的页面从而实现交互；

二、前后端分离：

前端页面发送ajax请求给目的服务器，目的服务器会响应json数据{code: 400, Message: 需要登录! data：{}}给前端，前端根据响应码进行相应的页面跳转，然后也可以将获取到的数据展示在页面上；

三、nginx搭建https服务

3.1 第一步实现利用https协议访问原先的http接口

nginx端口监听443：proxy_pass http://127.0.0.1:8080;

3.2 第二步将前端界面整合到nginx中

nginx监听443端口，设置location映射；

location /static {
         alias   D:/web;
         autoindex on;
}

下图总体解释：用户访问https://front.smile.com/login.html实则是通过nginx去访问静态资源，页面完成后发送ajax请求给目的服务器实则是通过nginx反向代理去帮助我们寻找目的服务器，nginx返回json数据，前端页面根据响应数据进行页面跳转；

本文主要通过图解（自己画的，有不正确的地方还请指正哈）去描述，任何技术先去理解再去复现哈。