CORS error with jquery

An important note for those newer coders is that everything on http://enable-cors.org/server.html assumes you have a server running. If you're new, like I was originally, these type of answers don't help.

If you've just made some code on your computer, CodePen, etc - you can't configure this.

There's an important difference between server-side and client-side scripting - your jquery is running on the client side (that is, the users computer / browser) and as such there's no such thing as setting the headers there.

I finally started making progress with this issue when I set up my own server and my own PHP files (PHP is server-side, as such its processed on the server - not the browser) and was able to start making requests just fine.

Adding this for anyone who is being drowned in answers involving the "Header set Access-Control-Allow-Origin "*" answer. It really frustrated me when I started as well.

CORS (Cross-Origin Resource Sharing) is an HTML5 feature that allows one site to access another site’s resources despite being under different domain names.

The W3C specification for CORS actually does a pretty good job of providing some simple examples of the response headers, such as the key header, Access-Control-Allow-Origin, and other headers that you must use to enable CORS on your web server.

If you are looking for specific information on how set up CORS on a variety of common web servers, check out the Enable CORS sharing website. http://enable-cors.org/

Based on the URL that you have given above, I don't think you have a control on that server. Thus, it will simply would not work.

Even though you have enabled crossDomain: true the server should return you required headers such as:

Here’s a valid server response; the CORS-specific headers are bolded

HTTP Response:

Access-Control-Allow-Origin: http://xyzcom Access-Control-Allow-Credentials: true Access-Control-Expose-Headers: FooBar Content-Type: text/html; charset=utf-8 

One thing you can try is this:

$.ajax({ headers: { "Accept": "application/json"}, type: 'GET', url: 'http://cl.ly/2wr4', crossDomain: true, beforeSend: function(xhr){ xhr.withCredentials = true; }, success: function(data, textStatus, request){ console.log(data); } }); 

Otherwise, you need to contact API provider.

to fix the error, you need to enable CORS on the server. The client expects to see CORS headers sent back in order to allow the request. It might even send a preflight request to make sure that the headers are there.

You can enable CORS server side for one, multiple, or all domains hitting your server. The configuration is different depending on the type of your server.

Refer to the following page for more info : http://enable-cors.org/server.html

You already enabled CORS requests in your request above, so client side you should be all set.