■ はじめに
Flask(フラスク)を使って、簡易的なRest APIを作成する。
【1】環境構築
前提条件
* 実行環境を以下の関連記事を参考に構築する
インストール
# 以下をコマンドして、インストールする python -m pip install --upgrade pip pip install flask-restful
【2】サンプル
restapi-flask.py
#!/usr/bin/env python # -*- coding: UTF-8 -*- import sys import json from flask import Flask, render_template, request from flask_restful import Resource, Api, reqparse app = Flask(__name__, template_folder='.') api = Api(app) @app.route('/') def home(): return render_template('demo-json.html') @app.route('/result', methods=['GET', 'POST']) def result(): json_data = request.get_json(force=True) id = json_data['id'] name = json_data['name'] return json.dumps({'status':'OK', 'result-id':id, 'result-name':name}); if __name__ == "__main__": app.run(debug=True, host="localhost", port=8000)
demo-json.html
<!DOCTYPE html> <html lang="jp"> <head> <meta charset="utf-8"> <title>Demo</title> </head> <body> ID: <input type="text" size="30" name="id" id="inputId"> Name: <input type="text" size="30" name="name" id="inputName"> <button id="button-json">Click Me</button> </form> <div id="result">[[Result]]</div> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script type="text/javascript"> $('#button-json').on('click',function(){ console.log("[Enter]"); var idValue = $('#inputId').val(); var nameValue = $('#inputName').val(); console.log("idValue = " + idValue); console.log("nameValue = " + nameValue); var inputData = { 'id': idValue, 'name': nameValue }; $.ajax({ url: 'http://localhost:8000/result', type: 'POST', dataType: 'json', data: JSON.stringify(inputData) }) // Ajaxリクエストが成功した時発動 .done( (data) => { $('#result').append(JSON.stringify(data)); console.log(JSON.stringify(data)); }) // Ajaxリクエストが失敗した時発動 .fail( (data) => { $('#result').append(JSON.stringify(data)); console.log(JSON.stringify(data)); }); }); </script> </body> </html>
【3】実行コマンド
python restapi-flask.py
動作確認
* 以下のサイトをブラウザでアクセスする => ID, Nameに値(例「ID001」「Mike」)を入力し、ボタン押下。 => 「[[Result]]」に「{"status":"OK","result-id":"ID001","result-name":"Mike"}」と表示されたらOK
参考文献
https://stackoverflow.com/questions/30491841/python-flask-restful-post-not-taking-json-arguments
関連記事
Python で 簡単なWebアプリ ~ formデータを受け取る ~
https://dk521123.hatenablog.com/entry/2018/09/10/164500
Flask ~ 入門編 ~
https://dk521123.hatenablog.com/entry/2018/09/11/021900