Implementación de un modelo TensorFlow 2.1 CNN en la web con Flask

Al comenzar a aprender Machine Learning, uno de los mayores problemas que enfrentan las personas es implementar lo que hacen en la web para una demostración/uso más fácil. Este artículo ayudará a los principiantes a cerrar la brecha entre la creación de un modelo de TensorFlow y su implementación en la web con Flask y, con suerte, obtendrán información sobre los problemas que tienen TensorFlow y Flask.

Creando un modelo
Primero tendremos que entrenar nuestro modelo usando TensorFlow y ImageDataGenerator de Keras. Para ello, hemos descargado 12500 imágenes de gatos y 12500 imágenes de perros respectivamente. Para entrenar un modelo usando ImageDataGenerator, primero instale kerasy tensorflow,

pip install keras
pip install tensorflow

Hemos entrenado un modelo utilizando el aprendizaje de transferencia del InceptionV3modelo. Para ver un tutorial sobre el aprendizaje por transferencia, visite este enlace. Después de que el modelo haya sido entrenado, necesitaremos ejecutar el siguiente comando que crea una carpeta de modelo del modelo entrenado. (Antes de TensorFlow 2.0, se creaba un archivo de modelo en lugar de una carpeta de modelo).

model.save('Name_of_model')

Creando la aplicación Flask
Luego, tendremos que instalar Flask. Flask es un micro-framework en Python que se usa ampliamente para implementar modelos ML en la web, tendremos que instalar Flask usando el siguiente comando.

pip install flask

Llegando a la página web que queremos construir. Cree una página HTML según sus preferencias, hemos creado una página web básica con un botón para cargar una imagen y un botón para predecir cuál es la imagen. Este código envía la imagen como una solicitud de publicación y la almacena en la carpeta «cargado/imagen/» donde se hace una predicción desde aquí. Cortesía de Shubham S. Naik de Stack Overflow. El código se divide en 2 archivos, a saber, un archivo .js y un archivo .html. Copie el siguiente código en un archivo llamado upload.htmly guárdelo en una carpeta llamada templates.

<!DOCTYPE html>
  
<html>
  
<head>
    <link class="jsbin" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css"
        rel="stylesheet" type="text/css" />
    <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"></script>
    <meta charset=utf-8 />
  
    <script src="{{ url_for('static', filename='upload.js') }}"></script>
  
    <style>
        article,
        aside,
        figure,
        footer,
        header,
        hgroup,
        menu,
        nav,
        section {
            display: block;
        }
    </style>
</head>
  
<body>
    <form action="http://127.0.0.1:5000/uploader" method="POST" enctype="multipart/form-data">
        <input type='file' name='file' onchange="readURL(this);" />
        <img id="blah" src="#" alt="your image" />
        <button type="submit">Submit & predict</button>
  
    </form>
</body>
  
</html>

Copie el siguiente código en un archivo llamado upload.jsy guárdelo en una carpeta llamada estática.

function readURL(input) {
if (input.files && input.files[0]) {
    var reader = new FileReader();
  
    reader.onload = function (e) {
        $('#blah')
            .attr('src', e.target.result)
            .width(150)
            .height(200);
    };
  
    reader.readAsDataURL(input.files[0]);
}
}

Una vez hecho esto, necesitaremos ImageDataGeneratorhacer una predicción de una imagen una vez que haya sido entrenada. Primero cargaremos el modelo usando

model = tf.keras.models.load_model('Name_of_model')

Luego, necesitaremos importar ImageDataGenerator. Ahora, llegando al matraz, el código del matraz. Copie el siguiente código en un Code.pyarchivo y colóquelo en el directorio raíz. El código completo de Python es el siguiente: –

from flask import Flask, render_template, request
from werkzeug import secure_filename
from keras.preprocessing.image import ImageDataGenerator
import tensorflow as tf
import numpy as np
import os 
  
try:
    import shutil
    shutil.rmtree('uploaded / image')
    % cd uploaded % mkdir image % cd ..
    print()
except:
    pass
  
model = tf.keras.models.load_model('model')
app = Flask(__name__)
  
app.config['UPLOAD_FOLDER'] = 'uploaded / image'
  
@app.route('/')
def upload_f():
    return render_template('upload.html')
  
def finds():
    test_datagen = ImageDataGenerator(rescale = 1./255)
    vals = ['Cat', 'Dog'] # change this according to what you've trained your model to do
    test_dir = 'uploaded'
    test_generator = test_datagen.flow_from_directory(
            test_dir,
            target_size =(224, 224),
            color_mode ="rgb",
            shuffle = False,
            class_mode ='categorical',
            batch_size = 1)
  
    pred = model.predict_generator(test_generator)
    print(pred)
    return str(vals[np.argmax(pred)])
  
@app.route('/uploader', methods = ['GET', 'POST'])
def upload_file():
    if request.method == 'POST':
        f = request.files['file']
        f.save(os.path.join(app.config['UPLOAD_FOLDER'], secure_filename(f.filename)))
        val = finds()
        return render_template('pred.html', ss = val)
  
if __name__ == '__main__':
    app.run()

Finalmente, necesitamos renderizar una página html para la predicción final. Copie el siguiente código y guárdelo como pred.htmlen la carpeta de plantillas.

<!DOCTYPE html>
  
<html>
<body>
<h1>{{ ss }}</h1>
</body>
</html>

La estructura de carpetas final se describe a continuación: –
Las banderas de color negro son carpetas y las banderas azules son archivos.

directory structure

Salida
Finalmente, todo lo que tenemos que hacer es ejecutar el archivo code.py e ir a http://127.0.0.1:5000/ para ver la salida

Output

Output

Output

Output

Nota: cada vez que se realiza una predicción, elimine las imágenes cargadas/imagen antes de cargar una nueva o podría recibir un error interno del servidor.

Publicación traducida automáticamente

Artículo escrito por jeffreypaul2000 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *