10RMB/月不到部署FLASK網站專案（flask+gunicorn+nginx）

傑柯發表於2020-10-22

FLASK專案部署

一、本地寫好一個小專案

（一）專案結構

My_website
┣━ HelloWorld
┃ ┣━ blueprints
┃ ┃ ┗━ main.py
┃ ┣━ static
┃ ┃ ┗━ css
┃ ┃ ┗━ style.css
┃ ┣━ templates
┃ ┃ ┗━ index.html
┃ ┗━ __init__.py
┣━ run.py
┗━ .flaskenv

粗體資料夾，細體是檔案目錄

（二）程式碼部分

__init__py

# __ini__.py
from flask import Flask
from HelloWorld.blueprints.main import main_bp


def create_app():
    app = Flask('HelloWorld')
    app.register_blueprint(main_bp)

    return app

main.py

# main.py
from flask import Blueprint, render_template

main_bp = Blueprint('main', __name__)


@main_bp.route('/')
def index():
    return render_template('index.html')

run.py

# run.py
from HelloWorld import create_app

app = create_app()

style.css

/* style.css */
*{
    margin: 0;
    padding: 0;
}

body{
    padding-top: 20%;
    background-color: #50514f;
    display: flex;
    flex-direction: column;
    align-items: center;
}

p.china{
    margin-top: 30px;
    color: white;
    font-family: 黑體;
    font-size: 1.5rem;
    font-weight: lighter;
}
p.english{
    font-size: 1.2rem;
    font-weight: bold;
    font-family: 微軟雅黑;
    color: #70c1b3;
}

index.html

