Come iniettare CSS usando il file di script del contenuto nell’estensione di Chrome?

Sto cercando di iniettare il mio CSS da JavaScript che viene iniettato come script di contenuto:

"content_scripts": [ { "matches": ["http://www.google.com/*"], "js": ["script.js"] } ], 

Ho trovato una domanda simile sull’iniezione di CSS, ma ho riscontrato un problema durante l’utilizzo del codice dalla risposta accettata . Ecco i miei contenuti script.js :

 var link = document.createElement("link"); link.href = chrome.extension.getURL("style.css"); link.type = "text/css"; link.rel = "stylesheet"; document.getElementsByTagName("head")[0].appendChild(link); 

Dopo aver caricato una pagina, questo messaggio viene visualizzato nella console:

Negare il carico dell’estensione chrome: //phkgaaiaakklogbhkdnpjncedlbamani/fix.css. Le risorse devono essere elencate nella chiave manifest web_accessible_resources per essere caricate da pagine esterne all’estensione.

C’è un modo per risolvere questo problema? O forse un altro modo per iniettare un CSS da quel file JavaScript?

Nota: non posso includere il foglio di stile direttamente da manifest.

È ansible aggiungere al campo delle autorizzazioni del manifest; Vedi web_accessible_resources . Quindi dovresti aggiungere questo al manifest:

  , "web_accessible_resources": [ "fix.css" ] 

Vedi anche “Iniezione programmatica” . e insertCSS() .

Per la maggior parte delle applicazioni, dimentica tutto ciò che createElement codice createElement e aggiungi semplicemente il file CSS al manifest:

 "content_scripts": [ { "matches": ["http://www.google.com/*"], "css": ["fix.css"], "js": ["script.js"] } ], 

anche se capisco che non vuoi farlo in questa esatta istanza.