CORS - Cross-Domain AJAX Without JSONP By Allowing Origin On Server

Question

I have two separate apps on the same server, with the EmberJS one trying to do cross-domain calls to my backend API.

I set up my backend API to allow cross-domain requests from that specific origin. Is there a way however, to avoid using JSONP with such a set up? $.ajax is blocking cross-domain requests before they ever get sent. If not, what is the point of CORS, which server-side I had implemented to accept requests from my JS front-end source?

EDIT

AJAX request:

$.ajax({
    url: "api.lvh.me:3000/accounts/login",
    data: cred,
    type: "POST",
    xhrFields: {
        withCredentials: true
    },
    success: function(response){
        alert('succeeded!');
        console.log(response);
        alert(response);
    },
    failure: function(message){
        alert("failed");
        console.log(message);
        alert(message);
    }
});

Answer 1

There is no need to use JSONP if you enable CORS.

Access-Control-Allow-Origin: http://www.example.com

if this header is set in the response, then normal XmlHttpRequest will be able to access the response as if it is like same domain. Check whether this header is set correctly.

I hope that this link will help you if you are using jquery A CORS POST request works from plain javascript, but why not with jQuery?

Update: Example

var xmlhttp= new XMLHttpRequest();
var url="https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS?redirectlocale=en-US&redirectslug=HTTP_access_control";
xmlhttp.open("GET",url,false);
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
xmlhttp.send();

Try this in any domain, you will get response.

Update solution:

Request url without "http://" caused the problem, prepending "http://" solved the issue