¿Por qué veo un error de “origen no permitido por Access-Control-Allow-Origin” aquí?

Estoy viendo el siguiente error:

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

con este código:

 var http = new getXMLHttpRequestObject(); var url = "http://gdata.youtube.com/action/GetUploadToken"; var sendXML = ''+ 'My First API'+ 'First API'+ 'People'+ 'first, api'; 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); 

¿Qué puede causar esto y cómo lo resuelvo?

Javascript está limitado cuando se realizan solicitudes ajax fuera del dominio actual.

  • Ej. 1: su dominio es example.com y desea hacer una solicitud a test.com => no puede.
  • Ej 2: su dominio es example.com y desea hacer una solicitud a inner.example.com => no puede.
  • Ej 3: su dominio es example.com:80 y quiere hacer una solicitud a example.com:81 => no puede
  • EX 4: su dominio es example.com y desea hacer una solicitud a example.com => puede hacerlo.

Javascript está limitado por la “misma política de origen” por razones de seguridad, de modo que una secuencia de comandos maliciosa no puede contactar a un servidor remoto y enviar datos confidenciales.

jsonp es una forma diferente de usar javascript. Realiza una solicitud y los resultados se encapsulan en una función de callback que se ejecuta en el cliente. Es lo mismo que vincular una nueva etiqueta de script en la parte principal de su html (usted sabe que puede cargar scripts de dominios diferentes a los suyos aquí).
Sin embargo, para usar jsonp, el servidor debe estar configurado correctamente. Si este no es el caso, no puede usar jsonp y DEBE confiar en un proxy del lado del servidor (PHP, ASP, etc.). Hay muchas guías relacionadas con este tema, ¡solo googlealo!

XMLHttpRequest no le permitirá llegar a localhost:8080 debido a la “misma política de origen”.

Puede permitir solicitudes de navegadores modernos agregando un encabezado a su respuesta en localhost:8080 :

 Access-Control-Allow-Origin: * 

Puede hacerlo agregando directivas a su servidor HTTP o agregando encabezados a través del código del lado del servidor (PHP, Ruby, …).

Obtenga más información sobre las solicitudes de ajax de origen cruzado en https://developer.mozilla.org/en/http_access_control

Si está utilizando Chrome, una solución simple (solo para fines de desarrollo) es usar la opción --disable-web-security .

Agregue un global.asax en su solución.

Añadir

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

en

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

Si está usando apache, esto funciona: ponga esto en / cree un archivo .htaccess en su raíz pública, y agregue cualquier otra extensión de archivo que pueda necesitar.

   Header set Access-Control-Allow-Origin "*"   

Para el desarrollo local, puede usar una herramienta para modificar los encabezados de respuesta HTTP. Por ejemplo, Charles puede hacer esto con la herramienta de reescritura incluida: Rewrite Tool

Simplemente agregue una nueva regla para el dominio / ubicación objective con:

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

Si está usando Google Chrome como navegador, puede agregar la extensión CORS y activarla, resolverá el problema del agujero sin tener que cambiar nada en su código

Aquí, tenemos que hacer dos cosas para Apache Http

1) En el archivo httpd.config, descomenta este archivo

 LoadModule headers_module modules/mod_headers.so 

2) Agregue esta línea en la parte inferior.

 Header set Access-Control-Allow-Origin "*" 

No relacionado con esta pregunta en particular, pero para cualquier persona en esta situación que use jQuery … Este error también se produce si intenta hacer una solicitud JSONP usando jQuery y omite el parámetro de callback mágica: callback=?

Si eres de origen java, una posible solución podría ser crear un servlet que llame a los servicios web para tu javascript. algo así como el siguiente código en el método GET (Your-choice) …

 JsonElement jelement; JsonArray jarray; try { URL url = new URL("http://rest."YOUR URL"#ba0482"); URLConnection connection = url.openConnection(); connection.setDoInput(true); InputStream inStream = connection.getInputStream(); BufferedReader input = new BufferedReader(new InputStreamReader(inStream)); jelement = new JsonParser().parse(input); jarray = jelement.getAsJsonArray(); response.setContentType("application/json"); PrintWriter out = response.getWriter(); out.print(jarray); out.flush(); } catch (FileNotFoundException e) { e.printStackTrace(); } catch (IOException e) { e.printStackTrace(); } } 

¡Ahora en javascript simplemente especifica el url como el nombre del servlet!

Me encuentro con el mismo mensaje de error cuando uso ajax para acceder a una página php (los archivos javascript y php están ubicados en el mismo servidor).

La razón fue que especifiqué la dirección IP como el dominio en mi JavaScript. Esto hizo que el navegador creyera que la llamada al archivo php está en otro servidor.

Entonces, una solución fácil para deshacerse de este mensaje de error. a) verifique que el javascript y el archivo php estén en el mismo servidor b) asegúrese de que la URL (en particular el dominio) en su JavaScript (por ejemplo, http://www.smartana.co.uk/myJavaScript.js ) ajax refleje su URL del servidor (por ejemplo, http://www.smartana.co.uk/myServer.php ).