技術棧的介紹
python3 ：Python代碼解釋器
uwsgi wsgi(web服務網關接口，就是一個實現了python web應用的協議)：作用就是啟動Django項目
virtualenvwrapper ：虛擬環境隔離
Django路飛的代碼
vue的代碼
nginx (一個是nginx對靜態文件處理的優秀性能，一個是nginx的反向代理功能，以及nginx的默認80端口，訪問nginx的80端口，就能反向代理到應用的8000端口)
mysql
redis ：緩存，購物車訂單信息
supervisor 進程管理工具
項目邏輯架構的介紹
web服務器
傳統的c/s架構，請求的過程是 客戶端 > 服務器 服務器 > 客戶端 服務器就是：1.接收請求 2.處理請求 3.返回響應
web框架層
HTTP的動態數據交給web框架，例如django遵循MTV模式處理請求。
HTTp協議使用url定位資源，urls.py將路由請求交給views視圖處理，然后返回一個結果，完成一次請求。
web框架使用者只需要處理業務的邏輯即可。
項目部署環境步驟
一、環境准備
確保准備好python3的環境，和虛擬解釋器vitrualenvwrapper
然后新建一個虛擬環境 mkvirtualenv s15vuedrf (其中，虛擬環境的包是創建在 /root/Envs/s15vuedrf 中)
將項目部署在該虛擬環境中
前面的博文中已做了詳細的解釋：
二、准備前后端的代碼
1.准備前后端代碼 下載前后端的代碼，這里將項目下載到 /opt/s15vuedrf中 mkdir /opt/s15vuedrf cd /opt/s15vuedrf wget https://files.cnblogs.com/files/pyyu/luffy_boy.zip wget https://files.cnblogs.com/files/pyyu/07-luffy_project_01.zip 如果代碼在本地，傳到服務器 使用 lrzsz 或者 xftp工具，進行傳輸 2.解壓縮代碼
由於是.zip壓縮格式，所以用unzip解壓即可，解壓到當前文件夾 unzip luffy_boy.zip unzip 07-luffy_project_01.zip
三、從vue前端代碼搞起
(1) 准備node打包環境，下載到 /opt中 cd /opt wget https://nodejs.org/download/release/v8.6.0/node-v8.6.0-linux-x64.tar.gz (2) 解壓縮node包，配置環境變量，使用npm和node命令 系統環境變量配置好之后，就可以直接使用 tar -zxvf node-v8.6.0-linux-x64.tar.gz vim /etc/profile PATH = "xxxxx:/opt/node-v8.6.0-linux-x64/bin" #進入源碼中的bin,查看命令 source /etc/profile (3) 檢測node和npm命令是否正常,查看版本號 node -v # v8.6.0 npm -v # 5.3.0 (4) 安裝vue項目所需的包 cd /root/Envs/s15vuedrf/07-luffy_project_01 # 這里虛擬包位置根據自己創建位置確定 輸入 npm install # 下載依賴包，package.json中的依賴包 npm run build # 打包編譯前端代碼到 dist 文件夾 這兩條都正確配置之后，就會生成一個 dist 靜態文件目錄，整個項目的前端內容和index.html都在這里了 如果打包編譯不成功的話，可以使用pycharm打包之后，將dist文件直接傳輸到vue項目文件中即可。 (5) 之后等待nginx加載這個 dist文件夾即可。
四、部署后端代碼所需的環境
1、部署 uwsgi 啟動后端項目
(1) 激活虛擬環境並進入 workon s15vuedrf (2) 通過一條命令，導出本地的所有軟件包依賴 在windows終端cmd中導出： pip3 freeze > requirements.txt (3) 下載django所依賴的模塊 將這個requirements.txt 傳至到服務器，在服務器的新虛擬環境中，安裝這個文件，就能安裝所有的軟件包了 pip3 install -r requirements.txt # 下載文件中后端的依賴包， 注意：可能安裝不完全，然后手動啟動項目，查看缺少什么依賴包，然后單獨再進行安裝 python3 manage.py runserver 這個文件內容如下：項目所需的軟件包都在這里了 [root@web02 opt]# cat requirements.txt 這個是老師電腦上的 certifi==2018.11.29 chardet==3.0.4 crypto==1.4.1 # pycrypto Django==2.1.4 django-redis==4.10.0 django-rest-framework==0.1.0 djangorestframework==3.9.0 idna==2.8 Naked==0.1.31 pycrypto==2.6.1 pytz==2018.7 PyYAML==3.13 redis==3.0.1 requests==2.21.0 shellescape==3.4.1 urllib3==1.24.1 uWSGI==2.0.17.1 # 這個是自己電腦上的 (s15vuedrf) [root@localhost s15vuedrf]# cat requirements.txt asn1crypto==0.24.0 # pycrypto beautifulsoup4==4.6.3 certifi==2018.8.24 cffi==1.11.5 chardet==3.0.4 Click==7.0 cryptography==2.3.1 Django==2.1.2 django-multiselectfield==0.1.8 django-redis==4.10.0 djangorestframework==3.9.0 Flask==1.0.2 gevent==1.3.6 greenlet==0.4.15 idna==2.7 itsdangerous==0.24 Jinja2==2.10 MarkupSafe==1.0 Naked==0.1.31 Pillow==5.3.0 pycparser==2.18 pycryptodome==3.7.2 PyMySQL==0.9.2 pytz==2018.5 PyYAML==3.13 redis==3.0.1 requests==2.19.1 shellescape==3.4.1 six==1.11.0 urllib3==1.23 Werkzeug==0.14.1 (4) 准備uwsgi 支持高並發的啟動python項目(注意uwsgi不支持靜態文件的解析，必須用nginx去處理靜態文件) 因此這里用 uwsgi 代替項目中的 wsgi 來啟動項目，因為要在虛擬環境中啟動項目,需要將uwsgi安裝在虛擬環境里。 1. 安裝uwsgi，要確保進入到虛擬環境中，再進行安裝 workon s15vuedrf pip3 install -i https://pypi.douban.com/simple uwsgi which uwsgi # 查看是否來自虛擬環境,才能啟動在虛擬環境中啟動項目 2. 學習uwsgi的使用方法 通過uwsgi啟動單個的python web文件 uwsgi --http :8000 --wsgi-file s15testuwsgi.py # uwsgi啟動單個py文件的命令 --http 指定http協議 --wsgi-file 指定一個python文件 通過uwsgi啟動django項目，並且支持熱加載項目，不重啟項目，自動生效 新的 后端代碼 django 項目名為s15drf,需要進入項目中： cd s15drf uwsgi --http :8000 --module s15drf.wsgi --py-autoreload=1 # uwsgi啟動django項目命令 --s15drf.wsgi， #由於wsgi文件在內層的s15drf中 --module #指定找到django項目的wsgi.py文件 --py-autoreload=1 #熱加載,表示 這種啟動方式比較麻煩，因為可以寫在配置文件 uwsgi.ini 中，通過配置文件啟動項目 (5) 使用uwsgi的配置文件，啟動項目 1) 創建一個uwsgi.ini配置文件，寫入參數信息 在項目的外層目錄中創建配置文件，與manage.py在同一目錄即可， cd /opt/s15vuedrf/luffy_boy touch uwsgi.ini [uwsgi] chdir = /opt/s15vuedrf/luffy_boy/ module = luffy_boy.wsgi home = /root/Envs/s15vuedrf master = true processes = 1 socket = 0.0.0.0:9000 # 與nginx連用，啟動項目時使用 socket # http = 0.0.0.0:9000 # 只有uwsgi啟動的時候使用 http vacuum = true ++++++++++++++ 詳解見以下文件 ++++++++++++++++++++++
[uwsgi] # Django-related settings # the base directory (full path) #指定項目的絕對路徑的第一層路徑！！！！！！！！！！！！！！！！！！！！！！！！ chdir = /opt/s15vuedrf/luffy_boy/ # Django's wsgi file # 指定項目的 wsgi.py文件！！！！！！！！！！！！ # 寫入相對路徑即可，這個參數是以 chdir參數為相對路徑 module = luffy_boy.wsgi # the virtualenv (full path) # 寫入虛擬環境解釋器的 絕對路徑！！！！！！ home = /root/Envs/s15vuedrf # process-related settings # master master = true # maximum number of worker processes #指定uwsgi啟動的進程個數 processes = 1 #這個參數及其重要！！！！！！ #這個參數及其重要！！！！！！ #這個參數及其重要！！！！！！ #這個參數及其重要！！！！！！ # the socket (use the full path to be safe #socket指的是，uwsgi啟動一個socket連接，當你使用nginx+uwsgi的時候，使用socket參數 socket = 0.0.0.0:8000 #這個參數是uwsgi啟動一個http連接，當你不用nginx只用uwsgi的時候，使用這個參數 #這個參數是uwsgi啟動一個http連接，當你不用nginx只用uwsgi的時候，使用這個參數 #這個參數是uwsgi啟動一個http連接，當你不用nginx只用uwsgi的時候，使用這個參數 #這個參數是uwsgi啟動一個http連接，當你不用nginx只用uwsgi的時候，使用這個參數 #這個參數是uwsgi啟動一個http連接，當你不用nginx只用uwsgi的時候，使用這個參數 #http = 0.0.0.0:8000 #。。。。。。。 # ... with appropriate permissions - may be needed # chmod-socket = 664 # clear environment on exit vacuum = true
(6)使用uwsgi配置文件啟動項目 cd /opt/s15vuedrf/luffy_boy/ uwsgi --ini uwsgi.ini # 確保在項目中，執行以下命令，啟動項目
2、supervisor進程管理工具，啟動項目
supervisor進程管理工具 1.將linux進程運行在后台的方法有哪些 1)命令后面加上 & 符號 python manage.py runserver & 2)使用nohup命令 3)使用進程管理工具supervisor 這里采用第三種方式 2.安裝supervisor，使用python2的包管理工具 easy_install ，注意，此時要退出虛擬環境！！！！ 注意，此時要退出虛擬環境！！！！ 注意，此時要退出虛擬環境！！！！ 注意，此時要退出虛擬環境！！！！ # 如果沒有命令，使用以下命令，安裝： yum install python-setuptools easy_install supervisor # 然后,輸入 echo tab鍵查看是否有echo_supervisord_conf命令 3.通過命令，生成一個配置文件，這個文件就是寫入你要管理的進程任務 echo_supervisord_conf > /etc/supervisor.conf 4.編輯這個配置文件，寫入操作 django項目的 命令 vim /etc/supervisor.conf # 直接到最底行，寫入以下配置 uwsgi啟動項目的命令 [program:s15luffy] command=/root/Envs/s15vuedrf/bin/uwsgi --ini /opt/s15vuedrf/luffy_boy/uwsgi.ini #command= uwsgi路徑 --ini 項目中uwsgi.ini配置文件路徑 5.啟動supervisord服務端，指定配置文件啟動 啟動之前要確保，沒有殺死 supervisor進程和 uwsgi 進程 supervisord -c /etc/supervisor.conf 6.通過supervisorctl管理任務 supervisorctl -c /etc/supervisor.conf 7.supervisor管理django進程的命令如下 supervisorctl直接輸入命令會進入交互式的操作界面 > stop s15luffy > start s15luffy > status s15luffy 8.完成了啟動luffy的后端代碼
3、配置 nginx 步驟
配置nginx步驟如下 1.確保安裝了nginx 前面的博文中有安裝步驟，查看即可 nginx的安裝 2.配置文件/opt/nginx112/conf/nginx.conf如下： #第一個server虛擬主機是為了找到vue的dist文件， 找到路飛的index.html server { listen 80; server_name 192.168.13.210; #當請求來自於 192.168.13.210/的時候默認80端口，直接進入以下location，然后找到vue的dist/index.html location / { root /opt/s15vuedrf/07-luffy_project_01/dist; index index.html; } } #由於vue發送的接口數據地址是 192.168.13.210:8000 我們還得再准備一個入口server如下 server { listen 8000; server_name 192.168.13.210; #當接收到接口數據時，請求url是 192.168.13.210:8000 就進入如下location location / { #這里是nginx將請求轉發給 uwsgi啟動的 9000端口，uwsgi.ini文件中端口9000，的項目將被啟動 uwsgi_pass 192.168.13.210:9000; # include 就是一個“引入的作用”，就是將外部一個文件的參數，導入到當前的nginx.conf中生效 include /opt/nginx112/conf/uwsgi_params; } } 3.啟動nginx nginx # 直接啟動服務，如果沒有添加系統環境變量就用絕對路徑啟動，/opt/nginx112/sbin/nginx 此時可以訪問 192.168.13.210 查看頁面結果即可，顯示正常則完成項目的部署 啟動路飛項目，這個項目用的是sqllite，因此安裝mysql自行選擇 redis必須安裝好，存放購物車的數據
五、vue+nginx頁面刷新404錯誤解決方案
vue+nginx頁面刷新404錯誤解決方案 參考地址:https://router.vuejs.org/zh/guide/essentials/history-mode.html 1.修改nginx.conf,給前端server添加一行try_files $uri $uri/ /index.html; # 這里的try_files相當於在服務端增加一個覆蓋所有情況的候選資源：如果 URL 匹配不到任何靜態資源，則應該返回同一個 index.html 頁面 server{ listen 80; server_name 192.168.119.128; location / { root /opt/vuedrf/07-luffy_project_01/dist; index index.html ; try_files $uri $uri/ /index.html; } } 2.此時，你的服務器就不再返回 404 錯誤頁面，因為對於所有路徑都會返回 index.html 文件;如果路由不存在則會返回空頁面,不會報錯. 為了避免這種情況，你應該在 Vue-router里面覆蓋所有的路由情況，然后再給出一個NotFound頁面 (1)vue components里創建一個NotFound頁面: <template> <h1>頁面不存在</h1> </template> <script> export default { name: "NotFound" } </script> <style scoped> </style> (2)vue-router里: # 引入NotFound頁面 import NotFound from '@/components/NotFound/NotFound' # 在routes列表最后添加NotFound捕獲所有未定義頁面 { path: "*", name:'NotFound', component:NotFound, } 3.重新生成dist文件,啟動nginx