how can I use data posted from ajax in flask?

I'm having trouble getting data POSTed from jquery ajax.

$('#clickme').click( function() {
    var data = save_input(); // data

    data['_sid'] = $survey_id;  // survey_id injected from flask
    data['_uip'] = $user_ip; // user_ip injected from flask, request.remote_addr

    $.ajax({
        type : "POST",
        url : "{{ url_for('mod.load_ajax') }}",
        data: JSON.stringify(data),
        contentType: 'application/json;charset=UTF-8',
        success: function(result) {
            console.log(result);
        }
    });

    console.log(data);
});

from the code, data is a javascript object like

{
    'foo' : 'foo',
    'bar' : 'bar',
    'fo_' : 42,
}

what I'm trying to do in flask is :

@mod.route('/load_ajax', methods=["GET", "POST"])
def load_ajax():
    if request.method == "POST":
        # load _sid and _uip from posted JSON and save other data
        # but request.form is empty.
        # >>> request.form
        # ImmutableMultiDict([]) 
        return str(request.form)

see, the ajax request is made but no data is submitted. I do console.log(data) with ajax so I can see that I really have some meaningful data in data variable in jquery. but request.form in ajax view is empty. Where is my data submitted?

Try

 $.ajax({
    type : "POST",
    url : "{{ url_for('mod.load_ajax') }}",
    data: JSON.stringify(data, null, '\t'),
    contentType: 'application/json;charset=UTF-8',
    success: function(result) {
        console.log(result);
    }
});

Then from the server, you can refer to the variables in data like this :

request.json['foo']

Since the content type is specified as application/json the data is in request.json

As per your example you are not sending a key value pair but rather assigning a JSON string to the jQuery data option. As mentioned in the comments you have to stringify your JSON, create an object with a key (which will be used to access the JSON string from flask) and then assign it to the jQuery data key.

    $.ajax({
            type : "POST",
            url : "{{ url_for('mod.load_ajax') }}",
            data: {json_str: JSON.stringify(data)},
            contentType: 'application/json;charset=UTF-8',
            success: function(result) {
                console.log(result);
            }
        });

    @mod.route('/load_ajax', methods=["GET", "POST"])
    def load_ajax():
        if request.method == "POST":
            # load _sid and _uip from posted JSON and save other data
            # but request.form is empty.
            # >>> request.form
            # ImmutableMultiDict([]) 
            return str(request.form['json_str']
     )

On the flask side, use:

data = request.get_json()

The variable data now has the dictionary you sent using ajax and you can now manipulate it with python

Have you tried remove contentType? You suppose to post data to Flask.

could you try add fake data like

data:{"hello":"world"} inside ajax? just to check if the hello world arrive to request.form

how can I use data posted from ajax in flask?

Related

Recent Posts