我编写了一个chrome扩展,根据作为内容脚本注入的计时器的值重定向当前选项卡。后台脚本通过每隔一段时间轮询每个计时器来跟踪所有打开的选项卡的已用时间,如果在特定站点上花费的时间超过给定限制,则将活动选项卡重定向到插页式页面,并选择重置计时器并恢复以前的URL。这样做有效,但是一旦计时器重置一次,chrome.tabs.update()
会将活动标签重定向到chrome-extension://invalid/
。我不知道为什么,甚至不知道如何诊断这里发生了什么。
这是它应该如何工作,一步一步。首先,后台时间会触发后台脚本中的if
块:
background.js:
if (time_elapsed > time_limit) {
settings.restore_url = tab.url;
var timeup_url = chrome.extension.getURL('timeup.html');
update_icon("off");
chrome.tabs.update({url: timeup_url});
}
这会将当前标签的网址保存到settings
对象,从扩展程序目录中获取静态网页timeup.html
的网址,更新工具栏图标,并将当前标签重定向到{{1} }。
timeup.html:
timeup.html
这很简单。两个按钮连接到...... {/ p>中的<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="bootstrap.css" type="text/css">
<style>
.hero-unit {
background-color: #ffffff;
text-align: center;
}
.icon {
vertical-align: middle;
}
.xlarge {
font-size: 20px;
}
</style>
<script src="timeup.js" type="text/javascript"></script>
<title>Tabminder</title>
</head>
<body>
<div class="container">
<div class="row-responsive">
<div class="hero-unit">
<h1>Don't get distracted!</h1>
<p>You've been browsing a timesink site for too long.</p>
<p>
<a class="btn btn-inverse btn-large xlarge" id="close-tabs"><img src="img/remove.png">
<span class="icon"> Close tab</span>
</a>
<a class="btn btn-danger btn-large xlarge" id="restart-timer"><img src="img/repeat.png">
<span class="icon"> Restart timer</span>
</a>
</p>
</div>
</div>
</div>
</body>
</html>
事件侦听器
timeup.js:
'click'
document.addEventListener('DOMContentLoaded', function () {
document.getElementById("close-tabs").addEventListener('click', close_tabs);
document.getElementById("restart-timer").addEventListener('click', restart_timer);
});
var port = chrome.extension.connect();
function close_tabs () {
port.postMessage({close_tabs: true});
}
function restart_timer () {
port.postMessage({restart_timer: true});
}
按钮调用#restart-timer
,它会将消息发送回内容脚本以重定向标签:
background.js:
restart_timer()
这应该会重置// Listen for connections from content scripts
chrome.extension.onConnect.addListener(function(port) {
port.onMessage.addListener(function(msg) {
if (msg.name == "update") {
update_times(msg.update, port.sender.tab);
}
// Messages from timeup page:
if (msg.close_tabs === true) {
chrome.tabs.remove(port.sender.tab.id);
}
if (msg.restart_timer === true) {
var reset_hostname = get_location(settings.restore_url).hostname;
settings.elapsed_times[reset_hostname] = 0;
chrome.tabs.update({url: settings.restore_url});
}
});
});
中存储的已用时间,并将标签重定向到settings
。这是第一次正常工作,但一旦重置计时器,似乎重定向到settings.restore_url
。即使在第一次重置后,chrome-extension://invalid/
的正确值也会传递给settings.restore_url
,因此我不确定重定向的来源。这里出了什么问题?我怎样才能在将来诊断出这种错误?
答案 0 :(得分:1)
正如@RobW指出的那样,添加您需要主页才能访问web_accessible_resources
的文件:
清单 - Web可访问资源
一个字符串数组,指定预期可在网页上下文中使用的打包资源的路径。这些路径相对于包根,可能包含通配符。
...
然后,可以通过网址
chrome-extension://[PACKAGE ID]/[PATH]
在网页中提供这些资源,该网址可以使用extension.getURL
方法生成。白名单资源与适当的CORS标头一起提供,因此它们可以通过XHR等机制获得。除非资源列为可通过网络访问,否则将阻止从Web源到扩展资源的导航。
(仅摘录)