Error 400 in Flask “The browser (or proxy) sent a request that this server could not understand.”
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
0
So, I am trying to follow this tutorial https://www.youtube.com/watch?v=eCz_DTtUBfo
about flask usage with my ML model. The part of loading the model works, but when I try to initialize it, it just doesn't work. Maybe I have some error in my writing.
I hope anyone could help me :c
Here is my Flask code:
from keras.preprocessing.image import img_to_array
from flask import request
from flask import jsonify
from flask import Flask
app = Flask(__name__)
def get_model():
global model
model = load_model('pecuscope_model.h5')
print(" * Model loaded!")
def preprocess_image(image, target_size):
if image.mode != "RGB":
image = image.convert("RGB")
image = image.resize(target_size)
image = img_to_array(image)
image = np.expand_dims(image, axis=0)
return image
print(" * Loading Keras model...")
get_model()
@app.route("/predict", methods=["GET","POST"])
def predict():
message = request.get_json(force=True)
encoded = message['image']
decoded = base64.b64decode(encoded)
image = Image.open(io.BytesIO(decoded))
processed_image = preprocess_image(image, target_size=(229, 229))
prediction = model.predict(processed_image).tolist()
response = {
'prediction': {
'mosquito': prediction[0][0],
'abeja': prediction[0][1]
}
}
return jsonify(response)
and my html:
<!DOCTYPE html>
<html>
<head>
<title>PecuScope Prediction</title>
<style>
* {
font-size:30px;
}
</style>
</head>
<body>
<input id="image-selector" type="file">
<button id="predict-button">Predict</button>
<p style="font-weight:bold">Predictions</p>
<p>Mosquito: <span id="mosquito-prediction"></span></p>
<p>Abeja: <span id=abeja-prediction"></span></p>
<img id="selected-image" src=""/>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
let base64Image;
$("#image-selector").change(function() {
let reader = new FileReader();
reader.onload = function(e) {
let dataURL = reader.result;
$('#selected-image').attr("src", dataURL);
base64Image = dataURL.replace("data:image/jpg;base64,","");
console.log(base64Image);
}
reader.readAsDataURL($("#image-selector")[0].files[0]);
$("#mosquito-prediction").text("");
$("#abeja-prediction").text("");
});
$("#predict-button").click(function(event){
let message = {
image: base64Image
}
console.log(message);
$.post("http://10.142.0.2:5000/predict", JSON.stringify(message),
function(response){
$("#mosquito-prediction").text(response.prediction.mosquito.toFixed(6));
$("#abeja-prediction").text(response.prediction.abeja.toFixed(6));
console.log(response);
});
});
</script>
<body>
<html>
I thought that could be a problem with indentation, or with spaces, I don't know. I'm very disappointed with myself. I can't follow a tutorial :c
javascript python html flask port
edited Nov 22 '18 at 7:05
jess
1,262116
asked Nov 22 '18 at 6:45
César AguilarCésar Aguilar
12
add a comment |
0
So, I am trying to follow this tutorial https://www.youtube.com/watch?v=eCz_DTtUBfo
about flask usage with my ML model. The part of loading the model works, but when I try to initialize it, it just doesn't work. Maybe I have some error in my writing.
I hope anyone could help me :c
Here is my Flask code:
from keras.preprocessing.image import img_to_array
from flask import request
from flask import jsonify
from flask import Flask
app = Flask(__name__)
def get_model():
global model
model = load_model('pecuscope_model.h5')
print(" * Model loaded!")
def preprocess_image(image, target_size):
if image.mode != "RGB":
image = image.convert("RGB")
image = image.resize(target_size)
image = img_to_array(image)
image = np.expand_dims(image, axis=0)
return image
print(" * Loading Keras model...")
get_model()
@app.route("/predict", methods=["GET","POST"])
def predict():
message = request.get_json(force=True)
encoded = message['image']
decoded = base64.b64decode(encoded)
image = Image.open(io.BytesIO(decoded))
processed_image = preprocess_image(image, target_size=(229, 229))
prediction = model.predict(processed_image).tolist()
response = {
'prediction': {
'mosquito': prediction[0][0],
'abeja': prediction[0][1]
}
}
return jsonify(response)
and my html:
<!DOCTYPE html>
<html>
<head>
<title>PecuScope Prediction</title>
<style>
* {
font-size:30px;
}
</style>
</head>
<body>
<input id="image-selector" type="file">
<button id="predict-button">Predict</button>
<p style="font-weight:bold">Predictions</p>
<p>Mosquito: <span id="mosquito-prediction"></span></p>
<p>Abeja: <span id=abeja-prediction"></span></p>
<img id="selected-image" src=""/>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
let base64Image;
$("#image-selector").change(function() {
let reader = new FileReader();
reader.onload = function(e) {
let dataURL = reader.result;
$('#selected-image').attr("src", dataURL);
base64Image = dataURL.replace("data:image/jpg;base64,","");
console.log(base64Image);
}
reader.readAsDataURL($("#image-selector")[0].files[0]);
$("#mosquito-prediction").text("");
$("#abeja-prediction").text("");
});
$("#predict-button").click(function(event){
let message = {
image: base64Image
}
console.log(message);
$.post("http://10.142.0.2:5000/predict", JSON.stringify(message),
function(response){
$("#mosquito-prediction").text(response.prediction.mosquito.toFixed(6));
$("#abeja-prediction").text(response.prediction.abeja.toFixed(6));
console.log(response);
});
});
</script>
<body>
<html>
I thought that could be a problem with indentation, or with spaces, I don't know. I'm very disappointed with myself. I can't follow a tutorial :c
javascript python html flask port
edited Nov 22 '18 at 7:05
jess
1,262116
asked Nov 22 '18 at 6:45
César AguilarCésar Aguilar
12
add a comment |
0
0
0
So, I am trying to follow this tutorial https://www.youtube.com/watch?v=eCz_DTtUBfo
about flask usage with my ML model. The part of loading the model works, but when I try to initialize it, it just doesn't work. Maybe I have some error in my writing.
I hope anyone could help me :c
Here is my Flask code:
from keras.preprocessing.image import img_to_array
from flask import request
from flask import jsonify
from flask import Flask
app = Flask(__name__)
def get_model():
global model
model = load_model('pecuscope_model.h5')
print(" * Model loaded!")
def preprocess_image(image, target_size):
if image.mode != "RGB":
image = image.convert("RGB")
image = image.resize(target_size)
image = img_to_array(image)
image = np.expand_dims(image, axis=0)
return image
print(" * Loading Keras model...")
get_model()
@app.route("/predict", methods=["GET","POST"])
def predict():
message = request.get_json(force=True)
encoded = message['image']
decoded = base64.b64decode(encoded)
image = Image.open(io.BytesIO(decoded))
processed_image = preprocess_image(image, target_size=(229, 229))
prediction = model.predict(processed_image).tolist()
response = {
'prediction': {
'mosquito': prediction[0][0],
'abeja': prediction[0][1]
}
}
return jsonify(response)
and my html:
<!DOCTYPE html>
<html>
<head>
<title>PecuScope Prediction</title>
<style>
* {
font-size:30px;
}
</style>
</head>
<body>
<input id="image-selector" type="file">
<button id="predict-button">Predict</button>
<p style="font-weight:bold">Predictions</p>
<p>Mosquito: <span id="mosquito-prediction"></span></p>
<p>Abeja: <span id=abeja-prediction"></span></p>
<img id="selected-image" src=""/>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
let base64Image;
$("#image-selector").change(function() {
let reader = new FileReader();
reader.onload = function(e) {
let dataURL = reader.result;
$('#selected-image').attr("src", dataURL);
base64Image = dataURL.replace("data:image/jpg;base64,","");
console.log(base64Image);
}
reader.readAsDataURL($("#image-selector")[0].files[0]);
$("#mosquito-prediction").text("");
$("#abeja-prediction").text("");
});
$("#predict-button").click(function(event){
let message = {
image: base64Image
}
console.log(message);
$.post("http://10.142.0.2:5000/predict", JSON.stringify(message),
function(response){
$("#mosquito-prediction").text(response.prediction.mosquito.toFixed(6));
$("#abeja-prediction").text(response.prediction.abeja.toFixed(6));
console.log(response);
});
});
</script>
<body>
<html>
I thought that could be a problem with indentation, or with spaces, I don't know. I'm very disappointed with myself. I can't follow a tutorial :c
javascript python html flask port
edited Nov 22 '18 at 7:05
jess
1,262116
asked Nov 22 '18 at 6:45
César AguilarCésar Aguilar
12
So, I am trying to follow this tutorial https://www.youtube.com/watch?v=eCz_DTtUBfo
about flask usage with my ML model. The part of loading the model works, but when I try to initialize it, it just doesn't work. Maybe I have some error in my writing.
I hope anyone could help me :c
Here is my Flask code:
from keras.preprocessing.image import img_to_array
from flask import request
from flask import jsonify
from flask import Flask
app = Flask(__name__)
def get_model():
global model
model = load_model('pecuscope_model.h5')
print(" * Model loaded!")
def preprocess_image(image, target_size):
if image.mode != "RGB":
image = image.convert("RGB")
image = image.resize(target_size)
image = img_to_array(image)
image = np.expand_dims(image, axis=0)
return image
print(" * Loading Keras model...")
get_model()
@app.route("/predict", methods=["GET","POST"])
def predict():
message = request.get_json(force=True)
encoded = message['image']
decoded = base64.b64decode(encoded)
image = Image.open(io.BytesIO(decoded))
processed_image = preprocess_image(image, target_size=(229, 229))
prediction = model.predict(processed_image).tolist()
response = {
'prediction': {
'mosquito': prediction[0][0],
'abeja': prediction[0][1]
}
}
return jsonify(response)
and my html:
<!DOCTYPE html>
<html>
<head>
<title>PecuScope Prediction</title>
<style>
* {
font-size:30px;
}
</style>
</head>
<body>
<input id="image-selector" type="file">
<button id="predict-button">Predict</button>
<p style="font-weight:bold">Predictions</p>
<p>Mosquito: <span id="mosquito-prediction"></span></p>
<p>Abeja: <span id=abeja-prediction"></span></p>
<img id="selected-image" src=""/>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
let base64Image;
$("#image-selector").change(function() {
let reader = new FileReader();
reader.onload = function(e) {
let dataURL = reader.result;
$('#selected-image').attr("src", dataURL);
base64Image = dataURL.replace("data:image/jpg;base64,","");
console.log(base64Image);
}
reader.readAsDataURL($("#image-selector")[0].files[0]);
$("#mosquito-prediction").text("");
$("#abeja-prediction").text("");
});
$("#predict-button").click(function(event){
let message = {
image: base64Image
}
console.log(message);
$.post("http://10.142.0.2:5000/predict", JSON.stringify(message),
function(response){
$("#mosquito-prediction").text(response.prediction.mosquito.toFixed(6));
$("#abeja-prediction").text(response.prediction.abeja.toFixed(6));
console.log(response);
});
});
</script>
<body>
<html>
I thought that could be a problem with indentation, or with spaces, I don't know. I'm very disappointed with myself. I can't follow a tutorial :c
javascript python html flask port
javascript python html flask port
edited Nov 22 '18 at 7:05
jess
1,262116
asked Nov 22 '18 at 6:45
César AguilarCésar Aguilar
12
edited Nov 22 '18 at 7:05
jess
1,262116
asked Nov 22 '18 at 6:45
César AguilarCésar Aguilar
12
edited Nov 22 '18 at 7:05
jess
1,262116
edited Nov 22 '18 at 7:05
jess
1,262116
edited Nov 22 '18 at 7:05
jess
1,262116
1,262116
asked Nov 22 '18 at 6:45
César AguilarCésar Aguilar
12
asked Nov 22 '18 at 6:45
César AguilarCésar Aguilar
12
asked Nov 22 '18 at 6:45
César AguilarCésar Aguilar
12
12
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
0
Dunno if it's the reason, but at least you forgot " at html file body:
Abeja: span id=abeja-prediction"
answered Nov 29 '18 at 10:37
kotolottokotolotto
365
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425258%2ferror-400-in-flask-the-browser-or-proxy-sent-a-request-that-this-server-could%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
Dunno if it's the reason, but at least you forgot " at html file body:
Abeja: span id=abeja-prediction"
answered Nov 29 '18 at 10:37
kotolottokotolotto
365
add a comment |
0
Dunno if it's the reason, but at least you forgot " at html file body:
Abeja: span id=abeja-prediction"
answered Nov 29 '18 at 10:37
kotolottokotolotto
365
add a comment |
0
0
0
Dunno if it's the reason, but at least you forgot " at html file body:
Abeja: span id=abeja-prediction"
answered Nov 29 '18 at 10:37
kotolottokotolotto
365
Dunno if it's the reason, but at least you forgot " at html file body:
Abeja: span id=abeja-prediction"
answered Nov 29 '18 at 10:37
kotolottokotolotto
365
answered Nov 29 '18 at 10:37
kotolottokotolotto
365
answered Nov 29 '18 at 10:37
kotolottokotolotto
365
answered Nov 29 '18 at 10:37
kotolottokotolotto
365
365
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425258%2ferror-400-in-flask-the-browser-or-proxy-sent-a-request-that-this-server-could%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
