Trying to Request Data (POST) from FLASK API with Java Script

Question

I am currently trying to request Data with Java Script from my API but it doesn`t work. Everytime i POST i get the error, that "TypeError: 'NoneType' object is not subscriptable" in FLASK. Code of my API:

#http://127.0.0.1:5000/fnd
@app.route('/fnd', methods=['POST'])
def fnd():
    content = request.json
    return jsonify(content['Text'])

For the Post I am using JQuery AJAX Requests

$(function ()
{
    var output = $('#output');
    $('#checkonfake').on('click',function(){
        var texttocheck = $('#texttocheck').val();
        var datad = {"Text": texttocheck}
        console.log(datad);
        if(texttocheck != ""){
              $.ajax(
                {
                    dataType: "json",
                    type: 'POST',
                    data: 
                    { 
                        datad
                    },
                    url: 'http://127.0.0.1:5000/fnd',
                    success: function (result) 
                    {
                        console.log(result);
                    },
                    error: function () 
                    {
                        console.log("error");
                    }
                });
    }
})
});

I have like a Input Box and a button and as soon as i press the button the request should be sent off.

If I try it with POSTMAN, the result is as following <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> <title>405 Method Not Allowed</title> <h1>Method Not Allowed</h1> <p>The method is not allowed for the requested URL.</p> — Emil Völkl
– Emil Völkl, Commented Dec 28, 2020 at 8:45
you are getting that error since content is emty. The reason why you get The method is not allowed for the requested URL is that the method for def fnd() is different from what you are using with POSTMAN. — iliya
– iliya, Commented Dec 28, 2020 at 8:56

Para · Accepted Answer · 2020-12-28 09:15:49Z

you can change code to this by string:

#http://127.0.0.1:5000/fnd
@app.route('/fnd', methods=['POST'])
def fnd():
    s_json = request.get_data(as_text=True)
    obj = json.loads(s_json)
    return jsonify(obj['Text'])

and change html code to this:

datad = {"aaa":"aaaa", "bbb":"bbb","Text":"Text"}
$.ajax(
    {
        dataType: "json",
        type: 'POST',
        data: JSON.stringify(datad),
        url: 'http://127.0.0.1:5000/fnd',
        success: function (result)
        {
            console.log(result);
        },
        error: function ()
        {
            console.log("error");
        }
    });

or if you wana uses json

@app.route('/fnd', methods=['POST'])
def fnd():
    return jsonify(request.form["Text"])

datad = {"aaa":"aaaa", "bbb":"bbb","Text":"Text"}
 $.ajax(
    {
        dataType: "json",
        type: 'POST',
        data: datad,
        url: 'http://127.0.0.1:5000/fnd',
        success: function (result)
        {
            console.log(result);
        },
        error: function ()
        {
            console.log("error");
        }
    });

by the way:
i can't find the info for request.json in flask.palletsprojects.com
so.. i don;t know this param means and why it is none

Collectives™ on Stack Overflow

Trying to Request Data (POST) from FLASK API with Java Script

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related