resource - no access control allow origin header is present jquery ajax origin

Error de Access-Control-Allow-Origin al enviar un jQuery Post a la API de Google

Question

Leí mucho por el error ''Access-Control-Allow-Origin'', pero no entiendo lo que tengo que arreglar :(

Estoy jugando con Google Moderator API, pero cuando trato de agregar una nueva serie , recibo:

XMLHttpRequest cannot load 
https://www.googleapis.com/moderator/v1/series?key=[key]
&data%5Bdescription%5D=Share+and+rank+tips+for+eating+healthily+on+the+cheaps!
&data%5Bname%5D=Eating+Healthy+%26+Cheap
&data%5BvideoSubmissionAllowed%5D=false. 
Origin [my_domain] is not allowed by Access-Control-Allow-Origin.

Intenté con y sin parámetro de devolución de llamada, intenté agregar ''Access-Control-Allow-Origin *'' al encabezado. Y no sé cómo usar $ .getJSON aquí, si corresponde, porque tengo que agregar el encabezado Authorization y no sé cómo hacerlo sin beforeCall desde $ .ajax: /

Cualquier luz para esta oscuridad uu?

Ese es el código:

<script src="http://www.google.com/jsapi"></script>

<script type="text/javascript">

var scope = "https://www.googleapis.com/auth/moderator";
var token = '''';

function create(){
     if (token == '''')
      token = doCheck();

     var myData = {
      "data": {
        "description": "Share and rank tips for eating healthily on the cheaps!", 
        "name": "Eating Healthy & Cheap", 
        "videoSubmissionAllowed": false
      }
    };

    $.ajax({

        url: ''https://www.googleapis.com/moderator/v1/series?key=''+key,
        type: ''POST'',
        callback: ''?'',
        data: myData,
        datatype: ''application/json'',
        success: function() { alert("Success"); },
        error: function() { alert(''Failed!''); },
        beforeSend: setHeader

    });
}

function setHeader(xhr) {

  xhr.setRequestHeader(''Authorization'', token);
}

function doLogin(){ 
    if (token == ''''){
       token = google.accounts.user.login(scope);
    }else{
       alert(''already logged'');
    }
}


function doCheck(){             
    token = google.accounts.user.checkLogin(scope);
    return token;
}
</script>
...
...
<div data-role="content">
    <input type="button" value="Login" onclick="doLogin();">
    <input type="button" value="Get data" onclick="getModerator();">
    <input type="button" value="Create" onclick="create();">
</div><!-- /content -->

Answer 1

En mi caso, el nombre del subdominio causa el problema. Aquí hay detalles

app_development.something.com , aquí el app_development.something.com ( _ ) subdominio está creando error CORS. Después de cambiar app_development a app-development , funciona bien.

Answer 2

Sí, en el momento en que jQuery ve que la URL pertenece a un dominio diferente, asume esa llamada como una llamada de dominio cruzado, por lo tanto, el dominio crossdomain:true no es necesario aquí.

Además, es importante tener en cuenta que no puede realizar una llamada síncrona con $.ajax si su URL pertenece a un dominio diferente (dominio cruzado) o si está utilizando JSONP. Solo se permiten llamadas asincrónicas.

Nota: puede llamar al servicio de forma síncrona si especifica async:false con su solicitud.

Answer 3

Si tiene este error tratando de consumir un servicio que no puede agregar el encabezado Access-Control-Allow-Origin * en esa aplicación, pero puede poner delante del servidor un proxy inverso, el error puede evitarse con un encabezado volver a escribir.

Asumiendo que la aplicación se está ejecutando en el puerto 8080 (dominio público en www.midominio.com ), y coloca el proxy inverso en el mismo host en el puerto 80, esta es la configuración para el proxy inverso de Nginx :

server {
    listen      80;
    server_name www.mydomain.com;
    access_log  /var/log/nginx/www.mydomain.com.access.log;
    error_log   /var/log/nginx/www.mydomain.com.error.log;

    location / {
        proxy_pass   http://127.0.0.1:8080;
        add_header   Access-Control-Allow-Origin *;
    }   
}

Answer 4

Tenía exactamente el mismo problema y no era un dominio cruzado, sino el mismo dominio. Acabo de agregar esta línea al archivo php que manejaba la solicitud ajax.

<?php header(''Access-Control-Allow-Origin: *''); ?>

Funcionó a las mil maravillas. Gracias al cartel

Answer 5

Resolví el error de Access-Control-Allow-Origin al modificar el parámetro dataType a dataType: ''jsonp'' y agregué un crossDomain: true

$.ajax({

    url: ''https://www.googleapis.com/moderator/v1/series?key=''+key,
    data: myData,
    type: ''GET'',
    crossDomain: true,
    dataType: ''jsonp'',
    success: function() { alert("Success"); },
    error: function() { alert(''Failed!''); },
    beforeSend: setHeader
});