Python: Introduction à Flask: création d'une application d'identification de numéro à l'aide de MNIST

Qu'est-ce que Flask

Flask est un framework d'application Web léger pour Python.

Qu'est-ce qu'un cadre? Il rassemble les fonctions requises lors du développement de logiciels d'application. Un package qui vous permet de créer facilement un framework / modèle.

Rails pour la langue Ruby Pour Python, Django et Flask sont le courant dominant.

Vous pouvez développer des applications Web facilement et légères en les intégrant dans un modèle appelé Flask.

Nous allons créer une application d'identification de caractères manuscrits à l'aide de MNIST. Traitez avec le serveur à l'aide de Flask et créez l'apparence de l'application avec HTML et CSS.

Exécutez la plus petite application Flask

Pour découvrir ce que Flask peut faire, exécutons d'abord la plus petite application Web Flask.

hello.py



from flask import Flask
app = Flask(__name__)

@app.route('/')
def hello_world():
    return "Hello World!"

if __name__ == "__main__":
    app.run()

Puisqu'il ne peut pas être exécuté sur Fastpyter, ce qui suit est le travail dans l'environnement local.

  1. Créez hello.py dans votre éditeur et copiez et collez le code ci-dessus

  2. Tapez python hello.py dans le terminal et exécutez

  3. Accédez à http://127.0.0.1:5000/

Après confirmation, appuyez sur Ctrl + C pour terminer le processus.

Description du code

Examinons de plus près ce code.

Tout d'abord, déclarez que vous souhaitez utiliser la classe Flask du package flask.

from flask import Flask

Ensuite, créez une instance de la classe Flask appelée app.

app.<Nom de la méthode de classe Flask>

Vous permet d'utiliser les méthodes de la classe Flask

app = Flask(__name__)

Je reçois un @ inconnu ici Les lignes commençant par @ sont appelées décorateurs Faites quelque chose avec la fonction ou la classe définie dans la ligne suivante.

app.route () a spécifié la fonction définie dans la ligne suivante Nous sommes en train de nous associer à l'URL. Dans l'argument de app.route () Spécifiez l'URL après [http://127.0.0.1:5000/].

Autrement dit, dans le code ci-dessous, lors de l'accès à http://127.0.0.1:5000/ Cela signifie que la fonction hello_world () sera appelée et affichera Hello World!.

@app.route('/')#http://127.0.0.1:5000/Spécifiez le chemin suivant
def hello_world():
    return "Hello World!"

name == '__ main__' est vrai Autrement dit, uniquement lorsque ce code est exécuté directement app.run () est exécuté et l'application Flask est lancée.

if __name__ == "__main__":
    app.run()

Quel est le nom__

Par la description de if name == '__ main__': plus tôt Lorsque vous exécutez le script Python directement Uniquement (comme lors de l'exécution de python filename.py sur la ligne de commande)

if name == '__ main__': Vous pouvez exécuter le traitement suivant. Et s'il est importé d'un autre fichier, il ne sera pas traité. Cette description est, par exemple, lorsque vous créez et testez votre propre module Il est utilisé lorsque vous souhaitez éviter un traitement inutile.

Regardons de plus près ce mécanisme ici. À propos, name est une variable qui est automatiquement définie pour chaque fichier de script. Le nom du fichier (nom du module) est automatiquement stocké.

Cependant, lorsque vous exécutez le fichier directement, main est automatiquement stocké dans name. Vérifions avec l'exemple suivant.

Exemple) Ce qui est généré lorsque le test1.py suivant est exécuté

test1.py



#Spectacle de fonction()Est défini
def show():
    return __name__

print(__name__)
#Résultat de sortie
__main__

Parce que test1.py s'exécute directement main est automatiquement stocké dans name, donc main est affiché.

Lorsque le script Python est exécuté directement comme ceci Parce que main est stocké dans une variable appelée name

name == '__ main__ devient True if name == '__ main__': Le traitement suivant est exécuté.

Création d'une application de reconnaissance numérique à l'aide de MNIST

Production côté HTML et CSS

En passant, j'ai créé une application très simple qui affiche simplement Hello World!. Cette fois, nous refléterons HTML et CSS pour en faire une application Web.

Le contenu est expliqué dans Introduction à HTML et CSS.

mnist.py



