How to send a string on Python Flask route to a JS function?

Question

This is the route on app.py

app.route('/analyze', methods=['POST'])
async def analyze(requestArg):
    img_data = await requestArg.form()
    img_bytes = await (img_data['file'].read())
    img = open_image(BytesIO(img_bytes))
    prediction = learn.predict(img)[0]
    result(str(prediction))

I'm trying to send the str(prediction) to the result() function on static/js/script.js here

function result(str) {
    $(".pd-result").show();

    var resultText = $(".text")
    switch (str) {
        case "emotion":
            text.html("angry");
            break;

        default:
            break;
    }
};

I've tried to just directly call result(str(prediction)) but it doesn't work.

a) you can't just mix JavaScript and Python randomly (or non-randomly) b) the Python code runs on the server, and that JS code is client-side code and therefore runs in the user's browser. You need to use $.post() to make a request to the server's /analyze route, then process the result in the success callback. — user5734311
– user5734311, Commented Sep 8, 2020 at 18:30

agittarius · Accepted Answer · 2020-09-08 20:56:34Z

1

In app.py return prediction:

app.route('/analyze', methods=['POST'])
async def analyze(requestArg):
    img_data = await requestArg.form()
    img_bytes = await (img_data['file'].read())
    img = open_image(BytesIO(img_bytes))
    prediction = learn.predict(img)[0]
    return prediction

Within your js file call you function on a successfull post request:

$(() => {
    Var data = {...};
    $.post("/analyze", data)
        .done((prediction)=>{
            result(prediction)
        }))
})

See here: https://api.jquery.com/jquery.post/

edited Sep 8, 2020 at 20:56

answered Sep 8, 2020 at 20:25

agittarius

6357 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

agittarius Over a year ago

You are right - you have to use ` $.post() `. This should work since you are already using jQuery. I fixed my code.

arahpanah Over a year ago

Thanks! I'm not really familiar with Ajax so I wasn't sure what went wrong.

Collectives™ on Stack Overflow

How to send a string on Python Flask route to a JS function?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related