Easy deep learning web app with NNC and Python + Flask
I've been able to create a very simple web application by biting Flask a little, so I immediately incorporated deep learning and played with it. The deep learning part uses the Neural Network Console (NNC).
Usage environment
- Windows 10 Home 20H2 --Neural Network Console for Windows 2.0.0
- Neural Network Libraries 1.15.0
- Anaconda3-2020.11-Windows-x86_64
- Flask 1.1.2
Environment
Build the environment. I'm doing it through trial and error, so I may have missed some steps, but I think it was like this.
Install Neural Network Console
Please download and install from here. https://dl.sony.com/ja/app/
Install Anaconda and build virtual environment
Install Anaconda and build a virtual environment. The specific method is See this article [Beginners] The easiest (probably) easiest way to create and switch Python virtual environments with Anaconda. Neural Network Libraries are said to support Python 3.6-3.8, so specify the Python version when building a virtual environment.
Install Neural Network Libraries in virtual environment
The installation method of Neural Network Libraries is described on the following page. https://nnabla.org/ja/install/ There is nothing difficult to say,
> pip install -U nnabla
Just do. (Settings are different when using GPU)
However, it seems that other modules are needed. https://nnabla.readthedocs.io/en/latest/python/installation.html According to it, scipy etc. are also required, so install them as well.
> conda install scipy scikit-image ipython
Install Flask in a virtual environment
Also install Flask.
> conda install flask
Allow Neural Network Libraries to perform inference
This time, I tried to use "2. How to execute inference using Python API" in the following tutorial as it is. The project used is 02_binary_cnn, a CNN (Convolutional Neural Network) that identifies handwritten numbers 4 and 9.
Tutorial: Two ways to use a trained neural network with Neural Network Console using Neural Network Libraries
If you follow the tutorial and run it in Anaconda's virtual environment without any errors, you're ready to go.
Creating a web app
When you're ready, let's create a web app.
NNC inference execution processing
This is almost the same as the tutorial above. Since we are dealing with images this time, we have included image loading and normalization processing. This time, the image is assumed to be 28x28 pixel grayscale. If necessary, you can resize the image or add color reduction processing.
app.py first half
import nnabla as nn
import nnabla.functions as F
import nnabla.parametric_functions as PF
import os
import sys
from PIL import Image
import numpy as np
#----------NNC processing----------
def network(x, test=False):
# Input:x -> 1,28,28
# Convolution -> 16,24,24
h = PF.convolution(x, 16, (5,5), (0,0), name='Convolution')
# MaxPooling -> 16,12,12
h = F.max_pooling(h, (2,2), (2,2))
# Tanh
h = F.tanh(h)
# Convolution_2 -> 8,8,8
h = PF.convolution(h, 8, (5,5), (0,0), name='Convolution_2')
# MaxPooling_2 -> 8,4,4
h = F.max_pooling(h, (2,2), (2,2))
# Tanh_2
h = F.tanh(h)
# Affine -> 10
h = PF.affine(h, (10,), name='Affine')
# Tanh_3
h = F.tanh(h)
# Affine_2 -> 1
h = PF.affine(h, (1,), name='Affine_2')
# Sigmoid
h = F.sigmoid(h)
return h
#Image loading and normalization
def normalize_image(save_filepath):
im_gray = np.array(Image.open(save_filepath)) / 255.0
return im_gray
def predict(im_gray):
# load parameters
nn.load_parameters('./results.nnp')
# Prepare input variable
x=nn.Variable((1,1,28,28))
# Let input data to x.d
x.d = im_gray
#x.data.zero()
# Build network for inference
y = network(x, test=True)
# Execute inference
y.forward()
print(y.d)
return y.d
Web application creation with Python + Flask
Create a web app in Flask. If you specify an image from the form (described later) created in digitsPred.html and submit it, the result obtained by running NNC inference processing behind the scenes will be displayed in success.html.
In the NNC sample project used this time, it is learned that if the inference result is close to 0, it will be "4", and if it is close to 1, it will be "9", so if the inference result is less than 0.5, it will be "4". If not, we will determine that "9" was drawn in the image.
app.Late py
from flask import Flask, render_template, request, redirect, url_for
from werkzeug.utils import secure_filename
import os
app = Flask(__name__)
@app.route('/digitsPred', methods=['GET', 'POST'])
def upload():
#For GET
if request.method == 'GET':
return render_template('digitsPred.html')
#For POST
elif request.method == 'POST':
#Get the submitted file
file = request.files['file']
#Convert to a safe file name
save_filename = secure_filename(file.filename)
#Save file
save_filepath = os.path.join('./static/image', save_filename)
file.save(save_filepath)
#Normalize image file and convert to ndarray
im_gray = normalize_image(save_filepath)
#Inference execution with NNC
pred = predict(im_gray)
#Result processing
if pred < 0.5:
res = 4 #Judged as the number 4
else:
res = 9 #Judged as the number 9
#Result display
return render_template('success.html', save_filename=save_filename, res=res, pred=pred[0][0])
if __name__ == '__main__':
app.run(debug=True)
Save these two codes in a single Python file called app.py.
In addition, as drawn in the above process, the image is saved in the ./static/image folder, so create a folder.
HTML file preparation
Create a folder called templates in the location where the Python file is located, and create the following three HTML files in it.
- base.html
- digitsPred.html
- success.html
base.html Make a common part in each HTML file in base.html and inherit it.
base.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Form Sample</title>
</head>
<body>
{% block content %}
{% endblock %}
</body>
</html>
digitsPred.html Create a form on this page to allow you to submit the file.
digitsPred.html
{% extends "base.html" %}
{% block content %}
<title>Numerical judgment by deep learning</title>
<h1>Upload image of numbers</h1>
<p>The image should be monochrome and 28x28 pixels.</p>
<p>at present"4"When"9"Only the classification of is supported.</p>
<form action="{{url_for('upload')}}" method="POST" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit" value="upload">
</form>
{% endblock %}
success.html View the inference results on this page. I will also give the raw value of the inference result of NNC.
success.html
{% extends "base.html" %}
{% block content %}
<title>Inference result</title>
<h1>Inference completed</h1>
<p>The uploaded file is{{save_filename}}is.</p>
<h2>The numbers written in the image are{{res}}is.</h2>
<p>NNC inference results{{pred}}was.</p>
{% endblock %}
Execution result
Run the app.py file. For example, if you visit http://127.0.0.1:5000/digitsPred, you will see the form.
If you specify an image and click the [Upload] button, the result will be displayed like this.
- It is easy to use the image file included in the NNC sample data set.
neural_network_console_200 \ neural_network_console \ samples \ sample_dataset \ MNIST \ validation
Reference material
--Udemy's course Web application development course with Python + Flask! !! ~ Master Flask from 0 to create SNS ~ -Easy machine learning with scikit-learn and flask ✕ Web app
Recommended Posts