{# index.html #}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>你好世界</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
</head>
<body>
<p class="china">你好，你已經部署成功！</p>
<p class="english">Wow , congratulation , it work !</p>
<p class="china">完善屬於你自己的網站吧！</p>
<p class="english">Next , complete your own site as you like !</p>
<p class="china">希望能留下你的心得收穫！</p>
<p class="english">Hope to leave your happy expression !</p>



</body>
</html>

（三）生成requirement.txt檔案

$ pip install pipreqs

# 進入專案目錄
$ cd My_website
$ pipreqs ./

由於專案比較小，所以最終生成的requirment.txt檔案只包含FLask庫
所以在後續開發過程中，如果引進了新的第三方庫，也需要更新這個檔案

（四）程式碼提交到github倉庫，便於遠端主機獲取專案檔案

二、騰訊雲租用伺服器

（一）租用伺服器

騰訊雲 - 產業智變雲啟未來

如果你是學生，或者低於25歲，即可享受校園雲伺服器優惠政策，一個月只需10元左右，需要實名認證，不用稽核，都是秒認證的。

學生雲伺服器_學生雲主機_學生雲資料庫_雲+校園特惠套餐 - 騰訊雲
優惠政策
在這裡插入圖片描述

選擇第二個稍微比第二個好一點。點選購買

在這裡插入圖片描述

活動地區選什麼都ok，映象後面可以換，我加1塊錢買了域名，超值。

（二）重置伺服器

進入控制檯
進入該伺服器
選擇合適的系統
這裡我們使用Ubuntu 18.04.1LTS

點選重置密碼
在這裡插入圖片描述

使用者名稱系統預設或者自定義都行，這裡用系統預設

 ![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20201022210421720.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3pwanpjaA==,size_16,color_FFFFFF,t_70#pic_center)

重置例項密碼完成後頁面會重新整理一下，接下來就是搭建網站了

（三）域名解析

在這裡插入圖片描述

需要實名認證，這次需要身份證的照片，只有認證了才可以域名解析
不過我們可以先新增記錄

新增記錄
在這裡插入圖片描述

點選 “解析”
點選 “新增記錄”

在這裡插入圖片描述

兩條記錄不同的是，如果你想訪問你的網站，可以通過輸入兩個網址
第一張圖是：www.zpjcmm.design
第二張圖是：zpjcmm.design

在這裡插入圖片描述

儲存完可以看到，兩條記錄，就等著實名認證可以之後，再用域名訪問，我們可以先用ip地址訪問我們的網址

（四）防火牆新增規則

在這裡插入圖片描述

三、伺服器搭建網站

（一）用Xsell7連線伺服器

新建會話
輸入名稱和主機地址（也就是伺服器公網ip地址）
輸入使用者名稱和密碼

這裡的使用者名稱就是在上面重置伺服器後用的使用者名稱，如果是系統預設就ubuntu，如果是自定義，就要用自定義的使用者名稱

（二）更新系統可安裝的包列表

$ sudo apt update
$ sudo apt upgrade

一路回車

（三）新增root密碼（可選）

# 新增root管理
$ sudo passwd
Enter new UNIX password:
Retype new UNIX password:
passwd: password updated successfully

（四）安裝虛擬環境並配置好程式且安裝需要的第三庫檔案

安裝pip

$ sudo apt install python3-pip

安裝和配置虛擬環境

# 安裝虛擬環境
$ sudo pip3 install virtualenv

# 安裝虛擬環境擴充包
$ sudo pip3 install virtualenvwrapper

$ nano ~/.bashrc

# .bashrc
export WORKON_HOME=$HOME/.virtualenvs
export VIRTUALENVWRAPPER_PYTHON=/usr/bin/python3
source /usr/local/bin/virtualenvwrapper.sh

儲存檔案
ctrl + o ：編輯完成
回車：檔名確認
ctrl + x：退出編su

建立虛擬環境

$ mkdir virtualenvs
$ cd virtualenvs
$ virtualenv helloworld

克隆專案到伺服器

(hell..)$ cd ..
(hell..)$ git clone https://github.com/zpj995380228/helloworld.git

安裝所需的第三方庫

(hell..)$ cd helloworld/
(hell..)$ pip install -r requirement

（五）設定防火牆（可選）

(hell..)(root)$ ufw allow 22
(hell..)(root)$ ufw allow 80
(hell..)(root)$ ufw allow 8000 
(hell..)(root)$ ufw enable

檢視防火牆狀態

(hell..)(root)$ ufw status

在這裡插入圖片描述

（六）使用Gunicorn執行程式

安裝gunicorn

(hell..)$ pip install gunicorn

執行程式

(hell..)$ guniicorn -w 4 -b 0.0.0.0:8000 run:app

（七）訪問伺服器

使用手機或者可以上網的電腦訪問你的遠端主機的IP地址的8000埠
比如我的就是：106.52.12.24:8000（記得冒號是英文輸入狀態下的冒號）
在這裡插入圖片描述

（八）使用nginx提供反向代理

(hell..)$ sudo apt install nginx

(hell..)$ sudo rm /etc/nginx/site-enabled/default
(hell..)$ sudo nano /etc/nginx/site-enabled/helloworld

# helloworld
server{
    listen 80 default_server;
    server_name _;
    access_log /var/log/nginx/access.log;
    error_log /var/log/nginx/error.log;
    location / {
        proxy_pass http://127.0.0.1:8000;
        proxy_redirect off;
        proxy_set_header Host              $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;
    }
    location /static {
    alias /home/ubuntu/helloworld/HelloWorld/static/ ;
    expires 30d;
    }
}

執行程式

(hell..)$ gunicorn -w 4 run:app
[2020-10-22 07:12:26 +0800] [9935] [INFO] Starting gunicorn 20.0.4
[2020-10-22 07:12:26 +0800] [9935] [INFO] Listening at: http://127.0.0.1:8000 (9935)
[2020-10-22 07:12:26 +0800] [9935] [INFO] Using worker: sync
[2020-10-22 07:12:26 +0800] [9938] [INFO] Booting worker with pid: 9938
[2020-10-22 07:12:26 +0800] [9939] [INFO] Booting worker with pid: 9939
[2020-10-22 07:12:26 +0800] [9941] [INFO] Booting worker with pid: 9941
[2020-10-22 07:12:26 +0800] [9943] [INFO] Booting worker with pid: 9943

直接訪問ip地址

在這裡插入圖片描述

style.css被禁止，檢視nginx錯誤日誌

(hell..)$ nano /var/log/nginx/error.log

2020/10/22 07:12:32 [error] 9670#9670: *6 open() "/home/ubuntu/helloworld/HelloWorld/static//css/style.css" failed (13: Permission denied), cli$
2020/10/22 07:12:39 [error] 9670#9670: *6 open() "/home/ubuntu/helloworld/HelloWorld/static//css/style.css" failed (13: Permission denied), cli$
2020/10/22 07:17:32 [error] 9670#9670: *10 open() "/home/ubuntu/helloworld/HelloWorld/static//css/style.css" failed (13: Permission denied), cl$
2020/10/22 07:17:43 [error] 9670#9670: *10 open() "/home/ubuntu/helloworld/HelloWorld/static//css/style.css" failed (13: Permission denied), cl$

許可權問題，修改nginx的許可權就可以了

(hell..)$ nano /etc/nginx/nginx.conf

user www-data; 刪除這一行 
user root;     換成這一行
...

再執行程式

(hell..)$ sudo service nginx restart
(hell..)$ gunicorn -w 4 run:app
[2020-10-22 07:28:31 +0800] [12285] [INFO] Starting gunicorn 20.0.4
[2020-10-22 07:28:31 +0800] [12285] [INFO] Listening at: http://127.0.0.1:8000 (12285)
[2020-10-22 07:28:31 +0800] [12285] [INFO] Using worker: sync
[2020-10-22 07:28:31 +0800] [12288] [INFO] Booting worker with pid: 12288
[2020-10-22 07:28:31 +0800] [12290] [INFO] Booting worker with pid: 12290
[2020-10-22 07:28:31 +0800] [12292] [INFO] Booting worker with pid: 12292
[2020-10-22 07:28:31 +0800] [12293] [INFO] Booting worker with pid: 12293

在這裡插入圖片描述

（九）使用supervisor管理程式實現自動後臺執行

(hell..)$ sudo apt install supervisor
(hell..)$ sudo nano /etc/supervisor/conf.d/helloworld.conf

[program:helloworld]
command=/home/ubuntu/.virtualenvs/helloworld/bin/gunicorn -w 4 run:app
directory=/home/ubuntu/helloworld
user=root
autostart=true
autorestart=true
stopasgroup=true
killasgroup=true

(hell..)$ sudo service supervisor restart 
(hell..)$ sudo supervisorctl 
helloworld                       RUNNING   pid 16517, uptime 0:00:08
supervisor>

在這裡插入圖片描述

CentOS 部署 flask專案
2019-03-03
CentOSFlask
Flask web專案 gunicorn部署
2024-05-01
FlaskWeb
用uWSGI和Nginx部署Flask專案
2019-05-04
NginxFlask
【保姆級】Python專案(Flask網頁)部署到Docker的完整過程
2021-07-15
PythonFlask網頁Docker
flask 專案拆分
2024-10-12
Flask
Ubuntu 22.04 + Pycharm + Flask 配置 Flask 專案
2024-08-03
UbuntuPyCharmFlask
專案實戰！用爬蟲和Flask打造屬於自己的電影網站
2018-08-08
爬蟲Flask網站
Flask專案生成Model
2024-04-30
Flask
Flask01 第一個flask專案
2022-05-10
Flask
Flask搭建個人部落格網站(1)—專案規劃--李渣渣（lizaza.cn）
2020-05-24
Flask網站
flask筆記：部署flask
2018-03-07
Flask筆記
Flask網站輕鬆部署到免費主機Heroku(2) 清除資料
2018-07-15
Flask網站
【熱門IT技術專案分享】-雲原生應用部署-電商網站
2024-10-31
網站
flask如何請求別的網站
2021-09-11
Flask網站
pipeline釋出java網站專案
2024-03-28
Java網站
10.15 品優購網站專案
2020-11-07
網站
flask 專案開發實戰
2020-04-19
Flask
flask專案之圖書案例
2018-07-16
Flask
前端部署腳手架專網專案實踐
2022-01-17
前端
Vue專案編譯後部署在非網站根目錄的解決方案
2018-04-25
Vue編譯網站
如何使用Flask編寫一個網站
2024-11-11
Flask網站
使用Flask-Avatars在Flask專案裡設定頭像
2018-07-22
Flask
django 開發網站-建立 django 專案
2020-01-04
Django網站
如何在 Flask 專案中使用 MQTT
2022-05-17
FlaskMQQT
01-Flask-初始化專案
2019-02-16
Flask
Nginx部署Vue前端專案，部署多個Vue專案
2024-06-21
NginxVue前端
使用nginx部署網站
2018-06-01
Nginx網站
【Flask】線上部署
2024-10-21
Flask
前端專案部署
2019-03-04
前端
docker部署專案
2018-07-10
Docker
[部署02] Docker 部署vue專案
2020-03-21
DockerVue
[譯] 多網站專案的 CSS 架構
2019-07-26
網站CSS架構
PyThon模組與專案熱度網站
2020-11-02
Python網站
專案管理相關網站（不斷更新）
2019-01-17
專案管理網站
12. 為LAMP的網站增加專案
2019-01-30
LAMP網站
將 Vue.js 專案部署至靜態網站託管，並開啟 Gzip 壓縮
2022-12-01
Vue.js網站
Flask實戰腳手架-專案建立
2021-09-09
Flask
Flask專案常見面試問題
2019-07-23
Flask面試

10RMB/月不到部署FLASK網站專案（flask+gunicorn+nginx）

目錄

FLASK專案部署

一、本地寫好一個小專案

（一）專案結構

（二）程式碼部分

（三）生成requirement.txt檔案

（四）程式碼提交到github倉庫，便於遠端主機獲取專案檔案

二、騰訊雲租用伺服器

（一）租用伺服器

（二）重置伺服器

（三）域名解析

（四）防火牆新增規則

三、伺服器搭建網站

（一）用Xsell7連線伺服器

（二）更新系統可安裝的包列表

（三）新增root密碼（可選）

（四）安裝虛擬環境並配置好程式且安裝需要的第三庫檔案

（五）設定防火牆（可選）

（六）使用Gunicorn執行程式

（七）訪問伺服器

（八）使用nginx提供反向代理

（九）使用supervisor管理程式實現自動後臺執行

相關文章