J'essaie d'ajouter un div à la page de l'onglet actif actuel. Cependant, je reçois cette erreur:
Error during tabs.executeScript: Cannot access contents of url ....
Extension manifest must request permission to access this Host.
Mon code: (show_loader.js)
var dv = document.createElement('div');
dv.id = 'myid';
dv.innerHTML = 'test';
document.body.appendChild(dv);
Cependant quand je mets ce code:
document.body.style.backgroundColor = 'green';
Cela fonctionne comme prév et la couleur d'arrière-plan de l'onglet actuel est modifiée sans autre changement, sauf pour le code du fichier show_loader.js qui est exécuté à partir de popup.js comme ceci:
chrome.tabs.executeScript(null, {file: "show_loader.js"});
Mon fichier manifeste contient également:
"permissions":
[
"tabs",
"notifications",
"http://*/",
"https://*/"
],
Je me demande donc pourquoi cela donne l'erreur ci-dessus lorsque j'essaie de faire autre chose que de définir la couleur d'arrière-plan. Même simple alert
ou console.log
seul sur cette page donne la même erreur mentionnée ci-dessus.
Comment y remédier?
Manifeste:
{
... name and description ...
"icons":
{
"16" : "img/icon.png",
"48" : "img/48.png",
"128" : "img/128.png"
},
"permissions":
[
"tabs",
"notifications",
"http://*/*",
"https://*/*"
],
"browser_action":
{
"default_icon": "img/icon.png",
"default_title": "Page title",
"default_popup": "popup.html"
}
}
popup.js
// send data to server for saving
$('#btn').click(function(){
chrome.tabs.executeScript(null, {file: "show_loader.js"});
$loader.show();
var data = $(this).closest('form').serialize();
$.ajax({.....});
});
window.onload = function(){
var $loader = $('#loader');
$loader.show();
chrome.tabs.getSelected(null, function(tab) {
//console.log(tab);
$('#url').val(tab.url);
$('#title').val(tab.title);
$loader.hide();
});
};
popup.html
<html>
<head>
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<form action="" method="post" name="frm" id="frm">
<table border="0" cellpadding="3" cellspecing="0" width="370">
......
</table>
</form>
<script src='js/jquery.js'></script>
<script src='popup.js?v=014423432423'></script>
</body>
</html>
show_loader.js
console.log($); // doesn't work
// document.body.style.backgroundColor = 'green'; // WORKS
Code qui a fonctionné
{
"name": "Manifest Permissions",
"description": "http://stackoverflow.com/questions/14361061/extension-manifest-must-request-permission-to-access-this-Host",
"version": "1",
"manifest_version": 2,
"browser_action": {
"default_popup": "popup.html"
},
"permissions": [
"tabs",
"notifications",
"http://*/",
"https://*/"
]
}
<html>
<head>
<script src="back.js"></script>
</head>
<body>
<button id="tmp-clipboard">Click Me</button>
</body>
</html>
document.addEventListener("DOMContentLoaded", function () {
document.getElementById('tmp-clipboard').onclick = function () {
chrome.tabs.executeScript(null, {
file: "script.js"
});
}
});
var dv = document.createElement('div');
dv.id = 'myid';
dv.innerHTML = 'test';
document.body.appendChild(dv);
Essayez d'éliminer obsolète chrome.tabs.getSelected
à partir de votre code et utilisez chrome.tabs.query à la place.
chrome.tabs.query({
"currentWindow": true,
"status": true,
"active": true //Add any parameters you want
}, function (tabs) {//It returns an array
for (tab in tabs) {
//Do your stuff here
}
});
Si vous avez l'intention de capturer l'onglet de navigation active dans la fenêtre actuelle où il a cliqué sur browser action
utilisez ce code
chrome.tabs.query({
"currentWindow": true,//Filters tabs in current window
"status": "complete", //The Page is completely loaded
"active": true // The tab or web page is browsed at this state,
"windowType": "normal" // Filters normal web pages, eliminates g-talk notifications etc
}, function (tabs) {//It returns an array
for (tab in tabs) {
$('#url').val(tabs[tab].url);
$('#title').val(tabs[tab].title);
$loader.hide();
}
});