Estoy tratando de conseguir algunos datos json de una «distancia» del sitio web.
Tengo mi web en el 99000 del puerto, me lanzamiento de mi sitio web en la 99001 puerto (http://localhost:99001/index.html).

Me sale el siguiente mensaje:

    XMLHttpRequest cannot load http://localhost:99000/Services.svc/ReturnPersons. Origin http://localhost:99001 is not allowed by Access-Control-Allow-Origin.

Incluso Si puedo iniciar mi página web como un archivo HTML, me sale esto:

    XMLHttpRequest cannot load http://localhost:99000/Services.svc/ReturnPersons.Origin null is not allowed by Access-Control-Allow-Origin.

El servicio web devuelve los datos. Yo intente coger los elementos de datos como este:

var url = "http://localhost:99000/Services.svc/ReturnPersons";
$.getJSON(url, function (data) {
success: readData(data)
});
function readData(data) {
    alert(data[0].FirstName);
}

Y estoy tratando de llegar a esta estructura:

[{"FirstName":"Foo","LastName":"Bar"},{"Hello":"Foo","LastName":"World"}]

¿Sabes por qué estoy recibiendo este error?

InformationsquelleAutor Zakaria | 2010-09-30

5 Comentarios

  1. 39

    Usted no puede hacer un XMLHttpRequest crossdomain, la «opción» sólo sería una técnica llamada JSONP, que se reduce a esto:

    Para iniciar la solicitud: Agregar un nuevo <script> etiqueta con la url remota y, a continuación, asegúrese de que la url remota devuelve un válido archivo javascript que se llama a la función de devolución de llamada. Algunos de los servicios de apoyo a este (y dejar el nombre de su devolución de llamada en OBTENER los parámetros).

    El otro camino más fácil, sería la creación de un «proxy» en su servidor local, el cual se presenta la solicitud remota y, a continuación, sólo «forwards» de vuelta a tu javascript.

    editar/además:

    Veo jQuery tiene soporte incorporado para JSONP, mediante la comprobación de si la URL contiene «callback=?» (donde jQuery va a reemplazar ? con el actual método de devolución de llamada). Pero usted todavía necesita para el proceso que en el servidor remoto a generar una respuesta válida.

    • He resuelto el problema mediante la adición de la «&callback=?» a la URL. Gracias!
    • ¿Tengo que especificar e implementar nada en el script de servidor en el servidor remoto?
    • Sí, donde su servidor normalmente devuelve una cadena JSON, por ejemplo, {"foo": "bar"} usted necesita para envolver la cadena json en un método de devolución de llamada (función de javascript) que se encarga de la respuesta en json. por ejemplo, myFunction({"foo": "bar"});
    • Charles Hoja, en realidad usted es incorrecto. Hay otra «opción», que se llama CORS. Checkout cómo habilitar aquí: enable-cors.org
    • Tienes razón portforwardpodcast, pero cuando esta pregunta se pidió originalmente en 2010 CORS era menos popular de la elección (para ser justos: uno en el que yo nunca había oído hablar de aquel entonces) y mientras IE6 apoyo ha sido abandonado por la mayoría, todavía hay una demanda para apoyar IE7 que no admite el CORS y la IE8 sólo la admite parcialmente. Así que dependiendo de sus requisitos este es un muy válido (y mejor) opción sí.
  2. 34

    En nueva jQuery 1.5 puede utilizar:

    $.ajax({
        type: "GET",
        url: "http://localhost:99000/Services.svc/ReturnPersons",
        dataType: "jsonp",
        success: readData(data),
        error: function (xhr, ajaxOptions, thrownError) {
          alert(xhr.status);
          alert(thrownError);
        }
    })
    • No debe ser sólo el «éxito: readData»?
    • Tengo un error como SyntaxError: testigo Inesperado :
    • estoy adivinando que es extra «:» en su respuesta. podrías pegar todo el mensaje ?
  3. 19

    Jugar con 3 soluciones de trabajo en acción.

    Dado externo JSON:

    myurl = 'http://wikidata.org/w/api.php?action=wbgetentities&sites=frwiki&titles=France&languages=zh-hans|zh-hant|fr&props=sitelinks|labels|aliases|descriptions&format=json'

    Solución 1: $.ajax() + jsonp:

    $.ajax({
      dataType: "jsonp",
      url: myurl ,
      }).done(function ( data ) {
      //do my stuff
    });

    Solución 2: $.ajax()+json+&calback=?:

    $.ajax({
      dataType: "json",
      url: myurl + '&callback=?',
      }).done(function ( data ) {
      //do my stuff
    });

    Solución 3: $.getJSON()+calback=?:

    $.getJSON( myurl + '&callback=?', function(data) {
      //do my stuff
    });

    Documentación: http://api.jquery.com/jQuery.ajax/ , http://api.jquery.com/jQuery.getJSON/

    • JSfiddle fijo siguientes #wikidata cambios en el API, jsfiddle de mejoramiento de hecho, la redacción de mejoramiento de hecho !
    • No trabajo en HTTPS. haga Clic en el enlace para ver jsfiddle.net/HNPyc/98
    • cuando usted está en https de violín usted puede pedir a los http de wikidata o demás http, sería una violación de la seguridad. Usted puede hacer http http, https https o http, https, no de https a http. Esta es una característica de seguridad, no una cruz de dominio en cuestión.
  4. 6

    Encontrado una posible solución que no creo que fue mencionado.

    Aquí es una buena descripción del problema:
    http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api

    Básicamente, mientras que el uso de los formularios/url codificada de texto llano de los tipos de contenido que están bien.

    $.ajax({
        type: "POST",
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'text/plain'
        },
        dataType: "json",
        url: "http://localhost/endpoint",
        data: JSON.stringify({'DataToPost': 123}),
        success: function (data) {
            alert(JSON.stringify(data));
        }
    });     

    Yo lo uso con ASP.NET WebAPI2. Así que en el otro extremo:

    public static void RegisterWebApi(HttpConfiguration config)
    {
        config.MapHttpAttributeRoutes();
    
        config.Formatters.Clear();
        config.Formatters.Add(new JsonMediaTypeFormatter());
    
        config.Formatters.JsonFormatter.SupportedMediaTypes.Add(new MediaTypeHeaderValue("text/plain"));
    }

    De esta manera Json formateador se utiliza cuando el análisis de contenido de texto sin formato tipo.

    Y no olvidar en la Web.config:

    <system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Methods" value="GET, POST" />
      </customHeaders>
    </httpProtocol>    

    Espero que esto ayude.

  5. 0

    Estoy usando WebAPI 3 y se enfrenta el mismo problema. El problema ha resolver como @Rytis añadido a su solución. Y creo que en WebAPI 3, no necesitamos definir el método de RegisterWebApi.

    Mi cambio fue sólo en la web.fichero de configuración y el trabajo.

    <httpProtocol>
     <customHeaders>
     <add name="Access-Control-Allow-Origin" value="*" />
     <add name="Access-Control-Allow-Methods" value="GET, POST" />
    </customHeaders>
    </httpProtocol> 

    Gracias por la solución de @Rytis!

Dejar respuesta

Please enter your comment!
Please enter your name here