Minha extensão do Firefox para injetar CSS não funciona

Question

Estou ocupado desenvolvendo uma extensão do Firefox.Estou usando o Add-on Builder

O que fará:

1. Obtenha um ID de uma página PHP (XMLHttpRequest)

2. Chame outra função e envie esse ID com ela

3. Essa função insere CSS com uma tag de link criada por javascript

Meu problema:

Não vai funcionar.Se eu alertar a variável currenttheme, nada acontece.Portanto, o XMLHttpRequest parece não funcionar.

Meu código:

principal.js:

var Widget = require("widget").Widget;
var tabs = require('tabs');
exports.main = function() {
var pageMod = require("page-mod");
var data = require("self").data;
scriptFiles = data.url("s.js");
pageMod.PageMod({
include: "*.facebook.com",
contentScriptWhen: 'ready',
contentScriptFile: scriptFiles
});

s.js

function addCSS(theTheme) {
var s = document.createElement('link');
s.type = 'text/css';
s.rel = 'stylesheet';
s.href = theTheme+'.css';
(document.head||document.documentElement).appendChild(s);
}

function getData() {
                client = new XMLHttpRequest();
                try{
                    client.open('GET','http://localhost:8888/istyla/login/popuplogin/myaccount.php');                   
                } catch (e){
                alert( "error while opening " + e.message );
            }

            client.onreadystatechange = function(){
                if (client.readyState ==4){
                        user_data = client.responseText;
                        window.user_data = user_data;
                        var currenttheme = user_data;
                        window.currenttheme = currenttheme;
                        addCSS(currenttheme);
                }
            }

            client.send(null);
}

getData();

P.S.O arquivo CSS está na pasta de dados.

Answer 1

Os scripts de conteúdo são executados com os privilégios da página em que estão.Então, se a página não tiver permissão para carregar http://localhost/, seu script de conteúdo também não será capaz de fazer isso.Você não recebe um erro imediato devido a CORS mas a solicitação falhará mesmo assim.O que você precisa fazer é enviar uma mensagem para main.js para que ele faça a solicitação (o código de extensão pode solicitar qualquer URI) e envie os dados de volta para o script de conteúdo.

Answer 2

Sou muito novo nisso, então não tenho certeza se posso ajudar.Você deu uma olhada no console de erros (ctrl+shift+j) se está reclamando de alguma coisa?Você pode console.log() e ele será exibido aqui.

Talvez use o Solicitar lib em vez de XMLHttpRequest

Aqui está um trecho do meu código:

var Request = require("request").Request;

getUserDetails : function(userID, callback)
{
   Request({
      url: Proxy.remoteUrl,
      content : {command:'getUser',UserID:userID},
      onComplete: function(response) {callback(response.json)}
   }).get();

}

Answer 3

Como dito, o script de conteúdo tem os mesmos privilégios da página web onde está anexado, ou seja, você está sob o controle Política de Mesma Origem.

Você pode resolver o problema conforme sugerido, então envie uma mensagem para o código add-on (que não é restrito pelo SOP) e poste o resultado de volta no script de conteúdo.

Aqui está um exemplo de como o código poderia ser: https://groups.google.com/d/topic/mozilla-labs-jetpack/VwkZxd_mA7c/discussion