python3-部署Flask 到 Nginx (實際生產環境)

想知道一個網站如何部署到生產環境嗎？那一定不能錯過部署Flask 到 Nginx (實際生產環境)

:::warning

1. 此範例使用Azure雲 Ubuntu 18.04
2. 建議使用三大公有雲部署(都有免費使用方案):
   1.推薦使用Google GCP上實作，最簡單且直覺，最重要的是伺服器地區有台灣(網速非常快)
   2.AWS EC2 進階設定稍微複雜些
   3.微軟 Azure 違反人性介面操作..

• 三大公有雲( GCP、EC2、Azure )建立VM方式請參閱~~
  :::

:warning: 請先安裝Nginx並在瀏覽器出現此畫面（範例有使用SSL及DNS，操作方式請參閱)

:information_source: 安裝Nginx十分容易，如Ubuntu 18.04 版本，只需要 sudo apt install -y nginx 即可
:warning: 如果是Centos需要添增EPEL倉庫唷(yum install epel-release)，才能找到Nginx

1. 撰寫一個簡單的 app

from flask import Flask
app = Flask(__name__)

@app.route("/")
def hello():
    return "Hello Flask!"

if __name__ == "__main__":
    app.run(debug=True,host="0.0.0.0")

:information_source: 安裝flask套件 pip install flask

2. 執行程式測試

   export FLASK_APP=app.py # 設定 FLASK_APP環境變數
   flask run --host 0.0.0.0

   

3. 修改Nginx

   vim /etc/nginx/sites-enabled/default

   
   location /static {
   alias /var/www/html;
   }

location / {
proxy_pass http://localhost:8000;
include /etc/nginx/proxy_params;
proxy_redirect off;
}

![](https://i.imgur.com/Jc8igyN.png)
:information_source:  紅匡上方式配置SSL 加密方式，非必須選項，如要配置請參閱[SSL配置方式](https://hackmd.io/@JeffWen/ssl)
:warning: 如果安裝的Nginx版本沒有proxy_params參數設定檔案，請自行加上下面參數
```nginx=
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;

3. 使用gunicorn 執行測試

   gunicorn -w 3 app:app  # 3 表示 (core * 2) +1

   
   :information_source:

   1. 安裝gunicorn套件 pip install gunicorn
   2. 會發現nginx會將動態網頁轉給gunicorn（不用在輸入port號，會依據nginx設定轉成80/443）
   3. nginx 、gunicorn、flask各角色示意圖
      
      

:information_source::information_source: :information_source: Flask 已經部署到生產環境～～～

附錄－使用安全性最高TLS 1.3 加密及HTTP 2.0

使用TLS 1.3

:information_source: TLS 1.3 為 2018年8月發表，比上一代 TLS 1.2 更加安全及快速

1. 輸入Ｄomain name至CDN77網站檢測～
   
2. 檢測結果，使用TLS 1.2 導致安全性並不高
   
3. 修改Nginx設定

   vim /etc/nginx/sites-enabled/default

   # 於 listen 443 ssl下方添加一段;
   ssl_protocols TLSv1.3;

   
   :information_source: 記得要重啟 Nginx ( nginx -s reload)

4. 重新至CDN77網站檢測（如該網頁有快取，要重新刷新)
   
   :information_source: 網頁安全性已經提高了～～

使用HTTP 2.0

:information_source: HTTP 2.0 為 HTTP 的新一代，於2015年各主瀏覽器開始使用，簡稱 H2

1. 於Chrome 開啟開發人員工具，並選擇Network
   
   :information_source: 發現原本協定為http/1.1(如果沒有看到協定選項要自行點右鍵開啟)

2. 修改Nginx設定

   vim /etc/nginx/sites-enabled/default

   # 於 listen 443 ssl 後面添加 ; 
   listen 443 ssl http2;

   
   :information_source: 記得要重啟 Nginx ( nginx -s reload)

3. 至Chrom 重新整理
   
   :information_source: 網頁協定就改為H2，並可從右方看出壓縮比明顯小於前一代協定

將 Flask 製作的登入(出)網頁部署到生產環境練習

相關程式碼請參閱

• 執行方式

# 切換到網頁該目錄下
gunicorn -w 3 app:app