后台页面和后台脚本有什么区别?

Joh*_*ent 3 google-chrome-extension

本文使用两个术语“后台页面”“后台脚本”

我认为背景脚本与Manifest.json中的脚本背景字段一样

但是背景页面是什么?它们之间有何不同?

Ivá*_*oko 6

根据文件

后台脚本是扩展程序的事件处理程序。它包含对扩展很重要的浏览器事件的侦听器。它处于休眠状态,直到触发一个事件然后执行指示的逻辑为止。有效的后台脚本仅在需要时才加载,而在空闲时则不加载。

您可以使用清单条目中的persistent键来配置后台脚本是否一直保持休眠状态直到需要使用或始终处于活动状态background。例如:

"background": {
    "persistent": true,
    "scripts": ["myBackground.js"]
}
Run Code Online (Sandbox Code Playgroud)

如果您使用scripts键声明背景脚本(如上),Chrome将创建一个空的 HTML页面,其中包含清单条目的script键中包含的脚本background。因此,在上述情况下,Chrome会创建一个背景页面,例如:

<html>
    <head>
    </head>
    <body>
        <script src="myBackground.js"></script>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

如果改为声明背景页面,则决定要在网页中包括哪些内容,并且必须在页面中包括脚本标签,因为清单条目中不能同时包含pagescriptsbackground

声明背景页面的主要区别(和优点)是,您可以在其中包含任何想要的HTML元素。它们将不会显示(永远不会显示背景页面),但是它们的工作原理与其他任何页面一样。例如,在以下背景页面中,我包含了一个audio用于在扩展程序运行时播放音乐的标签:

manifest.json

"background": {
    "persistent": true,
    "page": "myBackgroundPage.html"
}
Run Code Online (Sandbox Code Playgroud)

myBackgroundPage.html

<html>
    <body>
        <audio id="mySong" src="mySong.mp3" autoplay loop></audio>
        <script src="myBackground.js"></script>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

您仅使用脚本并包含类似以下内容即可达到相同的结果:

var myAudio = document.createElement('audio');
myAudio.src = 'mySong.mp3';
myAudio.autoplay = true;
myAudio.loop = true;
document.body.appendChild(myAudio);
Run Code Online (Sandbox Code Playgroud)

但是在这种情况下,我认为创建自己的背景页面更为方便。