flask template form
このチュートリアルでは、Flaskテンプレート、フォーム、ビュー、応答、およびリダイレクトとは何かを実際の例で説明します。
一般に、テンプレートはプログラミングで使用され、テキストの一部を異なるデータで再利用します。 Web開発に関しては、デザイナーはテンプレートを使用して、人間の読者にとって読みやすく魅力的な形式でデータを表示します。
テンプレートデザインは、人間の相互作用によってもたらされる複雑さのために、一般的に言語の使用を伴います。
学習内容：
前書き
Flaskは、Jinja2と呼ばれるテンプレートエンジンを使用します。これは、ユーザーの操作レベルに基づいてアプリケーションの動作を表示します。 Jinjaテンプレートは、変数、式、およびタグを使用します。
変数と式は、ブラウザでページをレンダリングする前の実行時に値に置き換えられます。 Jinjaタグは、Flaskテンプレートでロジックと制御ステートメントを作成するのに役立ちます。
フラスコビュー
Flaskビューの概念は、Model-View-Controllerと呼ばれる一般的なWebアプリケーションデザインパターンから派生しています。ビューは、このパラダイムで相互接続された3つの要素の1つであり、アプリケーションロジックを扱います。ビューは、ユーザーへの情報の表示を処理します。
前のチュートリアルでは、Flask-AppbuilderのBaseViewクラスをサブクラス化してビューを設計しました。このチュートリアルの後続の部分では、最後の例を拡張し、ビューをカスタマイズする方法を示します。
フラスコテンプレート
最初のテンプレートを作成してみましょう。テンプレートディレクトリの下にhello.htmlというファイルを作成します。
そのファイルに次のコードを記述して保存します。
Hello World!, from Software Testing Help.
{% for item in greetings %} {% if 'Morning' in item %} {{item}}
{% else %} {{item}}
{% endif %} {% endfor %} テンプレートForループ
上記のFlaskテンプレートでは、forループを使用してリストのアイテムを反復処理しています。コントローラーまたはハンドラーで、挨拶の値を含むリストをテンプレートに渡しました。テンプレート内では、{{item}}構文を使用して各アイテムにアクセスします。
ブロックの場合のテンプレート
さらに、ifステートメントの使用に注意してください。ここでは、朝のアイテムをテストし、太字で斜体にします。
それでは、Flaskフォームの概念についてさらに学びましょう。
フラスコフォーム
テンプレート作成の最も重要な側面の1つは、ユーザーから入力を受け取り、その入力に基づいてバックエンドロジックを作成することです。フォームを作成しましょう。
Flask-AppbuilderSimpleFormViewを使用してフォームをレンダリングします。ただし、最初にフォームを作成しましょう。フォームの作成に加えて、flask fabcreate-adminコマンドを使用して管理者ユーザーを作成する必要があります。
したがって、開発サーバーを起動する前にコマンドを使用して、後で作成されるビューとフォームをログインユーザーで検証できるようにします。 adminユーザーでログインし、スクリーンショットに示すように、作成されたビューがメニューの下に表示されていることを確認し続けます。
管理者を作成する
以下のコマンドを使用して、管理者ユーザーを作成します。
フラスコファブ作成-管理
管理者の資格情報でログインします
- http：// localhost：8080に移動したら、(ログイン)をクリックします。
- 前のセクションで作成した管理者の資格情報を使用してサインインします。
- (マイフォーム)カテゴリをクリックして、ビューにアクセスします。
注意： ナビゲーションバーに表示されるデフォルトメニューにビューを追加した後でのみ、最後の手順を実行できます。
先に進んで、フォームベースのビューをいくつか作成しましょう。
appディレクトリの下にforms.pyというファイルを作成し、その中に次のコードを記述します。
from wtforms import Form, StringField from wtforms.validators import DataRequired from flask_appbuilder.fieldwidgets import BS3TextFieldWidget from flask_appbuilder.forms import DynamicForm class GreetingsForm(DynamicForm): greeting1 = StringField(('Morning'), description = ('Your morning Greeting'), validators = (DataRequired()), widget = BS3TextFieldWidget()) greeting2 = StringField(('Afternoon'), description = ('Your Afternoon Greeting'), validators = (DataRequired()), widget = BS3TextFieldWidget()) greeting3 = StringField(('Evening'), description = ('Your Evening Greeting'), widget = BS3TextFieldWidget()) greeting4 = StringField(('Night'), description = ('Your Night Greeting'), widget = BS3TextFieldWidget())Flask-AppbuilderのDynamicFormに基づいてフォームを作成しました。 4つのテキストフィールドがあります。挨拶の例を拡張します。 4つのフィールドのうち、2つは必須で、2つはオプションです。これは、最初の2つのグリーティングについて、バリデーターの値について説明したためです。
次に、このフォームのビューを作成しましょう。次のコード行をファイルviews.pyに書き込みます。
from flask import render_template, flash from flask_appbuilder import SimpleFormView from app.forms import GreetingsForm class GreetingsView(SimpleFormView): form = GreetingsForm form_title = 'This is a Greetings form' message = 'Your Greetings are submitted' def form_get(self, form): form.greeting1.data = 'Your Morning Greeting' form.greeting2.data = 'Your Afternoon Greeting' form.greeting3.data = 'Your Evening Greeting' form.greeting4.data = 'Your Night Greeting' def form_post(self, form): flash(self.message, 'info') greetings = ( form.greeting1.data, form.greeting2.data, form.greeting3.data, form.greeting4.data, ) session('greetings')=greetings return redirect(url_for('HelloWorld.hello_greetings2'))上記のビューでは、フォームのフィールドにデフォルト値を入力し、フォームがブラウザから送信されたときに入力された値を読み取るために、form_getとform_postという2つのメソッドがあります。
以下の画像に示すように、GreetingsViewはフォームを表示します。
また、Flaskセッションオブジェクトを使用してフィールド値をform_postに格納し、これから作成する対応する新しいビューで同じものにアクセスできるようにします。
次に、HelloWorldクラスを変更し、挨拶を表示する別のメソッドを追加しましょう。これをhello_greetings2と呼びます。
class HelloWorld(BaseView): ## other methods @expose('/greetings2') def hello_greetings2(self): greetings = session('greetings') return render_template('hello.html', greetings=greetings)このビューでは、セッションオブジェクトから値を読み取り、Flaskレンダリングテンプレートを使用して、それらの値をユーザー向けのHTMLで表示します。 hello_greetings2は、hello_greetingsと同様の機能を実現するための代替方法であることに注意してください。
唯一の違いは、hello_greetings2を使用して、ユーザーが入力した値を表示していることです。hello_greetingsでは、ユーザーからの入力を受け取らず、それぞれのルートにマップされたビューを書き込むときにそれらをハードコーディングしました。
フラスコ応答
コードでFlask応答が明示的に使用されていることはほとんどありません。 FlaskのResponseクラスは、WerkzuegのResponseクラスのResponseクラスの単なるサブクラスであり、WerkzuegのResponseクラスはそのResponseBaseクラスをサブクラス化します。
Flask Responseオブジェクトは、returnステートメントまたはrender_templateなどのメソッドを呼び出すたびにFlaskによって内部的に形成されます。
さらに、以下の変更されたHelloWorldビューに示すように、ビューのreturnステートメントの一部として必要に応じて、応答コードとコンテンツタイプをカスタマイズできます。
class HelloWorld(BaseView): ## other methods @expose('/greetings2') def hello_greetings2(self): greetings = session('greetings') return render_template('hello.json', greetings=greetings), 201, {'Content-Type' : 'application/json'ファイルサイズとネットワーク帯域幅の制約により、コンテンツ全体を一度に返すのではなく、コンテンツをストリーミングする場合のユースケースでは、FlaskのResponseクラスを直接使用できます。
大きなCSVからコンテンツをストリーミングする一例を以下に示します。
from flask import Response @app.route('https://cdn.softwaretestinghelp.com/largefile.csv') def send_large_csv(): '''A controller to stream the content of a large csv file''' def gen(): for row in iter_all_rows(): yield ','.join(row) + '
' return Response(gen(), mimetype='text/csv')フラスコリダイレクト
アプリケーションが、クライアントからのさまざまな要求に基づいて応答を事前に定義できるとは限りません。
リクエストに応じて他のビューまたは場所で実行できるコンテンツを提供できるシナリオでは、Flaskリダイレクトを使用します。標準のHTTPリターンコードとともに中止とともにFlaskリダイレクトを使用します。
例えば、 以下のコードでは、HTTPコード301でリダイレクトを使用し、401で中止しました。
from flask import Flask, redirect, url_for, request, abort app = Flask(__name__) @app.route('/') def index(): return render_template('log_in.html') # Log In template @app.route('/login',methods = ('POST', 'GET')) def login(): if request.method == 'POST': if request.form('username') == 'admin' : # if user is admin return redirect(url_for('success')), 301 else: abort(401) # stop processing else: return redirect(url_for('index')) # redirect to another viewさらに、Flaskリダイレクトとurl_forを使用したGreetingsViewをチェックインして、挨拶の値をセッションオブジェクトに格納することにより、リクエストを内部的に別のビューにリダイレクトします。 Flaskリダイレクトは、デフォルトまたは指定されたステータスコードを含む応答オブジェクトをアプリケーション内の別の場所に常に返します。
FlaskDebugtoolbar
前回のチュートリアルでは、Flaskのインタラクティブデバッガーをすでに紹介しました。このチュートリアルでは、Flaskアプリケーションのデバッグを簡単にするためにもう1つのステップを実行します。インストールすると、FlaskデバッグツールバーがFlaskアプリケーションのオーバーレイとして表示されます。
FlaskDebugツールバーをインストールします。
pip install flask-debugtoolbardebugtoolbarをアクティブ化するには、プロジェクトで__init__。pyファイルを開き、次のコード行を追加してコードを変更します。
from flask_debugtoolbar import DebugToolbarExtension app.debug = True toolbar = DebugToolbarExtension(app)Flaskデバッグツールバーはデバッグモードでのみ有効になることに注意してください。有効にした後、アプリケーションをリロードすると、2つのことがわかります。
＃1） デバッグツールバーがブラウザの右側に表示されます。クリックして展開すると、ツールバーが提供するさまざまな機能が表示されます。
＃二） 新しいPOSTリクエストがアプリケーションに送信されるたびに、ツールバーによってインターセプトされるため、アプリケーションのデバッグに関連する変数やその他のパラメーターを検査できます。
このデフォルトのインターセプトは、以下の構成で無効にできます。
app.config('DEBUG_TB_INTERCEPT_REDIRECTS') = False 
次に、サンプルアプリケーションで導入した追加機能について、ビューをテストするためのいくつかのテストを作成しましょう。
日食で新しいプロジェクトを開く方法
テストを続行する前に、以下の__init__。pyに示すようにデバッグを無効にしてください。または、以下の行をコメントアウトすることもできます。
app.debug = FalseFlaskアプリケーションビューのテスト
テストコードを整理して、管理しやすくする必要があります。ルートディレクトリにconftest.pyというファイルを作成し、以下の行をtest_hello.pyからこのファイルに移動します。
from app import appbuilder import pytest @pytest.fixture def client(): ''' A pytest fixture for test client ''' appbuilder.app.config('TESTING') = True with appbuilder.app.test_client() as client: yield clientpytestフィクスチャは、実行時にpytestによってロードされます。これらのフィクスチャは利用可能であり、すべてのテストで共有されます。 pytestは、明示的なPYTHONPATHを指定しなくてもプロジェクト内のすべてのモジュールを認識できるため、プロジェクトのルートパスでconftest.pyを定義することはベストプラクティスと見なされます。
test_helloファイルにもう1つのテストを追加します。テストの例を以下に示します。クライアントオブジェクトのgetメソッドを呼び出し、resp.dataに格納されている応答データで期待値をアサートします。
同様に、さまざまなビューを指すテストをさらに作成できます。以降のチュートリアルでは、さらにテストを作成します。
def test_greetings(client): ''' A test method to test view hello_greetings''' resp = client.get('/hello/greetings', follow_redirects=True) assert b'Good Morning' in resp.dataプロジェクトのルートディレクトリから以下のコマンドを使用してテストを実行します。
pytest -v以下に示すように、テストを実行すると、コンソールにテスト結果が生成されます。
まだ失敗はありません。以下に説明するように、もう1つのテストを設計しましょう。
def test_greetings2(client): ''' A test method to test view hello_greetings2 ''' resp = client.get('/hello/greetings2', follow_redirects=True) assert b'Good Morning' in resp.dataviews.pyファイルのHelloWorldクラスにメッセージ属性を定義しなかったため、このテストは失敗します。
pytest -vを使用してテストを実行すると、以下に示す画像のような結果がコンソールに表示されます。
以下のセクションでは、CI / CDプラットフォームでテストを実行するときに実行する必要のある手順について説明します。同じプロジェクトでGitアクションを使用します。
Gitアクションを備えたCI / CD
ここで、すべての変更をファイルに保存し、このチュートリアルのメッセージを表示してコミットを作成します。ローカルリポジトリでコミットした後、–rebaseフラグを使用してリモートオリジンから変更をプルし、リモートでの新しい変更との競合がないかどうかを確認します。履歴の一貫性を保つためにリベースします。
以下のコマンドを使用して、リモートオリジンから変更をプルしてマージします。ただし、リモートから変更をプルする前に、変更をコミットしてください。
git pull origin master --rebase次に、ローカルマスターブランチをチェックアウトし、tutorial-2ブランチとマージします。マージが成功したら、それらの変更をオリジンのマスターに公開します。このアクションにより、ターゲットプラットフォームでビルドが呼び出されます。このコードは、Ubuntu最新のPython3.7およびPython3.8でテストしています。
結論
このチュートリアルでは、Flaskフレームワークでテンプレートがどのように機能するかを確認しました。変数と式を使用して、ユーザー定義の値を使用してフラスコテンプレートを作成およびレンダリングする手順の概要を説明しました。
また、FlaskAppbuilderプラグインの事前定義されたビューBaseViewの例も確認しました。このビューは、Flask開発者が簡単にサブクラス化して、カスタムビューを作成できます。
これまでに説明した概念は、読者がデータベースバックエンドなしでFlaskを使用して静的および動的なWebサイトをすばやく作成するのに役立ちます。次のチュートリアルでは、Flaskでデータベースを使用するという概念を説明するときに、ModelViewを使用してデータベースとの間でデータを読み書きする方法について説明します。