如何让脚本在 chrome 扩展程序的后台继续运行？

Question

我最近创建了我的第一个 google chrome 扩展程序。 它有效，但我想让它变得更好。
我的扩展程序的目标是能够在特定时间刷新页面。 我能够做到这一点，但是，当我 go 远离扩展弹出窗口时，它会取消我设置的“计时器”。
在这里你可以找到一些代码：

弹出.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="styles.css">
    <title>Refresher</title>  
  </head>
  <body>
    <p><b>Séléctionnez l'heure à laquelle vous souhaitez rafraîchir automatiquement la page !</b></p>
    <div id="d2">
      <form>
        <input id="input-hour" type="number" placeholder=22 min=0 max=24></input> H
        <input id="input-min" type="number" placeholder=13 min=0 max=59></input> M
        <input id="input-sec" type="number" placeholder=45 min=0 max=59></input> S
      </form>
    </div><br>
    <div id="d1">
      <button id="ss_button">Programmer le refresh</button>
    </div>
    <p>En attendant une future mise à jour, vous devez garder ce popup ouvert pour qu'il fonctionne.</p>
  </body>
  <script src="popup.js"></script>
</html>

Popup.js：

console.log("popup.js loaded")

document.addEventListener('DOMContentLoaded', function () {
  if(document.getElementById("input-hour") != null){
    var input_h = document.getElementById("input-hour");
    input_h.value = localStorage.getItem("hour_value");
  }
 
  if(document.getElementById("input-min") != null){
    var input_m = document.getElementById("input-min");
    input_m.value = localStorage.getItem("min_value");
  }

  if(document.getElementById("input-sec") != null){
    var input_s = document.getElementById("input-sec");
    input_s.value = localStorage.getItem("sec_value");
  }

  if(document.getElementById("ss_button") != null){
    var ss_button = document.getElementById("ss_button");
    ss_button.addEventListener('click', ss_clickHandler);
  }
  
  function ss_clickHandler(e) {
    localStorage.setItem("hour_value", input_h.value);
    localStorage.setItem("min_value", input_m.value);
    localStorage.setItem("sec_value", input_s.value);
  
    refresh_hour = parseInt(input_h.value);
    refresh_min = parseInt(input_m.value);
    refresh_sec = parseInt(input_s.value);

    countdown(refresh_hour, refresh_min, refresh_sec);

    function countdown(hours, minutes, seconds){
      var now = new Date();
      var then = new Date();
      var onesecond = new Date(1970, 0, 1, 1, 0, 1, 0);
    
      if(now.getHours() > hours ||
          (now.getHours() == hours && now.getMinutes() > minutes) ||
          now.getHours() == hours && now.getMinutes() == minutes && now.getSeconds() >= seconds) {
          then.setDate(now.getDate() + 1);
      }
    
      then.setHours(hours);
      then.setMinutes(minutes);
      then.setSeconds(seconds);
      var timeout = (then.getTime() - now.getTime() - onesecond.getTime());
      setTimeout(function() { chrome.runtime.sendMessage({message: "reload"}); }, timeout);
    }
  }
});

最后是 background.js：

chrome.runtime.onMessage.addListener( function(request,sender,sendResponse) {
    if( request.message === "reload" ) {
        chrome.tabs.getSelected(null, function(tab) {
          var code = 'window.location.reload(true);';
          chrome.tabs.executeScript(tab.id, {code: code});
        });
    }
});

可以，请有人帮助我吗？ 提前致谢！

Answer 1

popup.html 中的脚本在您离开弹出窗口后被杀死，因此您不能将间隔代码放在那里。

默认情况下，background.js 是持久的，但请确保您的 manifest.json 没有将持久性覆盖为 false。

由于您的 background.js 现在是持久的，您可以创建一个 setInterval（或任何间隔类型的函数），为您要刷新的所有选项卡向您的 content.js 发送消息。

如何让脚本在 chrome 扩展程序的后台继续运行？

问题描述

1 个解决方案

解决方案1
0 2021-06-11 08:38:24

如何让脚本在 chrome 扩展程序的后台继续运行？

问题描述

1 个解决方案

解决方案1 0 2021-06-11 08:38:24

解决方案1
0 2021-06-11 08:38:24