I am trying to call API through below code. but my browsers are giving the same error and no response is getting from server.

And my API is working fine I have tested through postman. I dont know where I am getting wrong

I have also tried to put some header content type

application/json, application/x-javascript , application/javascript, text/json

function send(text) {


    $.ajax({
        url: 'http://localhost:5005/conversations/default/respond',
        type: 'POST',
        dataType:'jsonp',
        headers: {
            'Content-Type': 'application/javascript'
        },
        data: //JSON.stringify({
            {
            "q": text
        },//),
        success: function (data, textStatus, xhr) {
            console.log(data);

            if (Object.keys(data).length !== 0) {
                for (i = 0; i < Object.keys(data[0]).length; i++) {
                    if (Object.keys(data[0])[i] == "buttons") { //check if buttons(suggestions) are present.
                        addSuggestion(data[0]["buttons"])
                    }
                }
            }

            setBotResponse(data);

        },
        error: function (xhr, textStatus, errorThrown) {
            console.log('Error in Operation');
            setBotResponse('error');
        }
    });

I am trying to call API through below code. but my browsers are giving the same error and no response is getting from server.

And my API is working fine I have tested through postman. I dont know where I am getting wrong

I have also tried to put some header content type

application/json, application/x-javascript , application/javascript, text/json

function send(text) {


    $.ajax({
        url: 'http://localhost:5005/conversations/default/respond',
        type: 'POST',
        dataType:'jsonp',
        headers: {
            'Content-Type': 'application/javascript'
        },
        data: //JSON.stringify({
            {
            "q": text
        },//),
        success: function (data, textStatus, xhr) {
            console.log(data);

            if (Object.keys(data).length !== 0) {
                for (i = 0; i < Object.keys(data[0]).length; i++) {
                    if (Object.keys(data[0])[i] == "buttons") { //check if buttons(suggestions) are present.
                        addSuggestion(data[0]["buttons"])
                    }
                }
            }

            setBotResponse(data);

        },
        error: function (xhr, textStatus, errorThrown) {
            console.log('Error in Operation');
            setBotResponse('error');
        }
    });

• javascript
• json
• ajax
• rasa-nlu

• Maybe you need to dataType: 'json' instead of dataType: 'jsonp' and Content-Type: application/json – Timofey Goncharov Commented May 8, 2019 at 11:32
• 2 Do you have to use JSONP ? I'd rather use normal JSON and fix cross origin issues with actual cross origin headers instead of by using JSONP instead of JSON. On old servers/operating systems, I did have to add 'application/json' to the MIME type list to actually be able to use json as well. So make sure both your clients and server know what your MIME type means if you plan to use jsonp or json on an old system. – Shilly Commented May 8, 2019 at 11:34
• The returned format for a JSONP call is not JSON but JavaScript. (JSONP = JSON with padding, while padding means a JS function wrapper to load the response JSON into a local or global variable) – feeela Commented May 8, 2019 at 11:37
• 1 @sheel That's exactly what I mean with ` fix cross origin issues with actual cross origin headers`. Just look up CORS javascript in your favourite search engine or here on SO and implement that so you can use normal JSON and the problem disappears. JSONP was a solution to the cross origin problem before we could actually configure CORS correctly, but in these days it's mostly obsolete. – Shilly Commented May 8, 2019 at 12:17
• 1 @sheel It can be rather plicated, so other tutorials will explain it way better. In short: On the server that responds to the call, the API, you have to configure the response headers so they return Access-Control-Allow-Headers with the value true. and Access-Control-Allow-Origin, containing the value of the domain your client is making the requests from. You also have to make sure the API actually allows HEAD requests to be made. Depending on the server, you might need to add Access-Control-Allow-Credentials as well. – Shilly Commented May 8, 2019 at 12:41

1 Answer 1

I had this same problem and in order to avoid this error or CORB error this is how I set my AJAX call:

$.ajax({
    url: 'http://api.test/blablabla', 
    type: 'GET',
    headers: {'Access-Control-Allow-Origin':'*'}, // <-------- set this
    dataType: 'jsonp', // // <-------- use JSONP
    success: function(data){
        console.log(data);
    }
});

I choose this answer after reading this.