0

I got below error in ajax request to REST api

"NetworkError: 400 Bad Request - http://192.168.2.45:8080/engine-rest/external-task/fetchAndLock/?callback=jQuery111008749113014618789_1478158463319&{%22workerId%22:%22worker01%22,%22maxTasks%22:5,%22topics%22:[{%22topicName%22:%22correctionOfData%22,%22lockDuration%22:10000,%22variables%22:[%22Applicant_Name%22]}]}&_=1478158463320" ?callba...8463320

Ajax code

<script type="text/javascript">
    require(['jquery'],function($) {
        var REST_BASE_URL = "http://192.168.2.45:8080/engine-rest";
        function receiveExternalTasks(topicName) {
            var fetchRequest = {
                "workerId":"worker01",
                "maxTasks":5,
                "topics": [
                    {
                        "topicName": topicName,
                        "lockDuration": 10000,
                        "variables": ["Applicant_Name"]
                    }
                ]
            }

            $.ajax(REST_BASE_URL + '/external-task/fetchAndLock/', {
                data: JSON.stringify(fetchRequest),
                dataType : "jsonp",
                contentType: "application/json; charset=utf-8",
                type : 'POST',
                beforeSend: function(xhr){xhr.setRequestHeader('Access-Control-Allow-Origin', '*');},
                success: function (result) {

                    for (var index = 0; index < result.length; ++index) {
                        var externalTask = result[index];
                        console.log(externalTask);
                        addRowToTable('table' + topicName, JSON.stringify(externalTask));
                        $.ajax(REST_BASE_URL + '/external-task/' + externalTask.id + '/complete', {
                            data: JSON.stringify({"workerId":"worker01"}),
                            dataType : "jsonp",
                            contentType: "application/json; charset=utf-8",
                            type : 'POST'
                        });
                    }
                }
            });
        };

        $(document).ready(function(){

            $("button").click(function(){
                receiveExternalTasks('correctionOfData');
            })


        });

    });
</script>           

please noted in above error, %22 added in query string, I doubted may be that will cause this error. I don't know how to remove %22

you can find the full source code here

Bilal Usean
  • 2,322
  • 3
  • 22
  • 45
  • Could you try to send the data without `JSON.stringify` ? – Weedoze Nov 03 '16 at 07:46
  • 1
    The `%22` values are URL encoded double quotes. The reason this happens is because you're making a JSONP request, which cannot be made through `POST` - it has to be `GET`. Are you sure you want to use JSONP and not just plain old JSON? They are not directly interchangeable without changing the server code. – Rory McCrossan Nov 03 '16 at 07:48
  • without jsonp I got error `cors origin not allow` @RoryMcCrossan – Bilal Usean Nov 03 '16 at 07:53
  • Then you need to add CORS headers to your server response. I'll close this as a duplicate then as it's a very common question – Rory McCrossan Nov 03 '16 at 07:54
  • so add header for cors in request @BilalUsean – Divyesh Kanzariya Nov 03 '16 at 07:54
  • I have added cors filter in tomcat (remote server) web.xml as well as add xhr.setHea... in ajax code but It does not solve my problem . after @RoryMcCrossan comments I realized jsonp does not support POST. – Bilal Usean Nov 03 '16 at 07:57

0 Answers0