CODEWITHSUNDEEP
javascriptjavaajaxcorsdropwizard
Roy Justin
Roy Justin

Reputation: 663

Response for preflight has invalid HTTP status code 400

I'm trying to make a REST call (POST) using AJAX. This is my AJAX code

<script>
var settings = {
"async": true,
"crossDomain": true,
"dataType": "json",
"url": "http://localhost:port/service/myservice",
"method": "POST",
"data": '{jsondata}',
"headers": {
      "accept": "application/json",
      "Authorization": "authValue"
  }
}

$.ajax(settings)

.done(function (response) {
  console.log(response);
});
</script>

Initially I got this error: XMLHttpRequest cannot load http://localhost:port/service/myservice. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 400.

To resolve this issue I added the following code in my dropwizard application

Dynamic filter = env.servlets().addFilter("CORS", CrossOriginFilter.class);

filter.setInitParameter(CrossOriginFilter.ALLOWED_METHODS_PARAM, "GET,PUT,POST,DELETE,OPTIONS");
filter.setInitParameter(CrossOriginFilter.ALLOWED_ORIGINS_PARAM, "*");
    filter.setInitParameter(CrossOriginFilter.ACCESS_CONTROL_ALLOW_ORIGIN_HEADER, "*");
filter.setInitParameter("allowedHeaders", "Content-Type,Authorization,X-Requested-With,Content-Length,Accept,Origin");
filter.setInitParameter("allowCredentials", "true");

filter.addMappingForUrlPatterns(EnumSet.allOf(DispatcherType.class), true, "/*");

After adding this my initial exception went away, but I'm getting the following exception: XMLHttpRequest cannot load http://localhost:port/service/myservice. Response for preflight has invalid HTTP status code 400

Is this issue related to CORS? What am I doing wrong here?

UPDATE

After doing more debugging I found this behavior. When sending the request without the Authorization header I'm getting 415 (Unsupported Media Type) error.

I think something wrong with my AJAX code, can someone please help me find the issue? Thanks.

Upvotes: 5

Views: 18947

Answers (3)

srinivas
srinivas

Reputation: 5098

if you need to pass JSON data in the AJAX call, you need to specify content-type as json/application, so the server knows you are trying to send JSON data. But that will change the default content-type of the call and the call will qualify for pre-flight checking, which need proper CORS enabled client & server request.

For easier use case, do not use JSON.stringify() when you pass data, just make a simple string with {key:value, key:value, ...} format, and pass the string as the data. The Ajax call serializes the data by default and does the right thing, and the call stays as a single POST call to the server, where as the pre-flight mode is two calls.

Upvotes: 0

Siva Shibhi
Siva Shibhi

Reputation: 67

You may try here mentioned as complete answer in this thread.

$.ajax({
        type:"POST",
        beforeSend: function (request)
        {
            request.setRequestHeader("Authority", authValue);
        },
        url: "http://localhost:port/service/myservice",
        data: "json=" + escape(JSON.stringify(createRequestObject)),
        processData: false,
        success: function(msg) {
            $("#results").append("The result =" + StringifyPretty(msg));
        }
});

Upvotes: 1

Natural Lam
Natural Lam

Reputation: 742

try to add the following to your settings?

xhrFields: { withCredentials: true }

Upvotes: 0

Related Questions