Why am I seeing an “origin is not allowed by Acces

Question

This question already has an answer here:

• XMLHttpRequest cannot load XXX No 'Access-Control-Allow-Origin' header 6 answers

I am seeing the following error:

Origin http://localhost:8080 is not allowed by Access-Control-Allow-Origin

with this code:

var http = new getXMLHttpRequestObject();
var url = "http://gdata.youtube.com/action/GetUploadToken";
var sendXML = '<?xml version="1.0"?><entry xmlns="http://www.w3.org/2005/Atom"'+
    'xmlns:media="http://search.yahoo.com/mrss/'+
    'xmlns:yt="http://gdata.youtube.com/schemas/2007">'+
    '<media:group><media:title type="plain">My First API</media:title>'+
    '<media:description type="plain">First API</media:description>'+
    '<media:category scheme="http://gdata.youtube.com/schemas/2007/categories.cat">People</media:category>'+
    '<media:keywords>first, api</media:keywords></media:group></entry>';
http.open("POST", url, true);
http.setRequestHeader("Authorization", "AuthSub token=" + AccessToken);
http.setRequestHeader("X-GData-Key", "key="+ dev_key);
http.setRequestHeader("Content-Type", "application/atom+xml; charset=UTF-8");

http.onreadystatechange = function() {
    if(http.readyState == 4) {
        alert(http.responseXML);
    }
}
http.send(sendXML);

What can cause this, and how do I solve it?

Answer 1

if you re using google chrome as a browser you can add CORS extension, and activate it , it will solve the hole problem without having to change anything in your code

Answer 2

Add a global.asax in your solution.

Add

HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");

in

protected void Application_BeginRequest(object sender, EventArgs e)
{
}

Answer 3

For local development you can use a tool for modifying the HTTP response headers. For example Charles is able to do this by the included rewrite tool: Rewrite Tool

Just add a new rule for the target domain/location with:

Type: Add Header
Where: Response
Replace
     Name: Access-Control-Allow-Origin
     Value: *
Replace All

Answer 4

If your using apache, this works: put this in/create a .htaccess file in your public root, and add any other file extensions you might need.

<FilesMatch "\.(ttf|otf|eot|woff|jpg|png|jpeg|gif|js|json|html|css)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>

Answer 5

If you are using Chrome, a simple workaround (only for development purposes) is to use option --disable-web-security.

Answer 6

XMLHttpRequest will not let you reach localhost:8080 because of the "same origin policy".

You can allow requests from modern browsers by adding a header to your response on localhost:8080:

Access-Control-Allow-Origin: *

You can do so by adding directives to your HTTP server or adding headers via server-side code (PHP, Ruby, ...).

Read more on Cross-Origin ajax requests on https://developer.mozilla.org/en/http_access_control