HackMD
  • Beta
    Beta  Get a sneak peek of HackMD’s new design
    Turn on the feature preview and give us feedback.
    Go → Got it
      • Create new note
      • Create a note from template
    • Beta  Get a sneak peek of HackMD’s new design
      Beta  Get a sneak peek of HackMD’s new design
      Turn on the feature preview and give us feedback.
      Go → Got it
      • Sharing Link copied
      • /edit
      • View mode
        • Edit mode
        • View mode
        • Book mode
        • Slide mode
        Edit mode View mode Book mode Slide mode
      • Note Permission
      • Read
        • Only me
        • Signed-in users
        • Everyone
        Only me Signed-in users Everyone
      • Write
        • Only me
        • Signed-in users
        • Everyone
        Only me Signed-in users Everyone
      • More (Comment, Invitee)
      • Publishing
        Please check the box to agree to the Community Guidelines.
        Everyone on the web can find and read all notes of this public team.
        After the note is published, everyone on the web can find and read this note.
        See all published notes on profile page.
      • Commenting Enable
        Disabled Forbidden Owners Signed-in users Everyone
      • Permission
        • Forbidden
        • Owners
        • Signed-in users
        • Everyone
      • Invitee
      • No invitee
      • Options
      • Versions and GitHub Sync
      • Transfer ownership
      • Delete this note
      • Template
      • Save as template
      • Insert from template
      • Export
      • Dropbox
      • Google Drive Export to Google Drive
      • Gist
      • Import
      • Dropbox
      • Google Drive Import from Google Drive
      • Gist
      • Clipboard
      • Download
      • Markdown
      • HTML
      • Raw HTML
    Menu Sharing Create Help
    Create Create new note Create a note from template
    Menu
    Options
    Versions and GitHub Sync Transfer ownership Delete this note
    Export
    Dropbox Google Drive Export to Google Drive Gist
    Import
    Dropbox Google Drive Import from Google Drive Gist Clipboard
    Download
    Markdown HTML Raw HTML
    Back
    Sharing
    Sharing Link copied
    /edit
    View mode
    • Edit mode
    • View mode
    • Book mode
    • Slide mode
    Edit mode View mode Book mode Slide mode
    Note Permission
    Read
    Only me
    • Only me
    • Signed-in users
    • Everyone
    Only me Signed-in users Everyone
    Write
    Only me
    • Only me
    • Signed-in users
    • Everyone
    Only me Signed-in users Everyone
    More (Comment, Invitee)
    Publishing
    Please check the box to agree to the Community Guidelines.
    Everyone on the web can find and read all notes of this public team.
    After the note is published, everyone on the web can find and read this note.
    See all published notes on profile page.
    More (Comment, Invitee)
    Commenting Enable
    Disabled Forbidden Owners Signed-in users Everyone
    Permission
    Owners
    • Forbidden
    • Owners
    • Signed-in users
    • Everyone
    Invitee
    No invitee
       owned this note    owned this note      
    Published Linked with GitHub
    Like BookmarkBookmarked
    Subscribed
    • Any changes
      Be notified of any changes
    • Mention me
      Be notified of mention me
    • Unsubscribe
    Subscribe
    --- tags: Python --- # Flask 網頁框架 flask是個微框架(microframework),相較於django把所有MTV(model、template、view)架構都打包好了,僅提供最基礎的功能,因此初期上手容易理解,但需要仰賴大量的套件 ## 安裝python 下載[python 3.7](https://www.python.org/ftp/python/3.7.9/python-3.7.9-amd64.exe)可支援大多數的套件 - [X] 使用環境變數 ``` pip show [某個套件] pip install pipenv pipenv shell pip install -r requirements.txt pip freeze > requirements.txt ``` ## python 資料型態 list [i for i in range(10) if i%2==0] dictionary {'key':value} keys() values() items() tuple () zip(a,b) ## os檔案路徑 os.get_cwd() os.path.join() os.path.dirname(__file__) os.path.basename() os.path.splitext() ## 啟動flask import os from flask import Flask, Response, request, jsonify, url_for, redirect, session, send_from_directory from flask_cors import CORS app = Flask(__name__) CORS(app) # 允許使用live server開發 # 資料庫位置(絕對路徑) app['DATABASE_URI'] = os.path.join(os.path.dirname(__file__), 'flaskr.db') if __name__ == '__main__': app.secret_key = os.urandom(16).hex() app.run(host='localhost', port=5000, debug=True) ## 動態路由 Request方法GET,POST,PUT,DELETE Response(status codes)100~500 1xx: Information 2xx: Successful 200: OK 3xx: Redirection 4xx: Client Error 404: Not Found 5xx: Server Error 500: Internal Server Error @app.route('/<path>', methods=['GET']) 靜態檔 send_from_directory('static/js', path) ## 檔案讀寫 import json import sqlite3 import pandas as pd with open('') as f: f.read() with open('','w',encoding='utf8') as f: f.write() json.dump(f,'',ensure_ascii=False) with sqlite3.connect('') as con: df = pd.read_sql('',con) df.to_sql('',if_exists='append') ## SQL操作 - CRUD (create, read, update, delete) create CREATE TABLE IF NOT EXISTS [TABLE] ([SCHEMA]); INSERT INTO [TABLE]([COLUMNS]) VALUES ([VALUES]); CREATE TRIGGER [TRIGGER] [BEFORE|AFTER|INSTEAD OF] [INSERT|UPDATE|DELETE] ON [TABLE] WHEN [condition]; CREATE UNIQUE INDEX id ON [TABLE] (...); FOREIGN KEY [COLUMN] REFERENCES [TABLE] (...) ON DELETE CASCADE ON UPDATE NO ACTION; read SELECT * FROM [TABLE] WHERE account = [ACCOUNT]; update ALTER TABLE [TABLE] RENAME [COLUMN] TO [TABLE|COLUMN]; UPDATE [TABLE] SET [PWD] = [PWD] WHERE id = [ID]; REPLACE INTO [TABLE] ([ID], [PWD]) VALUES ([ID], [PWD]); delete DELETE FROM [TABLE] WHERE id = [ID]; DROP TABLE|TRIGGER [TABLE|TRIGGER]; schema type [INTEGER|REAL|TEXT|BLOB] constraint [NOT NULL|PRIMARY KEY|AUTOINCREMENT|UNIQUE|DEFAULT] default [CURRENT_TIMESTAMP] script BEGIN TRANSACTION; END; COMMIT; MYSQL - LOAD DATA INFILE ‘[.csv]’ INTO TABLE [table] FIELDS TERMINATED BY ‘,’ LINES TERMINATED BY ‘\n’ IGNORE 1 ROWS; postgreSQL - COPY DB.表格(欄位) FROM ‘文字檔的路徑’ WITH CSV HEADER DELIMITER AS ‘,’; 輸出 - SELECT * FROM [table] INTO OUTFILE ‘[.csv]’ FIELDS TERMINATED BY ‘,’ ENCLOSED BY ‘’ LINES TERMINATED BY ‘\n’; sqlite - .mode csv .output test.csv SELECT * FROM [TABLE] .output stdout ## 登入設定(flask_login) from flask_login import UserMixin, LoginManager, login_required, current_user, login_user, logout_user class User(UserMixin): pass login_manager = LoginManager() login_manager.init_app(app) login_manager.login_view = 'login' @login_manager.user_loader def load_user(user_id): user = User() user.id = user_id return user def hash_password(str_pw): m = hashlib.md5(str_pw.encode(encoding='utf-8')) return m.hexdigest() ## 整合matplotlib import io from matplotlib.backends.backend_agg import FigureCanvasAgg from matplotlib.figure import Figure fig = Figure() ax = fig.add_subplot(1, 1, 1) ax.legend(loc='lower left') output = io.BytesIO() FigureCanvasAgg(fig).print_png(output) return Response(output.getvalue(), mimetype='image/png') ## 檔案上傳 form werkzeug.utils.secure_filename <form action="http://localhost:5000/upload" method="post"> <input type="file" /> <input type="submit" /> </form> let data = new FormData(); data.append('image', file); json = await fetch({ url: 'http://localhost:5000/upload', method: 'POST', headers: { 'Content-Type': 'multipart/form-data' }, data: data, responseType: 'json', }).then((res) => res.data); ### 伺服器端架flask(ubuntu) | 動作 | 指令 | | -------- | -------- | |建立連線密鑰(本地)|ssh-keygen -R 139.162.17.188| |連線到伺服器(本地)|ssh root@139.162.17.188| |加入使用者|adduser <使用者名稱>| |給予使用者管理者權限|usermod -aG sudo <使用者名稱>| |更改使用者密碼|passwd <使用者名稱>| |編輯ssh連線設定|nano /etc/ssh/sshd_config| |不允許root使用者登入,避免密碼被暴力破解|PermitRootLogin without-password| |取消註解,使用ssh key登入|PubkeyAuthentication yes| |重啟服務以生效|service ssh restart| |切換到新增使用者|su - <使用者名稱>| |適用防火牆之應用程式|ufw app list| |允許加密的網絡傳輸|ufw allow OpenSSH| |套用設定|ufw enable| |防火牆狀態|ufw status| |更新套件|sudo apt update| |安裝代理伺服器|sudo apt install nginx| |列出所有使用到防火牆的|sudo ufw app list| |允許超文本傳輸協定|sudo ufw allow "Nginx HTTP"| |防火牆狀態|sudo ufw status| |系統服務狀態|systemctl status nginx| |取得目前IP|curl -4 icanhazip.com| |安裝python3套件|sudo apt install python3-pip| |安裝虛擬環境|sudo apt install python3-venv| |新增資料夾並進入|mkdir ~/myproject && cd $_| |新增python虛擬環境|python3 -m venv myprojectenv| |啟用虛擬環境|source myprojectenv/bin/activate| |安裝核心套件|pip install wheel uwsgi flask| |新增py檔|nano ~/myproject/myproject.py| ``` from flask import Flask app = Flask(__name__) @app.route("/") def hello(): return "<h1 style='color:blue'>Hello There!</h1>" if __name__ == "__main__": app.run(host='0.0.0.0') ``` |依序輸入並儲存離開nano編輯環境|^x y enter| |-|-| |開放5000連接阜|sudo ufw allow 5000| |執行py檔|python myproject.py| |本地端測試|http://139.162.17.188:5000| |新增wsgi.py檔|nano ~/myproject/wsgi.py| ``` from myproject import app if __name__ == "__main__": app.run() ``` |使用uwsgi執行|uwsgi --socket 0.0.0.0:5000 --protocol=http -w wsgi:app| |-|-| |本地端測試|http://139.162.17.188:5000| |退出虛擬環境|deactivate| |新增uWSGI起始設定檔|nano ~/myproject/myproject.ini| ``` [uwsgi] module = wsgi:app master = true processes = 5 socket = myproject.sock chmod-socket = 660 vacuum = true die-on-term = true ``` |新增系統服務檔|sudo nano /etc/systemd/system/myproject.service| |-|-| ``` [Unit] Description=uWSGI instance to serve myproject After=network.target [Service] User=sammy Group=www-data WorkingDirectory=/home/<使用者名稱>/myproject Environment="PATH=/home/<使用者名稱>/myproject/myprojectenv/bin" ExecStart=/home/<使用者名稱>/myproject/myprojectenv/bin/uwsgi --ini myproject.ini [Install] WantedBy=multi-user.target ``` |啟用系統服務|sudo systemctl start myproject| |-|-| |套用系統服務|sudo systemctl enable myproject| |檢視系統服務|sudo systemctl status myproject| |移除預設|sudo rm /etc/nginx/sites-available/default| |新增|sudo nano /etc/nginx/sites-available/myproject| ```nginx= server { listen 80; #server_name your_domain www.your_domain; server_name http://139.162.17.188; location / { include uwsgi_params; uwsgi_pass unix:/home/sammy/myproject/myproject.sock; } } ``` |建立檔案連結|sudo ln -s /etc/nginx/sites-available/myproject /etc/nginx/sites-enabled| |-|-| |測試代理伺服器|sudo nginx -t| |重新開啟|sudo systemctl restart nginx| |關閉5000連接阜|sudo ufw delete allow 5000| |允許代理伺服器各種連線|sudo ufw allow "Nginx Full"| |大功告成|http://139.162.17.188| ### SSL憑證(cPanel) |產生憑證|openssl req -new -newkey rsa:2048 -nodes -keyout server.key -out domain_name.csr| |-|-| |依序填入,郵件密碼可跳過|TW、Taiwan、Taichung、ChuBoy Inc.、IT、www.domain_name.com| |複製私鑰到資料夾下|mv domain_name.key /etc/ssl| |把整段csr貼到SSL代理商上|-----BEGIN CERTIFICATE REQUEST-----| |選擇DNS認證,點選GET RECORD複製CNAME|一開始沒有DNS選項,先選擇HTTP based,填入Email後到管理頁再調成DNS認證| |將CNAME的HOST和Target貼到虛擬機服務商|| |等待通知,憑證商與虛擬機商配對完成後,到SSL代理商網站下載<domain_name>.crt,並丟到/etc/ssl裡|| |在/etc/nginx/sites-enabled修改crt對應位置如下|| ```nginx= server { listen 443; ssl on; ssl_certificate /etc/ssl/<domain_name>.com.crt; ssl_certificate_key /etc/ssl/<domain_name>.key; server_name domain_name.com www.my_domain.com.com; root /var/www/; access_log /var/log/nginx/nginx.vhost.access.log; error_log /var/log/nginx/nginx.vhost.error.log; location / { # if you are using localhost as a server proxy_pass https://localhost:3000; } } ``` |從apt庫取得certbot|sudo add-apt-repository ppa:certbot/certbot| |-|-| |安裝apt套件|sudo apt install python-certbot-nginx| ||sudo certbot --nginx -d IP位址 -d 已註冊域名| ||sudo ufw delete allow 'Nginx HTTP'| ||sudo certbot --nginx| ||sudo certbot renew --dry-run| ||sudo certbot renew --dry-run| |編輯工作排程|sudo crontab -e| ||30 4 1 * * sudo certbot renew| ### flask restful API(Swagger) > pip install flask==1.1.2 flask_restplus==0.13.0 sqlalchemy==1.4.22 werkzeug==0.16.1 sqlacodegen `__init__.py` ```python= # 空白,告訴python當前資料夾為模組 ``` `model.py` ```python= # 透過以下指令自動產生 # sqlacodegen mssql+pymssql://localhost\SQLEXPRESS/J3WEBAP > model.py ``` `config.py` ```python= # 配置系統設定 from sqlalchemy import create_engine, orm engine = create_engine('mssql+pymssql://localhost\\SQLEXPRESS/J3WEBAP') # engine = create_engine('mysql://account:passwordlocalhost/J3WEBAP') # engine = create_engine('postgresql://account:passwordlocalhost/J3WEBAP') # engine = create_engine('sqlite:///J3WEBAP.db') con = orm.sessionmaker(engine)() ``` `apis/user_api.py` ```python= from config import engine, con from model import UserRoleDetail, UserHeader from flask import request, url_for, redirect, send_from_directory from flask_restplus import Namespace, Resource from flask_restplus.fields import Boolean, Integer, String, Float, List ns = Namespace('oet','公文製作') # https://docs.sqlalchemy.org/en/14/orm/tutorial.html # 定義JSON結構 UserRole = ns.model('UserRole', dict( DepID = String, DivID = String, UserID = String, UserNam = String, UserAccount = String )) UserDTO = ns.model('UserDTO', dict( account = String, )) # 配置路由(使用marshal_with或marshal_list_with會將Class轉成json) @ns.route('/user/<UserNam>') @ns.param('UserNam','使用者名稱') @ns.response(404, 'Not found') class UserRoute(Resource): @ns.doc('讀取') @ns.marshal_with(UserRole) def get(self, UserNam): return con.query( UserRoleDetail.DepID, UserRoleDetail.DivID, UserRoleDetail.UserID, UserHeader.UserNam, UserHeader.UserAccount, ).filter( UserRoleDetail.UserID==UserHeader.UserID, UserHeader.UserNam==UserNam ).one() @ns.doc('新增') @ns.expect(UserDTO) def post(self, UserNam): account = request.json['account'] user = UserHeader(UserNam=UserNam, UserAccount=account) con.add(user) con.commit() return 'OK' @ns.doc('更新') @ns.expect(UserDTO) def put(self, UserNam): account = request.json['account'] user = con.query(UserHeader).filter_by(UserNam=UserNam).one() user.UserAccount = account con.commit() return 'OK' @ns.doc('刪除') def delete(self, UserNam): user = con.query(UserHeader).filter_by(UserNam=UserNam).one() con.delete(user) con.commit() return 'OK' ``` `app.py` ```python= import os from apis import user_api from config import engine from model import metadata from flask import Flask, Blueprint from flask_restplus import Api metadata.create_all(engine) # 同步資料庫 app = Flask(__name__) router = Blueprint('api', __name__, url_prefix='/api') api = Api(router, version='1.0', title='DSICWEBAP', description='', doc='/doc') api.add_namespace(user_api.ns) app.register_blueprint(router) if __name__ == '__main__': app.secret_key = os.urandom(16).hex() app.run(host='localhost', port=5000, debug=True) ``` ### flask 檔案上傳 ```python= import os from flask import Flask, request, redirect, url_for, render_template from flask_cors import CORS from werkzeug.utils import secure_filename app = Flask(__name__) CORS(app) ALLOWED_EXT = ['txt','pdf','png','jpg','jpeg','gif'] @app.route('/',methods=['GET']) def home(): if request.method == "GET": return render_template('uploader.html') @app.route('/upload',methods=['POST']) def upload(): if request.method == "POST": if request.files: file = request.files['image'] if file.filename == '': print('No selected file') return redirect(request.url) elif file.filename.split('.')[-1] in ALLOWED_EXT: filename = secure_filename(file.filename) file.save(os.path.join('', filename)) return 'uploaded' else: return 'invalid file type' if __name__ == '__main__': app.run(debug=True) ``` ```htmlembedded= <body> <form action="http://localhost:5000/upload" method="post" target="_blank" enctype="multipart/form-data"> <input id="file" type="file" name="image" onchange="uploadFile()"> <label id="upload-label" for="image">Select One...</label> <input type="submit" value="提交"> </form> <script> function uploadFile(){ var file = document.getElementById('file').files[0]; var formdata = new FormData(); formdata.append('image',file); var ajax = new XMLHttpRequest(); ajax.upload.addEventListener('progress', progressHandler); ajax.open('POST','http://localhost:5000/upload'); ajax.send(formdata); } function progressHandler(e){ document.getElementById('upload-label').innerHTML=e.loaded+'bytes'+e.total; } </script> </body> ``` ### flask+keras 圖片辨識 ```python= import io from keras.applications import ResNet50 from keras.preprocessing.image import img_to_array from keras.applications import imagenet_utils from PIL import Image import numpy as np from flask import Flask, request, jsonify import tensorflow as tf app = Flask(__name__) model = None def load_model(): global model global graph model = ResNet50(weights='imagenet') graph = tf.get_default_graph() def preprocess_image(image, target): if image.mode != 'RGB': image = image.covert('RGB') image = image.resize(target) image = img_to_array(image) image = np.expand_dims(image, axis=0) image = imagenet_utils.preprocess_input(image) return image @app.route('/predict', methods=['POST']) def predict(): data = {'success': False} print('post request') if request.method == 'POST': image = request.files['image'].read() image = Image.open(io.BytesIO(image)) image = preprocess_image(image, target=(224,224)) with graph.as_default(): preds = model.predict(image) results = imagenet_utils.decode_predictions(preds) data['predictions'] = [] for (imagenetID, label, prob) in results[0]: r = {'label':label, 'probability':float(prob)} data['predictions'].append(r) data['success'] = True return jsonify(data) if __name__ == '__main__': print('loading keras model') load_model() app.run() ```

    Import from clipboard

    Advanced permission required

    Your current role can only read. Ask the system administrator to acquire write and comment permission.

    This team is disabled

    Sorry, this team is disabled. You can't edit this note.

    This note is locked

    Sorry, only owner can edit this note.

    Reach the limit

    Sorry, you've reached the max length this note can be.
    Please reduce the content or divide it to more notes, thank you!

    Import from Gist

    Import from Snippet

    or

    Export to Snippet

    Are you sure?

    Do you really want to delete this note?
    All users will lost their connection.

    Create a note from template

    Create a note from template

    Oops...
    This template is not available.


    Upgrade

    All
    • All
    • Team
    No template found.

    Create custom template


    Upgrade

    Delete template

    Do you really want to delete this template?

    This page need refresh

    You have an incompatible client version.
    Refresh to update.
    New version available!
    See releases notes here
    Refresh to enjoy new features.
    Your user state has changed.
    Refresh to load new user state.

    Sign in

    Forgot password

    or

    By clicking below, you agree to our terms of service.

    Sign in via Facebook Sign in via Twitter Sign in via GitHub Sign in via Dropbox

    New to HackMD? Sign up

    Help

    • English
    • 中文
    • Français
    • Deutsch
    • 日本語
    • Español
    • Català
    • Ελληνικά
    • Português
    • italiano
    • Türkçe
    • Русский
    • Nederlands
    • hrvatski jezik
    • język polski
    • Українська
    • हिन्दी
    • svenska
    • Esperanto
    • dansk

    Documents

    Tutorials

    Book Mode Tutorial

    Slide Mode Tutorial

    YAML Metadata

    Contacts

    Facebook

    Twitter

    Feedback

    Send us email

    Resources

    Releases

    Pricing

    Blog

    Policy

    Terms

    Privacy

    Cheatsheet

    Syntax Example Reference
    # Header Header 基本排版
    - Unordered List
    • Unordered List
    1. Ordered List
    1. Ordered List
    - [ ] Todo List
    • Todo List
    > Blockquote
    Blockquote
    **Bold font** Bold font
    *Italics font* Italics font
    ~~Strikethrough~~ Strikethrough
    19^th^ 19th
    H~2~O H2O
    ++Inserted text++ Inserted text
    ==Marked text== Marked text
    [link text](https:// "title") Link
    ![image alt](https:// "title") Image
    `Code` Code 在筆記中貼入程式碼
    ```javascript
    var i = 0;
    ```
    var i = 0;
    :smile: :smile: Emoji list
    {%youtube youtube_id %} Externals
    $L^aT_eX$ LaTeX
    :::info
    This is a alert area.
    :::

    This is a alert area.

    Versions

    Versions and GitHub Sync

    Sign in to link this note to GitHub Learn more
    This note is not linked with GitHub Learn more
     
    Add badge Pull Push GitHub Link Settings
    Upgrade now

    Version named by    

    More Less
    • Edit
    • Delete

    Note content is identical to the latest version.
    Compare with
      Choose a version
      No search result
      Version not found

    Feedback

    Submission failed, please try again

    Thanks for your support.

    On a scale of 0-10, how likely is it that you would recommend HackMD to your friends, family or business associates?

    Please give us some advice and help us improve HackMD.

     

    Thanks for your feedback

    Remove version name

    Do you want to remove this version name and description?

    Transfer ownership

    Transfer to
      Warning: is a public team. If you transfer note to this team, everyone on the web can find and read this note.

        Link with GitHub

        Please authorize HackMD on GitHub

        Please sign in to GitHub and install the HackMD app on your GitHub repo. Learn more

         Sign in to GitHub

        HackMD links with GitHub through a GitHub App. You can choose which repo to install our App.

        Push the note to GitHub Push to GitHub Pull a file from GitHub

          Authorize again
         

        Choose which file to push to

        Select repo
        Refresh Authorize more repos
        Select branch
        Select file
        Select branch
        Choose version(s) to push
        • Save a new version and push
        • Choose from existing versions
        Available push count

        Upgrade

        Pull from GitHub

         
        File from GitHub
        File from HackMD

        GitHub Link Settings

        File linked

        Linked by
        File path
        Last synced branch
        Available push count

        Upgrade

        Danger Zone

        Unlink
        You will no longer receive notification when GitHub file changes after unlink.

        Syncing

        Push failed

        Push successfully