from flask import Flask, render_template
app = Flask(__name__)

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

if __name__ == "__main__":
    app.run()

Vous travaillerez dans un environnement local.

1, créez un dossier avec un nom approprié (par exemple, mnist_app) sur le bureau, etc.

2, créez mnist.py dans le dossier mnist_app et copiez et collez le code ci-dessus

3, créez un dossier de modèles dans le dossier mnist_app et créez-y index.html Copiez et collez le code de Explication du modèle HTML 1/5 dans index.html

4, créez un dossier statique dans le dossier mnist_app Créez-y la feuille de style.css (Flask est censé rechercher le fichier html dans le dossier templates et le fichier css dans le dossier static) Copiez et collez le code de Explication du modèle CSS 1/5 dans stylesheet.css

5, cd mnist_app / pour aller dans le dossier mnist_app

6, tapez python mnist.py dans le terminal et exécutez

7, accès http://127.0.0.1:5000/

Après confirmation, appuyez sur Ctrl + C pour terminer le processus.

Description du code

Examinons de plus près le code. Qu'est-ce qui est différent du code qui vous permet d'exécuter la plus petite application Flask

return render_template('index.html')seulement.

-En passant un fichier au format html comme argument à render_template () Vous pouvez refléter html sur la page de l'URL associée. Le fichier html passé à cet argument doit se trouver dans le dossier temlpates.

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

Production côté flacon

Jusqu'à présent, nous avons conçu le côté page Web et créé un téléchargeur de fichiers. Cependant, vous ne pouvez pas télécharger le fichier sans ajouter le code du côté Flask.

Ici, nous recevons l'image téléchargée à partir de la page Web et l'identifions avec le modèle formé. Regardons le code qui affiche le résultat.

Avant d'exécuter le code avec ce fichier ipynb Veuillez préparer le modèle entraîné model.h5 dans le même répertoire.

mnist.py

import os
from flask import Flask, request, redirect, url_for, render_template, flash
from werkzeug.utils import secure_filename
from keras.models import Sequential, load_model
from keras.preprocessing import image
import tensorflow as tf
import numpy as np

classes = ["0","1","2","3","4","5","6","7","8","9"]
num_classes = len(classes)
image_size = 28

UPLOAD_FOLDER = "uploads"
ALLOWED_EXTENSIONS = set(['png', 'jpg', 'jpeg', 'gif'])

app = Flask(__name__)

def allowed_file(filename):
    return '.' in filename and filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS

model = load_model('./model.h5')#Charger le modèle entraîné

graph = tf.get_default_graph()

@app.route('/', methods=['GET', 'POST'])
def upload_file():
    global graph
    with graph.as_default():
        if request.method == 'POST':
            if 'file' not in request.files:
                flash('Pas de fichier')
                return redirect(request.url)
            file = request.files['file']
            if file.filename == '':
                flash('Pas de fichier')
                return redirect(request.url)
            if file and allowed_file(file.filename):
                filename = secure_filename(file.filename)
                file.save(os.path.join(UPLOAD_FOLDER, filename))
                filepath = os.path.join(UPLOAD_FOLDER, filename)

                #Lisez l'image reçue et convertissez-la au format np
                img = image.load_img(filepath, grayscale=True, target_size=(image_size,image_size))
                img = image.img_to_array(img)
                data = np.array([img])
                #Transmettre les données transformées au modèle pour la prédiction
                result = model.predict(data)[0]
                predicted = result.argmax()
                pred_answer = "c'est" + classes[predicted] + "est"

                return render_template("index.html",answer=pred_answer)

        return render_template("index.html",answer="")


if __name__ == "__main__":
    app.run()

Puisqu'il ne peut pas être exécuté sur Fastpyter, ce qui suit est le travail dans l'environnement local.

  1. Remplacez mnist.py par le code ci-dessus

  2. Créez un dossier de téléchargements dans la même hiérarchie que mnist.py

  3. Placez model.h5 qui a enregistré le modèle entraîné précédemment dans la même hiérarchie que mnist.py

  4. Gardez le placement du fichier comme précédemment, tapez python mnist.py dans le terminal et exécutez

  5. Accédez à http://127.0.0.1:5000/

Maintenant, téléchargeons une image numérique.

image.png

Après confirmation, appuyez sur Ctrl + C pour terminer le processus.

