一、概述
前后端分離
在前后端分離的應用模式中，后端僅返回前端所需的數據，不再渲染HTML頁面，不再控制前端的效果。至於前端用戶看到什么效果，從后端請求的數據如何加載到前端中，都由前端自己決定，網頁有網頁的處理方式，App有App的處理方式，但無論哪種前端，所需的數據基本相同，后端僅需開發一套邏輯對外提供數據即可。
在前后端分離的應用模式中 ，前端與后端的耦合度相對較低。
在前后端分離的應用模式中，我們通常將后端開發的每個視圖都稱為一個接口，或者API，前端通過訪問接口來對數據進行增刪改查。
對應的數據交互如下圖 :
二、演示1.0
一般來說，在企業中，使用Vue+Java Spring Cloud微服務架構，來做前后端分離。
為了方便，這里使用2個django項目，一個是前端demo-login，一個是后端demo-api。
github地址如下：
https://github.com/py3study/django-login-example.git
環境說明：
| 系統 | python版本 | docker版本 | ip | 主機名 | 配置 |
|---|---|---|---|---|---|
| centos 7.6 | 3.5.2 | 19.03.5 | 192.168.31.229 | sh-node1 | 2核4G |
1.0是直接使用python啟動項目的
使用1.0目錄里面的文件，確保本機已經安裝了python3，本文使用的版本為Python 3.5.2。
前端
git clone https://github.com/py3study/django-login-example.git cd django-login-example/1.0/demo_login pip3 install -r requirements.txt python3 manage.py runserver 0.0.0.0:8000
api
cd django-login-example/1.0/demo_api pip3 install -r requirements.txt python3 manage.py runserver 0.0.0.0:8001
nginx配置
安裝nginx，復制配置文件，並啟動nginx
yum install -y nginx cp django-login-example/1.0/nginx_conf/* /etc/nginx/conf.d # 啟動nginx nginx
訪問登錄頁面
配置域名解析，如果沒有dns，請修改windows10的hosts文件，添加2條記錄
192.168.31.229 h5.baidu.com 192.168.31.229 api.baidu.com
用戶名：xiao
密碼：1234
跳轉首頁
三、演示2.0
環境說明：
| 系統 | python版本 | docker版本 | ip | 主機名 | 配置 |
|---|---|---|---|---|---|
| centos 7.6 | 3.5.2 | 19.03.5 | 192.168.31.229 | sh-node1 | 2核4G |
使用docker運行
django基礎鏡像
cd django-login-example/2.0/django_dockerfile docker build -t django:2.2.4 .
前端
這里面的demo_login.tar.gz是1.0中django項目進行了壓縮打包。
cd django-login-example/2.0/login_dockerfile docker build -t demo_login:v1 . docker run -it -p 8000:8000 demo_login:v1
api
這里面的demo_api.tar.gz是1.0中django項目進行了壓縮打包。
cd django-login-example/2.0/api_dockerfile docker build -t demo_api:v1 . docker run -it -p 8001:8001 demo_api:v1
配置nginx
無需改動，使用1.0配置即可。
訪問頁面
同上，效果是一模一樣的
本文參考鏈接：