2010-06-18 11 views
8

He agotado todas las avenidas de investigación para resolver esta, así que espero que alguien más piense en algo que simplemente no hice.

Configuración relativamente sencilla, tengo una página html con algunos javascript que hace una solicitud AJAX a un URL (en el mismo dominio) la aplicación web java en segundo plano hace sus cosas y devuelve una página html parcial (no html , etiquetas de cabeza o cuerpo, solo el contenido) que debe insertarse en un punto particular de la página.

Todo suena bastante fácil y el código que tengo funciona en IE, Firefox y Safari, pero no en Chrome. En Chrome, el elemento de destino simplemente termina vacío y si miro la solicitud de recursos en las herramientas de desarrollador de Chromes, el contenido de la respuesta también está vacío.

Todo muy confuso, he intentado infinidad de cosas para solucionarlo y me he quedado sin ideas. Cualquier ayuda sería muy apreciada.

var container = $('#container'); 

$.ajax({ 
    type: 'GET', 
    url: '/path/to/local/url', 
    data: data('parameters=value&another=value2'), 
    dataType: 'html', 
    cache: false, 
    beforeSend: requestBefore, 
    complete: requestComplete, 
    success: requestSuccess, 
    error: requestError 
}); 

function data(parameters) { 
    var dictionary = {}; 
    var pairs = parameters.split('&'); 
    for (var i = 0; i < pairs.length; i++) { 
     var keyValuePair = pairs[i].split('='); 
     dictionary[keyValuePair[0]] = keyValuePair[1]; 
    } 
    return dictionary; 
} 

function requestBefore() { 
    container.find('.message.error').hide(); 
    container.prepend('<div class="modal"><div class="indicator">Loading...</div></div>'); 
} 

function requestComplete() { 
    container.find('.modal').remove(); 
} 

function requestSuccess(response) { 
    container.empty(); 
    container.html(response); 
} 

function requestError(response) { 
    if (response.status == 200 && response.responseText == 'OK') { 
     requestSuccess(response); 
    } else { 
     container.find('.message.error').fadeIn('slow'); 
    } 
} 

Todo esto se ejecuta en un $ (documento) .ready (función() {});

Saludos, Jim

@Oleg - información adicional solicitada, un ejemplo de la respuesta que la llamada ajax podría recibir.

<p class="message error hidden">An unknown error occured while trying to 
retrieve data, please try again shortly.</p> 
<div class="timeline"> 
    <a class="icon shuttle-previous" 
rel="max_id=16470650733&page=1&q=something">Newer Data</a> 
    <a class="icon shuttle-next" 
rel="max_id=16470650733&page=3&q=something">Older Data</a> 
</div> 
<ol class="social"> 
    <li class="even"> 
     <div class="avatar"> 
      <img src="sphere_normal.gif"/> 
     </div> 
     <p> 
      Some Content<br/> 
      <span class="published">Jun 18, 2010 11:29:05 AM</span> - <a 
target="_blank" href="">Direct Link</a> 
     </p> 
    </li> 
    <li class="odd"> 
     <div class="avatar"> 
      <img src="sphere_normal.gif"/> 
     </div> 
     <p> 
      Some Content<br/> 
      <span class="published">Jun 18, 2010 11:29:05 AM</span> - <a 
target="_blank" href="">Direct Link</a> 
     </p> 
    </li> 
</ol> 
<div class="timeline"> 
    <a class="icon shuttle-previous" 
rel="max_id=16470650733&page=1&q=something">Newer Data</a> 
    <a class="icon shuttle-next" 
rel="max_id=16470650733&page=3&q=something">Older Data</a> 
</div> 
+0

¿Está ejecutando este local? –

+0

Sí Nick todo esto se está ejecutando bajo una aplicación web Java y lo está en mi máquina local en este momento como http: // localhost: 8090/ – roguepixel

+3

@roguepixel - Para una prueba rápida, intente ejecutar Chrome con un '--disable -web-security' opción en la línea de comandos, el mismo resultado? –

Respuesta

1

Tomé su código fuente y configuré una situación de prueba rápida pero no puedo replicar su problema. Me funciona bien tanto en Firefox (3.6.3) como en Chrome (5.0.375.70). Lo intenté tanto localmente como en un servidor remoto.

Por lo tanto, es probable que su código no sea culpable. Pero también creo que generalmente no es un problema relacionado con Chrome.

Other people parecen haber encontrado esto sin embargo. Sin embargo, cambiar el tipo de contenido no tuvo ningún efecto en mi escenario de prueba. Incluso funciona cuando configuro Content-Type en image/jpeg.

En el JQuery forums alguien indicó un comportamiento diferente dependiendo de si ejecuta su aplicación localmente o en un servidor remoto. Si este fue el caso para usted, puede comparar los encabezados de solicitud y respuesta HTTP para rastrear el problema.

+0

Gracias por su opinión, echaré un vistazo más a los encabezados de solicitud y respuesta. – roguepixel

2

Acabo de resolver un problema similar, y pensé en publicar mi solución en caso de que sea de utilidad para cualquier otra persona.

Solo Firefox y Chrome mostraban una respuesta ajax vacía, por lo que parecía ser un problema de dominio cruzado, pero todo estaba en el mismo dominio.

Resultó que el 'www.', Que había codificado de manera superfluo y estúpidamente en mi url ajax era el culpable. Si hubiera estado usando un camino relativo, todo habría estado bien.

Tenía mi sitio de prueba abierto en ese momento en particular como "http://domain.com", sin 'www.', Por lo que Firefox y Chrome lo trataron como un dominio diferente. Navegando a "http://www.domain.com" resultó que la llamada ajax funcionaba en todos los navegadores.

Por lo tanto, teniendo en cuenta que usted escribió:

url: '/ ruta/a/local/url'

..como es la convención cuando no queremos revelar nuestros caminos, no pude evitar preguntarme si de hecho habías escrito un camino absoluto, tal como lo hice ...?

+0

¡Me salvaste el día! Sólo traté AJAX llamada en Chrome 8.0.552.237
- con una ruta relativa "bin/test.php" (el servidor está en mi red local) -> se está trabajando muy bien
- con una ruta absoluta "http : //192.168.0.101/bin/test.php "(el servidor está en mi red local) -> ¡NO funciona!

¡Gracias! – Stan

Cuestiones relacionadas