Description du code 1/3

Examinons maintenant ce code de plus près.

Tout d'abord, importez les bibliothèques et modules requis.

import os
from flask import Flask, request, redirect, url_for, render_template, flash
from werkzeug.utils import secure_filename
from keras.models import Sequential, load_model
from keras.preprocessing import image
import tensorflow as tf
import numpy as np

Ensuite, stockez les noms de classe que vous souhaitez classer dans la liste des classes. Cette fois, nous classerons les nombres, alors réglez-les sur 0-9. Transmettez la taille de l'image utilisée pour l'entraînement à imaze_size. Cette fois, j'ai utilisé le jeu de données MNIST, donc je l'ai mis à 28.

classes = ["0","1","2","3","4","5","6","7","8","9","10"]
num_classes = len(classes)
image_size = 28

Transmettez le nom du dossier pour enregistrer l'image téléchargée dans UPLOAD_FOLDER. Pour ALLOWED_EXTENSIONS, spécifiez les extensions qui autorisent l'importation.

UPLOAD_FOLDER = "uploads"
ALLOWED_EXTENSIONS = set(['png', 'jpg', 'jpeg'])

Créez une instance de la classe Flask.

app = Flask(__name__)

Définit une fonction qui vérifie l'extension des fichiers téléchargés. Renvoie True si les deux conditions avant et après et sont remplies.

La première condition "." Dans le nom du fichier est Indique si le caractère. Est présent dans le nom de fichier variable.

La deuxième condition filename.rsplit ('.', 1) [1] .lower () dans ALLOWED_EXTENSIONS Indique si la chaîne après. Dans la variable, le nom de fichier correspond à l'une des ALLOWED_EXTENSIONS.

rsplit () est fondamentalement le même que split (). Cependant, split () était séparé du début de la chaîne L'ordre du délimiteur pour rsplit est à partir de la fin de la chaîne.

lower () convertit la chaîne en lower.

def allowed_file(filename):
    return '.' in filename and filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS

Chargez le modèle entraîné. graph = tf.get_default_graph () est le code nécessaire pour le bogue Keras, alors ne vous inquiétez pas.

model = load_model('./model.h5')#Charger le modèle entraîné

graph = tf.get_default_graph()

Description du code 2/3

Ensuite, nous définirons la fonction à exécuter lors de l'accès à la première page.

GET et POST sont un type de méthode HTTP.

Je vais omettre l'explication détaillée GET récupère les ressources (saisissant un fichier html lors de l'accès à la page) POST signifie envoyer des données au serveur.

global graph、with graph.as_default():Aussi
Ne vous inquiétez pas, c'est nécessaire à cause d'un bogue Keras.

request est une fonction de traitement des données envoyées depuis un formulaire sur le web request.method contient la méthode de requête Il est également expliqué dans Introduction à HTML & CSS. Et lorsque request.method == 'POST', le code qui suit sera exécuté.

@app.route('/', methods=['GET', 'POST'])
def upload_file():
    global graph
    with graph.as_default():
        if request.method == 'POST':

Ici, la requête POST contient-elle des données de fichier? Il vérifie également si le fichier a un nom de fichier.

redirect () est une fonction qui redirige vers l'url donnée dans l'argument request.url contient l'URL de la page sur laquelle la demande a été effectuée.

Autrement dit, s'il n'y a pas de fichier téléchargé ou pas de nom de fichier, il reviendra à la page d'origine.

if 'file' not in request.files:
    flash('Pas de fichier')
    return redirect(request.url)
file = request.files['file']
if file.filename == '':
    flash('Pas de fichier')
    return redirect(request.url)

Vérifiez ensuite l'extension du fichier téléchargé.

Après cela, secure_filename () invalide (nettoie) toute chaîne de caractères dangereux dans le nom de fichier.

Ensuite, joignez les chemins donnés en arguments avec os.path.join () selon os. (Combiné avec \ sur Windows, combiné avec / sur Mac et Linax) Enregistrez l'image téléchargée sur ce chemin. En outre, la destination d'enregistrement est stockée dans le chemin du fichier.

if file and allowed_file(file.filename):
    filename = secure_filename(file.filename)
    file.save(os.path.join(UPLOAD_FOLDER, filename))
    filepath = os.path.join(UPLOAD_FOLDER, filename)

