jquery - ¿Por qué mis llamadas ajax son sincrónicas en la extensión de Chrome?

angularjs google-chrome-extension

Question

He estado tratando de usar algo de ajax en una extensión de cromo.

Tengo un script de contenido que se supone que debe agregar algún html a una página existente.

He intentado con JQuery.get , JQuery.load y ng-include .

Y todos ellos muestran una advertencia en la consola, diciéndome que synchronous XHR están en desuso (¿estos no son asincrónicos por naturaleza?). Y luego la página muestra este extraño comportamiento, me dice que algún Pusher no está definido, luego actualiza la página y elimina mi div insertado.

¿¿Qué podría estar mal??

Código de muestra: si habilito el primer var txt , funciona perfectamente. Si, en cambio, habilito el segundo var txt (comentado), falla.

 //this first line works perfectly
 var txt = ''<div id="myNewDiv" ng-controller="myController">{{testing}}</div>''; 

//this shows the warning and a really weird behavior
//var txt = ''<div id="myNewDiv" ng-controller="myController">{{testing}}<div ng-include="'' + "''myhtml.html''" + ''"></div></div>''; 


$(''#a-certain-div-in-the-page'').after(txt)

var app = angular.module(''myApp'', [])
    .controller(''myController'', function($scope) {
        $scope.testing = ''Welcome!'';
    });

angular.bootstrap(document, [''myApp'']);

Answer 1

Ok, esto es lo que sucede:

1 - El dominio de extensión es diferente del dominio de la página, por lo que intentó cargar cosas desde el dominio de la página, no desde los archivos de extensión. (Y el recurso no fue encontrado). El mensaje de advertencia es totalmente engañoso en este caso.

Solución: use chrome.extention.getURL(''myhtml.html'') para obtener la URL completa adecuada. O concatenar cadenas usando la ID de su extensión para crear una ruta completa.

 var txt = ''<div id="myNewDiv" ng-controller="myController">{{testing}}<div ng-include="'' + "''" + chrome.extension.getURL(''myhtml.html'') + "''" + ''"></div></div>''; 

2 - Incluso haciendo eso, también hay un problema de solicitud entre dominios. La página solo acepta solicitudes de su propio dominio, a menos que le otorgue los permisos correctos. Es necesario agregar en el archivo manifest.json el permiso para este recurso:

{
    "manifest_version": 2,

    ..... among many others ....

    "web_accessible_resources": [
        "myhtml.html"
    ]

}