Intégrez Shelty Judgment AI dans votre application Web

introduction

https://qiita.com/maitake9116/items/df733df5e608f8616d14 Intégrons l'IA Shelty Judgment créée à l'étape dans Flask.

Constitution

Il a été réalisé sur ubuntu construit avec Vagrant. L'IP est 192.168.33.31.

~/python/api
├─app.py
├─ai.py
├─model                        :Modèle préfabriqué
│  ├─model_predict.json
│  └─model_predict.hdf5
├─static
│  ├─favicon.ico               :Fabicon (facultatif)
│  └─style.css                 :Feuille de style
├─templates                    :Modèle d'écran
│  └─index.html
├─images                       :Répertoire pour stocker les images téléchargées
└─uwsgi.ini                    :Fichier de configuration uWSGI

image

00.png

Préparer la destination de déploiement de l'application

$ mkdir -p ~/python/api
$ cd ~/python/api
$ python3 -m venv api
$ source api/bin/activate
#Installez les bibliothèques nécessaires pour exécuter ai
$ pip install werkzeug
$ pip install numpy==1.16.2
$ pip install sklearn
$ pip install tensorflow
$ pip install keras
$ pip install matplotlib
$ pip install pillow

écran

Lorsque le fichier est téléchargé, l'image téléchargée et le résultat du jugement s'affichent. J'ai chargé bootstrap et je l'ai décoré un peu.

{% extends "layout.html" %}
{% block content %}

<div class="container">

  <div class="m-5">
    <H1>Jugement Shelty AI</H1>
  </div>

  <div class="m-5">
    <p>Déterminez s'il s'agit d'un sheltie. Veuillez télécharger l'image.</p>

      <form action="/upload" method="post" enctype="multipart/form-data">
        <input type="file" id=image name="image" accept="image/png, image/jpeg">
        <button class="button" type="submit">submit</button>
      </form>
  </div>

  {% if img_url %}
  <div class="m-5 box">
    <h3>image</h3>
    <img src="{{ img_url }}">
    <h3>résultat du jugement</h3>
    <p>{{ judgment }}</p>
  </div>
  {% endif %}

</div>

{% endblock %}
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
    <link rel=stylesheet type=text/css href="{{ url_for('static', filename='style.css') }}">
    <link rel="shortcut icon" href="{{ url_for('.static',filename='favicon.ico') }}" />
    <title>Jugement Shelty AI</title>
  </head>
  <body>
    {% block content %}{% endblock %}
  </body>
</html>
h1 {
    background: #dfefff;
    box-shadow: 0px 0px 0px 5px #dfefff;
    border: dashed 1px #96c2fe;
    padding: 0.2em 0.5em;
    color: #454545;
}

.box {
    padding: 0.5em 1em;
    margin: 2em 0;
    border: double 5px #4ec4d3;
}

programme

Lorsque l'image est téléchargée par app.py, enregistrez l'image et transmettez le chemin du fichier à ai.py pour obtenir le résultat du jugement.

# -*- coding: utf-8 -*-

from flask import Flask, render_template, request, redirect, url_for, send_from_directory
from werkzeug.utils import secure_filename
import numpy as np
import os
import ai

app = Flask(__name__)

SAVE_DIR = "./images"

app = Flask(__name__, static_url_path="")

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

@app.route('/images/<path:path>')
def send_js(path):
    return send_from_directory(SAVE_DIR, path)

@app.route('/upload', methods=['POST'])
def upload():
    img_file = request.files['image']
    if img_file:
        file_name = secure_filename(img_file.filename)
        file_path = os.path.join(SAVE_DIR, file_name)
        img_file.save(file_path)
        judgment = ai.predict(file_path)
        return render_template('index.html', img_url=file_path, judgment=judgment)
# -*- coding: utf-8 -*-

from keras import models
from keras.models import model_from_json
from keras.preprocessing import image
import numpy as np
import sys
import os
from keras.preprocessing.image import ImageDataGenerator, load_img, img_to_array, array_to_img


def predict(img_path: str):
    #Destination d'enregistrement du modèle
    MODEL_ROOT_DIR = './model/'
    MODEL_PATH = os.path.join(MODEL_ROOT_DIR, 'model_predict.json')
    WEIGHT_PATH = os.path.join(MODEL_ROOT_DIR, 'model_predict.hdf5')
    #Catégorie
    CATEGORIES = [u'Shelty', u'Corgi', u'Border collie']
    #Taille de l'image
    IMG_SIZE = 150
    INPUT_SHAPE = (IMG_SIZE, IMG_SIZE,3)
    
    #Chargez le modèle
    model = model_from_json(open(MODEL_PATH).read())
    model.load_weights(WEIGHT_PATH)
    
    #Lire l'image à partir de l'argument d'entrée
    img = image.load_img(img_path, target_size=INPUT_SHAPE)
    x = image.img_to_array(img)
    x = np.expand_dims(x, axis=0)
    
    #Prédire avec un modèle
    features = model.predict(x)
       
    if features[0, 0] == 1:
        return  u'C'est Shelty.'
    else:
        for i in range(0, len(CATEGORIES)):
            if features[0, i] == 1:
                return u'Cela ne semble pas être sheltie.{}est.'.format(CATEGORIES[i])

Début du service

#Démarrez Nginx
$ sudo systemctl start nginx
$ vi uwsgi.ini
#Démarrez uWSGI
$ uwsgi uwsgi.ini
[uwsgi]

wsgi-file=app.py
callable=app
http=0.0.0.0:8000
socket=/tmp/uwsgi.sock
chmod-socket=666

Démo de l'application Shelty Judgment AI

J'ai accédé à http://192.168.33.31 et confirmé l'opération.

ai.gif

Il était facile d'incorporer l'IA dans une application Web.

Recommended Posts

Intégrez Shelty Judgment AI dans votre application Web
Intégrez Shelty Judgment AI dans votre application Web
Jusqu'à ce que vous hébergiez vous-même votre propre interprète
[Python] Développement d'applications IA Udemy Image Judgment - Partie 1