nginx + uwsgi 部署 Django+Vue項目

nginx + uwsgi 部署 Django+Vue項目

• windows 本地 DNS 解析 文件路徑 C:\Windows\System32\drivers\etc

1. 單機本地測試運行方式，調用django第三方的wsgifef單機模塊，性能很低 python3 manage.py runserver 0.0.0.0:8000

2. 使用uwsgi 去啓動django項目，支持併發更多

3. 準備先後端代碼

4. 先從vue前端搞起

   1. 解決node環境

   2. 更改vue發送請求的接口地址， 這個vue發送的地址，應該是發送給 nginx代理，而後代理再轉發請求給 DRF 後臺

      # 用如下命令，更改vue發送的接口地址
      sed  -i  "s/127.0.0.1/192.168.15.71/g"    /opt/s16luffy/07-luffy_project_01/src/restful/api.js

      待會要準備nginx的代理地址，以下 192.168.15.71:8000

   3. 打包編譯vue靜態文件 npm install npm run build

      #若是你打包不成功
      1.更換4G網絡，開始打包
      2.在windows中打包，生成dist文件夾後，發送給linux 
      3.在同桌機器上打包，生成dist後，發送給本身
      4.更換淘寶的 npm源，加速下載

   4. 生成的dist文件夾，就是路飛學成的靜態頁面，丟給nginx去返回頁面便可

5. 配置nginx.conf找到vue的靜態頁面

   # 配置
       server{
           listen 80;
           server_name  項目地址.com;
           location / {
               root  /opt/項目目錄/dist;
               index index.html;
               # vue 結合 nginx 再也不刷新出現 404
               try_files $uri $uri/ /index.html;
           }
           error_page  404 400 401 403     /jQuery404/40x.html;
       }
   	# 轉發請求到 192.168.15.74:9000
       server{
           listen 8000;
           server_name  vuelufei.com;
           location / {
             uwsgi_pass 192.168.15.74:9000;
             include  /opt/nginx112/conf/uwsgi_params;
           }
       }

6. 配置後端代碼，用uwsgi啓動luffy學誠

   mkvirtualenv  虛擬環境名字  # 建立虛擬環境
   pip3 list  
   pip3 install -r requirements.txt  #  導入項目依賴

7. 準備uwsgi，以及uwsgi.ini

uwsgi.ini配置參數以下

(uwsgi_xiangmuming) [root@s16ds zhangfei]# cat uwsgi.ini 

[uwsgi]
# Django-related settings
# the base directory (full path)
#指定django的項目目錄，第一層
chdir           = /opt/s16luffy/luffy_boy/
# Django's wsgi file
#找到django的wsgi文件
#這裏須要寫項目的第二層目錄Alibab_crm
module          = luffy_boy.wsgi
# the virtualenv (full path)
#填寫虛擬環境的絕對路徑
home            =/root/Envs/uwsgi_luffycity
# process-related settings
# master
master          = true
# maximum number of worker processes
processes       = 5
# the socket (use the full path to be safe
#指定socket協議，運行django，只能與nginx結合時使用
#指定socket協議，運行django，只能與nginx結合時使用
socket          = 0.0.0.0:9000

#若是你沒用nginx，只想本身啓動一個http界面，用這個
#http =  0.0.0.0:8000

# ... with appropriate permissions - may be needed
# chmod-socket    = 664
# clear environment on exit
vacuum          = true

1. 更改django後臺的redis數據庫鏈接

   1. 更改redis鏈接

      CACHES = {
          "default": {
              "BACKEND": "django_redis.cache.RedisCache",
              "LOCATION": "redis://192.168.15.71:6666",  
              "OPTIONS": {
                  "CLIENT_CLASS": "django_redis.client.DefaultClient",
                  "CONNECTION_POOL_KWARGS": {"max_connections": 100},
                  # "PASSWORD": "密碼",
                  "DECODE_RESPONSES":True
              }
          },
      }

   2. 更改redis數據庫鏈接的驅動，用django的驅動

      vim /opt/項目目錄/api/views/shoppingcart.py

      修改以下

      import redis
      # REDIS_CONN = redis.Redis(decode_responses=True)
      REDIS_CONN = get_redis_connection()

   3. 啓動redis數據庫，注意更改redis的安全模式，

      redis-6666.conf配置以下 (uwsgi_luffycity) [root@s16ds redis-4.0.10]# cat redis-6666.conf

      port 6666
      daemonize yes
      pidfile /data/6666/redis.pid
      loglevel notice
      logfile "/data/6666/redis.log"
      dir /data/6666
      appendonly yes
      appendfsync everysec
      protected-mode no
      bind 192.168.15.71

   4. 啓動redis服務端

      redis-server redis-6666.conf

2. 確保vue和nginx，以及uwsgi都啓動了，測試以瀏覽器訪問

3. 解決 vue 結合 nginx 刷新 404 解決辦法

確保 vue router 的 mode 路徑 vue項目/router/index.js 修改配置:

export default new Router({
linkActiveClass:'is-active',
mode:'history', // 改爲history 模式
...
})

1. 修改nginx.conf代碼

server {
    listen   80;
    server_name  vueluffy.com;
    location / {
    root /opt/luffy/dist;
    index index.html;
    # 主要參數
    try_files uri uri/ /index.html; 

}
}

virtualenv virtualevnwrapper pyenv

​