Solicitud JSONP en la extensión de Chrome, la función de devolución de llamada no existe?

Question

Estoy haciendo una solicitud JSONP en una extensión de Chrome (script de contenido). Todo funciona muy bien cuando estoy ejecutando una página web, cargando el archivo HTML en mi navegador, pero cuando la cargo como una extensión de Chrome, la función de devolución de llamada jsonp creada por jquery no parece existir cuando el servidor responde .

Mi consola dice:

Uncaught ReferenceError: jQuery17105683612572029233_1323808231542 is not defined 

Aquí es mi petición ajax:

$.ajax({ 
    url: 'http://example.com', 
    data: 
    { 
     imgUrl: this.href, 
     returnString:true 
    }, 
    dataType: "jsonp", 
    success: function(msg){ 
     newNode.src = msg.data; 
    }, 
    error: function(msg){ 
     console.log(msg.data); 
    } 
}) 

Answer 1

La cuestión es que la respuesta JSONP está siendo capturado por la página real, fuera del código de JavaScript recinto de seguridad que el script de contenido de Chrome también te limita.

jQuery17105683612572029233_1323808231542 es el nombre de la función de devolución de llamada que la llamada jQuery JSONP generó dinámicamente para la llamada específica. Esta función se está definiendo en el área de espacio aislado al que tiene acceso el script de contenido.

La única solución que conozco, que funcionó para mí, es hacer una llamada XHR desde el script de contenido. A partir de Chrome 13, puede hacer que las llamadas XHR tengan dominios cruzados desde las secuencias de comandos de contenido (muy bien). En el archivo de manifiesto es necesario agregar la dirección URL externa de los permisos:

{ 
    ... 
    "permissions": [ 
     "http://example.com" 
    ] 
} 

A continuación, puede realizar la llamada XHR así:

var xhr = new XMLHttpRequest(); 
xhr.open("GET", "http://example.com/", true); 
xhr.onreadystatechange = function() { 
    if (xhr.readyState == 4) { 
     //handle the xhr response here 
    } 
} 
xhr.send(); 

Usted tendrá que hacer algunas de las cosas que jQuery estaba haciendo automáticamente por usted, como codificar los valores del objeto de datos en el XHR URL (en su caso, el "imrUrl" y "returnString"), así como convertir la respuesta del xhr.responeText o xhr.reponseXML en un objeto.

La desventaja de este enfoque es que si compartes este código entre una extensión de Chrome y algo más (como un bookmarklet) ahora tienes que tener una lógica diferente para el caso de uso de Chrome.

Para más información ver: Chrome Extension XHR