部署先後端分離項目總結

一、先後端分離，vue前端提供靜態頁面，且能夠向後臺發起get，post等restful請求。django後臺提供數據支撐，返回json數據，返回給vue，進行數據頁面渲染。

vue向後臺發起請求  get  服務器ip:8000/課程列表 

django-rest-framework框架接收，「 服務器ip:8000/課程列表 」 請求，而後return返回一個json數據
{"課程列表":"python課程，linux課程",.....}

1、

 

1.先從後端搞起,部署django後臺的環境依賴
    -解決環境依賴的辦法：
       
       把能夠正常運行項目的那個機器地下的python包，所有導出來，就能夠
        pip3 freeze >  requirements.txt    把這個文件，傳輸給linux系統
        linux再經過命令安裝
         pip3 install -r  requirements.txt 

安裝uwsgi啓動後端
        pip3 install uwsgi 
        
        啓動方式1，用參數啓動uwsgi --http  :8000  --module  luffy_boy.wsgi
        啓動方式2：用配置文件啓動
        touch uwsgi.ini 

寫入配置

[uwsgi]

# Django-related settings
# the base directory (full path)
chdir           = /opt/luffy_boy
# Django's wsgi file
module          = luffy_boy.wsgi
# the virtualenv (full path)
home            = /root/Envs/s17luffy
# process-related settings
# master
master          = true
# maximum number of worker processes
processes       = 1
# the socket (use the full path to be safe
socket          = 0.0.0.0:6666
# ... with appropriate permissions - may be needed
# chmod-socket    = 664
# clear environment on exit
vacuum          = true

2、

一、前端代碼vue打包搞起

      ①、準備node環境，下載node環境包

       wget https://nodejs.org/download/release/v8.6.0/node-v8.6.0-linux-x64.tar.gz
      ②、解壓縮node包
         tar -zxvf node-v8.6.0-linux-x64.tar.gz
      ③、添加node到環境變量
      PAHT="node環境" 
      ④、開始編譯打包前端vue文件
        1.修改vue提交的請求地址，修改文件是
        /opt/前端文件/src/restful/api.js 
        2.更改接口內的地址
        本來是 127.0.0.1:8000/ 
        改爲服務器的ip地址+端口
        sed -i "s/127.0.0.1/192.168.29.136/g"   /opt/前端文件/src/restful/api.js 
        
        此時進入vue代碼的第一層文件夾
        cd /opt/vue文件名
        
        3.安裝node模塊，這是找到package.json，安裝它的內容 
        npm install （出現err後把vue文件刪除，從新解壓，開始④步驟）
        若是屢次出現err,換臺電腦打包dist文件，
        4.編譯打包vue代碼，這一步會生成dist靜態文件夾，用於nginx展現，前端頁面都在這了
        npm run build  

        5.配置nginx去找到這個前端vue頁面
        修改nginx.conf  參數以下
        虛擬主機1，用於找到vue頁面

server {
                listen       80;
                server_name  s17dnf.com;
                location / {
                root  /opt/s17luffy/dist;
                index index.html;
                }
    }

               虛擬主機2，用於反向代理，找到django

server{
                listen 8000;
                server_name  192.168.11.250;
                location / {
                include uwsgi_params;
                uwsgi_pass 0.0.0.0:6666;
                    }
        }

            6.重啓nginx使得配置生效

             nginx -s reload

            七、啓動redis數據庫，支撐數據              redis-server redis.conf