Chrome 扩展 - setInterval 在 popup.html 关闭时停止

Question

我正在尝试构建我的第一个简单 Chrome 扩展，我是 Javascript 的新手，所以我希望你能帮助我。

我的扩展程序只有一个目标：每隔 X Seconds/Minutes 创建一个 Google 富通知。 X 的值来自 popup.html 的输入文本字段。我正在使用 setInterval-Method 重复创建通知。

您可以在下面看到 popup.js 和 popup.html。

popup.js:

var NotOptions = {
    type : "image",
    title: "In die Ferne gucken!",
    message: "Nur auf den Bildschirm zu starren, ist nicht gesund",
    expandedMessage: "",};

var timeElement = document.getElementById("time");
var timeValue = null;
var time = null;
var interval = null;
timeElement.onchange = getTimeValue;

function getTimeValue() {
    timeValue = timeElement.value * 60000;
    localStorage.setItem("timeValue", timeValue);
    activateReminder();
}

function activateReminder() {
    time = localStorage.getItem("timeValue");
    clearInterval(interval);
    if(time >= 3000  && time <= 1800000) {
        interval = window.setInterval(function() {
            doNotify();         
            console.log("Time is " + time);
        }, parseInt(time));     
    }   
}

function doNotify() {
    var path = "/images/eye127.png";
    var options = null;     
    options = NotOptions;   
    options.iconUrl = path;
    options.priority = 0;
    options.imageUrl = chrome.runtime.getURL("/images/tahoe-320x215.png");
    chrome.notifications.create(options);   
}

popupt.html:

<html>
<head>
</head>
<body>  
    <h1>Watch out!</h1>
    Time in minutes:<input type="text" id="time">   
    <script type="text/javascript" src="popup.js"></script>
</body>
</html>

我的问题是它只有在 popup.html 保持打开状态时才能工作。一旦关闭，setInterval 就会停止工作。

但是当我在 popup.js 中简单地执行以下代码时，即使 popup.html 已关闭，我也会每 6 秒收到一次通知。这是我有 6 秒固定值的问题。相反，我想使用输入字段中的值。

setInterval(function() {
        doNotify();         
        console.log("Time is " + time);
    }, 6000);

现在我想做两件事：

将输入字段的值从 popup.html 传递到 setInterval 方法
setInterval 应保持运行输入字段中指定的值，即使 popup.html 关闭

我怎样才能做到这一点？

这里 link 我的 github-repo 如果你想签出项目

blink-reminder

提前谢谢你

Answer 1

更好的方法是将 "clock code" 移动到背景页面。

这将允许您运行代码而无需打开任何弹出窗口。

弹出窗口只会在这里设置每次执行时钟之间的秒数。为此，您可以像在代码中所做的那样使用本地存储，或者使用 Chrome 扩展的消息 API。

如果你使用local Storage，你可以使用onChanged事件来同步背景和popup中值的变化。

Here more informations about background pages

Here more informations about Messaging API

Here more informations about local storage (onChanged event)

Chrome 扩展 - setInterval 在 popup.html 关闭时停止

Chrome Extension - setInterval stopping when popup.html closed

javascript

popup

parameter-passing

setinterval

google-chrome-extension