Description du code 3/3

Enfin, nous déterminerons le numéro de l'image téléchargée. Ici, nous utilisons une fonction appelée image.load_img de Keras qui peut charger et redimensionner des images en même temps.

Dans l'argument, spécifiez l'URL de l'image que vous souhaitez charger et la taille que vous souhaitez redimensionner.

Autres niveaux de gris=En passant True

Il peut être lu en monochrome. image.img_to_array convertit l'image donnée dans l'argument en un tableau Numpy.

Vous devez également transmettre une liste de tableaux Numpy à model.predict (). Par conséquent, img est passé sous forme de liste à np.array (). Et le résultat de la prédiction est stocké dans pred_answer.

 #Lisez l'image reçue et convertissez-la au format np
img = image.load_img(filepath, grayscale=True, target_size=(image_size,image_size))
img = image.img_to_array(img)
data = np.array([img])
#Transmettre les données transformées au modèle pour la prédiction
result = model.predict(data)[0]
predicted = result.argmax()
pred_answer = "c'est" + classes[predicted] + "est"

En passant answer = pred_answer à l'argument de ender_template Vous pouvez attribuer pred_answer à la réponse écrite dans index.html.

return render_template("index.html",answer=pred_answer)

Lorsqu'aucune requête POST n'est effectuée (accès simplement à l'URL) Rien n'est affiché dans la réponse de index.html.

return render_template("index.html",answer="")

Enfin, app.run () est exécuté et le serveur est démarré.

if __name__ == "__main__":
    app.run()

Déployer

Paramètres de publication

Jusqu'à récemment, j'exécutais l'application Web uniquement sur mon propre ordinateur. Ici, vous apprendrez à déployer une application Web sur Heroku et à la publier dans le monde entier.

Pour rendre le serveur disponible en externe lors du déploiement d'applications Web

host='0.0.0.0'Spécifier.
port = int(os.environ.get('PORT', 8080))Puis

Le numéro de port qui peut être utilisé dans Heroku est acquis et stocké par courrier.

S'il n'est pas défini, 8080 sera stocké.

À la fin de mnist.py

if __name__ == "__main__":
    app.run()

Partie de

if __name__ == "__main__":
    port = int(os.environ.get('PORT', 8080))
    app.run(host ='0.0.0.0',port = port)

Veuillez réécrire le code ci-dessus.

Configurer et déployer Heroku

Configurez Heroku.

Avant d'exécuter le code Situé dans le répertoire mnist_app, qui se trouve dans le même répertoire que ce fichier ipynb Veuillez préparer Procfile, requirements.txt, runtime.txt

Tout d'abord, inscrivez-vous en tant que membre de Heroku et connectez-vous. Ensuite, installez Heroku.

Veuillez installer à partir du site Heroku CLI. Git sera installé en même temps que vous installez Heroku CLI.

Voici comment déployer sur Heroku.

1, déplacez-vous vers le répertoire contenant les fichiers de l'application (cd __)

  1. Entrez votre adresse e-mail et votre mot de passe comme indiqué par la connexion heroku

3, déménage à Heroku, Entrez Create New App-> App name Accédez à la page de l'application qui enregistre le pays aux États-Unis et passez à Setteings Cliquez sur Ajouter un pack de construction pour ajouter Python

Déplacez les trois fichiers ci-dessous vers le répertoire où se trouve l'application (Il se trouve dans le répertoire mnist_app, qui se trouve dans le même répertoire que ce fichier ipynb.)

Procfile, requirements.txt, runtime.txt

Lors de la vérification de l'opération sur Heroku, veillez à utiliser le fichier mnist.py Nommez-le main.py.

Puisque le Procfile spécifie de démarrer un fichier appelé main.py Utilisez main.py cette fois.

Vous pouvez démarrer un fichier avec n'importe quel nom en réécrivant Procfile.
Aussi, les exigences.txt
Dans la propre application de Heroku en écrivant les bibliothèques nécessaires pour
La bibliothèque sera installée.
runtime.Décrivez la version de Python à utiliser dans txt.

Dans le répertoire (dossier), main.py, Procfile, requirements.txt, runtime.txt Assurez-vous que vous disposez du modèle entraîné, du dossier des modèles, du dossier des statiques, du dossier des téléchargements,

~ Dans la hiérarchie avec le fichier d'application du terminal (invite de commande) ~

git init(C'est la première fois seulement)
heroku git:remote -a (nom de l'application)
git add .
git commit -m “(Écrivez un message sur ce qui a changé)”
git push heroku master
Veuillez déployer en tant que.

image.png

L'application déployée aura l'URL https: // app name.herokuapp.com/. Vous pouvez également saisir la commande heroku open pour accéder à l'URL sur laquelle s'exécute l'application Web. Si vous pouvez confirmer l'opération, le déploiement est réussi.

Recommended Posts

Python: Introduction à Flask: création d'une application d'identification de numéro à l'aide de MNIST
Étapes de l'installation de Python 3 à la création d'une application Django
Créer une application Web avec Flask ②
Créer une application Web avec Flask ①
Créer un modèle d'apprentissage à l'aide de MNIST
Créer une application Web avec Flask ③
Créer une application Web avec Flask ④
Super Introduction Arithmétique Bit Python
Lancer une application Flask dans Python Anywhere
Introduction à la simulation d'événements discrets à l'aide de Python # 2
Je souhaite créer une application Web en utilisant React et Python flask
[Python] Fractionner un gros fichier Flask en utilisant Blueprint
[Introduction à Python3, Jour 23] Chapitre 12 Devenir un Paisonista (12.1 à 12.6)
Créez une application Web qui convertit le PDF en texte à l'aide de Flask et PyPDF2
[Introduction à l'application Udemy Python3 +] 66. Création de votre propre exception
Essayez de créer un fichier compressé en utilisant Python et zlib
(Python) Essayez de développer une application Web en utilisant Django
Introduction au langage Python
[Introduction à python] Introduction rapide à Python pour les programmeurs C ++ occupés
Introduction à OpenCV (python) - (2)
Comment créer un package Python à l'aide de VS Code
[Python] J'ai essayé d'exécuter un serveur local en utilisant flask
Introduction à l'algèbre linéaire avec Python: Décomposition A = LU
Écrire du code dans UnitTest une application Web Python
[Introduction à Python] Comment arrêter la boucle en utilisant break?
Comment exécuter une commande à l'aide d'un sous-processus en Python
Identification de nom à l'aide de python
Comment héberger le traitement du backend d'application Web en Python à l'aide d'un sous-domaine de serveur de location
[Introduction à Python] Comment écrire des instructions répétitives à l'aide d'instructions for
[Livre technique] Introduction à l'analyse de données avec Python -1 Chapitre Introduction-
Comment déployer une application Web créée avec Flask sur Heroku
[Introduction à Python] Comment écrire des branches conditionnelles en utilisant des instructions if
Exemple pour mettre l'application Web Python Flask sur Azure App Service (Web App)
Comment lancer AWS Batch à partir de l'application cliente Python
J'ai créé une application de livre simple avec python + Flask ~ Introduction ~
Comment transloquer un tableau à deux dimensions en utilisant uniquement python [Note]
Une note lors de la création d'un graphe dirigé à l'aide de Graphviz en Python
Pour renvoyer char * dans une fonction de rappel à l'aide de ctypes en Python
J'ai fait un chronomètre en utilisant tkinter avec python
[Python] Introduction à la création de graphiques à l'aide de données de virus corona [Pour les débutants]
Une route vers Python intermédiaire
Une super introduction à Linux
Publier sur Twitter en utilisant Python
Commencez à Selenium en utilisant python
Introduction à la communication série [Python]
[Introduction à Python] <liste> [modifier le 22/02/2020]
Introduction à Python (version Python APG4b)
Une introduction à la programmation Python
Introduction à discord.py (3) Utilisation de la voix
Introduction à Python pour, pendant
Création d'un modèle séquentiel Tensorflow avec une image originale ajoutée à MNIST
[Introduction à Python] Comment fractionner une chaîne de caractères avec la fonction split
J'ai essayé de créer une expression régulière de "montant" en utilisant Python
[Introduction à Python] Comment générer une chaîne de caractères dans une instruction Print
Traitez le résultat de l'exécution de Splunk en utilisant Python et enregistrez-le dans un fichier
J'ai essayé de créer une expression régulière de "temps" en utilisant Python
J'ai essayé de créer une expression régulière de "date" en utilisant Python