python: Flaskで画像をアップロードする

プログラミング
スポンサーリンク




こんにちは、おみです。

麻雀牌の画像認識アプリケーションを作る際に、画像をアップロードする処理が必要だったので、作成しました。

スポンサーリンク

実行イメージ

ファイルを選択ボタンを押してFinderからアップロードする画像を選択し、送信ボタンを押すと

 

 

画像がアップロードされ、選択した画像が表示されます。

ソースコード

↓ファイル構造

hello.py

# -----------------------------------------------
# 必要なモジュールをインポート
# -----------------------------------------------
from flask import Flask, request, session, g, redirect, url_for, \
abort, render_template, flash
import os


# -----------------------------------------------
# configを設定
# -----------------------------------------------
# DB接続用のデータを設定
from werkzeug.utils import secure_filename

USERNAME = "Evi"
PASSWORD = "evi"

# -----------------------------------------------
# メソッドを定義
# -----------------------------------------------
# インスタンスの生成
app = Flask(__name__)
app.secret_key = 'hogehoge'

# アップロード先のフォルダを指定
UPLOAD_FOLDER = './static/image/'
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER


# configの読み込み
app.config.from_object(__name__)


# URL = http://127.0.0.1:5000/
@app.route('/')
def main_page():
title = "main_page"
name = app.config['USERNAME']
return render_template("index.html", title=title, name=name)


# URL = http://127.0.0.1:5000/login
@app.route('/login', methods=["GET", "POST"])
def login():
error = None
if request.method == "POST":
if request.form['username'] != app.config['USERNAME'] or request.form['password'] != app.config['PASSWORD']:
error = 'Invalid username or password'
else:
session['logged_in'] = True
flash('You were logged in')
return redirect(url_for('main_page'))
return render_template('login.html', error=error)


# URL = http://127.0.0.1:5000/logout
@app.route('/logout')
def logout():
session.pop('logged_in', None)
flash('You were logged out')
return redirect(url_for('main_page'))


@app.route('/upload', methods=['GET', 'POST'])
def upload():
if request.method == 'POST':
# ファイルを読み込む
img_file = request.files['img_file']

# ファイル名を取得する
filename = secure_filename(img_file.filename)

# 画像のアップロード先URLを生成する
img_url = os.path.join(app.config['UPLOAD_FOLDER'], filename)

# 画像をアップロード先に保存する
img_file.save(img_url)

# 画像をWEBページに表示する
return render_template('index.html', result_img=img_url)
else:
# 書庫ページを表示する
return redirect(url_for('index'))


# 主処理
if __name__ == "__main__":
# 起動
app.run(debug=True)

 

 

index.html

{% extends "template.html" %}}
{% block content %}
{% if session.logged_in %}
<form action="{{ url_for('upload') }}" method=post enctype="multipart/form-data">
<dl>
<dt>アップロードする画像を選択してください:
<dd><input type=file id="img_file" name=img_file>
<dd><input type=submit value=送信>
</dl>
</form>

{% if result_img %}
<p>
<img src={{result_img}}>
</p>
{% endif %}
{% endif %}
{% endblock %}

 

 

 

login.html

{% extends "template.html" %}
{% block content %}
<h2>Login</h2>
{% if error %}<p class=error><strong>Error:</strong> {{ error }}{% endif %}
<form action="{{ url_for('login') }}" method=post>
<dl>
<dt>Username:
<dd><input type=text name=username>
<dt>Password:
<dd><input type=password name=password>
<dd><input type=submit value=Login>
</dl>
</form>
{% endblock %}

 

 

 

template.html

<!DOCTYPE html>
<html>
<head>
<title>{{ title }}</title>
</head>
{% if not session.logged_in %}
<a href="{{ url_for('login') }}">log in</a>
{% else %}
<a href="{{ url_for('logout') }}">log out</a>
{% endif %}
{% for message in get_flashed_messages() %}
<div class=flash>{{ message }}</div>
{% endfor %}
<body>
{% block content %}
<!-- ここにメインコンテンツを配置する -->
{% endblock %}
</body>
</html>

 

 

 

コメント

タイトルとURLをコピーしました