Я делаю расширение для новой вкладки Chrome, и я хотел бы использовать рабочую панель для кэширования запросов, которые делает новая вкладка, чтобы пользовательский интерфейс был приятным и быстрым.Однако я не могу заставить рабочий ящик вообще взаимодействовать с запросами, которые выполняет мое новое расширение вкладки.
index.html
<html lang="en" dir="ltr">
<head>
<meta charSet="utf-8" />
<title>New Tab</title>
<link rel="stylesheet" type="text/css" href="https://cloud.typography.com/6844296/7797412/css/fonts.css" />
<style>
body {
background-color: '#f5f4f3'
}
</style>
</head>
<body>
<div id='container'></div>
<script type="text/javascript" src="tab.js"></script>
</body>
</html>
tab.js
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('service-worker.js');
});
}
service-worker.js
importScripts(
'https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js'
);
if (workbox) {
workbox.routing.registerRoute(
/\.js$/,
new workbox.strategies.StaleWhileRevalidate()
);
workbox.routing.registerRoute(
/\.css$/,
new workbox.strategies.StaleWhileRevalidate()
);
} else {
console.log(`Boo! Workbox didn't load ?`);
}
Я вижу работника службы, зарегистрированного, но запросы от него не поступают.
Что я здесь не так делаю?