Merhaba,
Bu yazımızda Keras
ile eğitilen bir derin öğrenme modelini kullanmak ve test etmek için
bir web uygulamasını nasıl geliştirip ücretsiz olarak host edebiliriz
birlikte görelim.
Python Flask ile Web Uygulaması
Flask, Python tabanlı web uygulamaları geliştirebileceğiniz mikroçatı(microframework)’dır.
Öncelikle Flask’ı yükleyelim.
pip3 install FlaskYeni bir app.py python dosyası oluşturalım ve aşağıdaki python kodlarını yazalım.
from flask import Flask
app = Flask(__name__)
@app.route("/")
def main():
return "Merhaba Flask ;)"
if __name__ == "__main__":
app.run()@app.route("/") ile localhost:5000/ adresine istek gönderildiğinde ve def main(): fonksiyonu ile dönecek içerik için çağrılacak fonksiyon tanımlanıyor.
Terminalden oluşturduğumuz app.py kodumuzu çalıştıralım
python app.py
Terminalde Running on http://127.0.0.1:5000/ çıktısını gördüğümüzde tarayıcımızdan http://localhost:5000/ adresine gittiğimizde main() fonksiyonunda döndüğümüz string değerini göreceğiz.
Flask ile HTML Template Kullanma
Yeni bir templates klasörü açalım ve templates klasörü içerisine bir index.html dosyası oluşturalım ve aşağıdaki html kodlarını yazalım.
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<title>Merhaba Flask! Html demosu.</title>
</head>
<body>
<div class="container">
<div class="py-5 text-center">
<h1>Merhaba Flask! Html demosu.</h1>
<button type="submit" class="btn btn-primary">TEST</button>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
</body>
</html>app.py python dosyamızda render_template paketini import edelim ve main() fonksiyonunu, yeni oluşturduğumuz index.html’i çağırması için aşağıdaki şekilde yeniden düzenliyoruz.
Terminalden yeniden app.py’yi çalıştırdığımızda aşağıdaki gibi html sayfasını göreceğiz.
Python Flask ile basit bir web uygulamasınu bu şekilde geliştirebilirsiniz.
Derin Öğrenme Web Uygulaması Geliştirme
Şimdi web uygulamamızı geliştirerek derin öğrenme modelini nasıl çalıştırabileceğimize bakalım.
Gerekli Keras paketlerini, resim sınıflandırma için kullanacağımız ağımız olan ResNet50 paketini ve ön işlemler için gerekli diğer paketleri ekleyelim.
from keras.applications import ResNet50
from keras.preprocessing.image import img_to_array
from keras.applications import imagenet_utils
from PIL import Image
import numpy as np
from flask import Flask, render_template, request, jsonify, send_from_directory
import io
import werkzeug
import datetime
import osResim sınıflandırma için ImageNet veriseti ile eğitilmiş modelimizi ve ağırlık dosyalarını yükleyelim.
model = ResNet50(weights="imagenet")Form post metodu ile gönderilen resim dosyasını modelin uygun giriş formata getiren bazı ön işlemler uygulandıktan sonra modele gönderilip tahmin (prediction) sonucunun alındığı ve json formatında geri döndürdüğümüz predict() fonksiyonunu aşağıdaki gibi tanımlayalım.
@app.route("/predict", methods=["POST"])
def predict():
# initialize the data dictionary that will be returned from the
# view
data = {"success": False}
# ensure an image was properly uploaded to our endpoint
if request.method == "POST" and request.files['image']:
imagefile = request.files["image"].read()
image = Image.open(io.BytesIO(imagefile))
# preprocess the image and prepare it for classification
image = prepare_image(image, target=(224, 224))
# classify the input image and then initialize the list
# of predictions to return to the client
preds = model.predict(image)
results = imagenet_utils.decode_predictions(preds)
data["predictions"] = []
# loop over the results and add them to the list of
# returned predictions
for (imagenetID, label, prob) in results[0]:
r = {"label": label, "probability": float(prob)}
data["predictions"].append(r)
# indicate that the request was a success
data["success"] = True
print(data)
# return the data dictionary as a JSON response
return jsonify(data)Son olarak geriye kalan bu servisi başlatmak.
if __name__ == "__main__":
print("START FLASK")
port = int(os.environ.get('PORT', 5000))
app.run(host='0.0.0.0', port=port)
Uygulamamızın bu hali ile bir REST API olarak kullanabilir durumdayız.
Terminalden uygulamamızı çalıştırdıktan sonra başka bir terminalden http://0.0.0.0:5000/predict adresine örnek bir resmimizi curl ile post ediyoruz.
Örnek olarak amerikan papağını resmini sınıflandırmaya çalışalım
Aşağıdaki gibi göndermiş olduğumuz resim modelde sınıflandırarak json sonucunu bize dönüyor.
Sonuçlar arasında en yüksek oranla %99 macaw olarak sınıflandırma yaptığını görüyoruz
Şimdi ise yazmış olduğumuz API’yi kullanarak web arayüzünden bir resim dosyayı seçerek sınıflandırmayı gerçekleştirelim.
Bunun için index.html sayfamıza kullanıcının resim yükleyebilmesi için bir form ve dosya yükleme elementleri ekleyelim.
<form id="upload-file" method="post" enctype="multipart/form-data">
<div class="form-group">
<label for="InputFile">Resim Dosyası:</label>
<input name="image" type="file" class="form-control-file" id="InputFile" aria-describedby="fileHelp">
<small id="fileHelp" class="form-text text-muted">Tanımak istediğiniz resmi bilgisayarınızdan seçiniz</small>
</div>
<button id="upload-file-btn" type="button" class="btn btn-primary">Gönder</button>
</form>Kullanıcı dosya yükleme elementi ile resim dosyasını seçtikten sonra ‘Gönder‘ buttonuna tıklandığında, jquery ajax ile seçilen dosyayı app.py python kodunda tanımladığımız predict() fonksiyonunu çağıran REST API’mize POST isteği gönderelim.
$('#upload-file-btn').click(function () {
$('.loader').show();
$("#results").html('');
var form_data = new FormData($('#upload-file')[0]);
$.ajax({
type: 'POST',
url: '/predict',
data: form_data,
contentType: false,
cache: false,
processData: false,
async: false,
success: function (data) {
console.log(data.success);
$('.loader').hide();
$.each(data.predictions, function (i, item) {
console.log(item);
label = item["label"];
prob = item["probability"].toFixed(2);
percent = prob * 100;
$("#results").append('<label>' + percent + '% ' + label + '</label><div class="progress"><div class="progress-bar" role="progressbar" aria-valuenow="' + percent + '" aria-valuemin="0" aria-valuemax="100" style="width:' + percent + '%"></div></div>');
});
},
});
});Uygulamanın tüm kaynak kodlarına buradan ulaşabilirsiniz.
Kaynak
kodları Keras kütüphanesi yüklü bir bilgisayara indirerek
çalıştırabilir veya online şekilde yayınlamak isterseniz yazıyı okumaya
devam edebilirsiniz.
Web Uygulamasını Heroku Üzerinde Yayınlama
Heroku, birçok dil desteği olan, uygulama alt yapısı sağlayan bir bulut platformudur.
Heroku’ya uygun düzenlemeleri yapmak ve kendiniz heroku uygulaması oluşturmak isterseniz gerekli adımları Sıddık Açıl’ın aşağıdaki buradaki yazısına göz atabilirsiniz.
Veya herhangi bir işlem yapmadan Heroku üzerinden bir hesap oluşturarak bu uygulamaya özel olarak hazırladığım aşağıdaki button ile tek tıkla kendi heroku hesabınız altında hızlıca yayına alabilirsiniz.
Görüşlerinizi aşağıdaki yorum bölümüne yazabilirsiniz.
Kaynaklar: