Cross origin communication between NGINX and spark Java - extjs

Question

I am using NGINX and sparkjava for my web application. I am sure I have enabled all CORS headers properly. Still, I am getting "XMLHttpRequest cannot load http://localhost:3003/platformAPI/login. Invalid HTTP status code 404" error.Below mentioned are my client and server methods from extjs and spark java respectively. I have inspected the network tab of my browser to get the response and request headers sent as well. They are also mentioned below. Any help to let me know as to what's wrong with my approach is highly appreciated :)
Client method from Nginx:
function(button, event, options){
var form = Ext.getCmp("LoginformId").getForm();
if (form.isValid()) {
var userJson = JSON.stringify(form.getFieldValues());
form.submit({
url: 'http://localhost:3003/platformAPI/login',
//headers : {'Content-Type':undefined,},
//dataType: 'jsonp',
success: function(form, action) {
// Ext.Msg.alert('Success', action.result.msg);
var sessionID=action.result.sessionID;
var clientName=action.result.clientName;
sessionStorage.setItem('sessionID',sessionID);
sessionStorage.setItem('clientName',clientName);
window.location="http://localhost:3000/";
},
failure: function(form, action) {
Ext.Msg.alert('Failed', action.result.msg);
}
});
}
}
Server Methods:
filter to enable CORS headers (Calling this in main)
private static void enableCORS(final String origin, final String methods, final String headers) {
before(new Filter() {
#Override
public void handle(Request request, Response response) {
response.header("Access-Control-Allow-Origin",request.headers("origin"));
response.header("Access-Control-Allow-Headers", "Origin, x-requested-with, content-type, Accept");
response.header("Access-Control-Request-Method", "GET,PUT,POST,DELETE,OPTIONS");
);
}
});
}
Login method:
post("platformAPI/login", "undefined",
(request, response) -> {
System.out.print("inside login");
JSONObject object1 = new JSONObject();
response.body(object1.put("success", true).toString());
return response;
});
Request and response headers:
Remote Address:127.0.0.1:3003
Request URL:http://localhost:3003/platformAPI/login
Request Method:OPTIONS
Status Code:404 Not Found
Response Headers
view source
Access-Control-Allow-Headers:Origin, x-requested-with, content-type, Accept
Access-Control-Allow-Origin:http://localhost:3000
Access-Control-Request-Method:GET,PUT,POST,DELETE,OPTIONS
Cache-Control:must-revalidate,no-cache,no-store
Content-Length:295
Content-Type:text/html; charset=ISO-8859-1
Server:Jetty(9.0.2.v20130417)
Request Headers
view source
Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:x-requested-with, content-type
Access-Control-Request-Method:POST
Connection:keep-alive
Host:localhost:3003
Origin:http://localhost:3000
Referer:http://localhost:3000/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.89 Safari/537.36

Answer 1

Try enable CORS in Spark-Java with the following snippet:
options("/*",
(request, response) -> {
String accessControlRequestHeaders = request
.headers("Access-Control-Request-Headers");
if (accessControlRequestHeaders != null) {
response.header("Access-Control-Allow-Headers",
accessControlRequestHeaders);
}
String accessControlRequestMethod = request
.headers("Access-Control-Request-Method");
if (accessControlRequestMethod != null) {
response.header("Access-Control-Allow-Methods",
accessControlRequestMethod);
}
return "OK";
});
before((request, response) -> {
response.header("Access-Control-Allow-Origin", "*");
});

Answer 2

Provided you must consider this point as well.
It will works with Postman because you are directly calling the server. There is no CORS involved here. But when you do it through javascript or angular etc.. CORS comes into play. So the requested url doesn't contain http scheme. You need to change localhost:portNumber/login to http://localhost:portNumber/login