从 Service Worker 获取页面 URL 参数

Question

如何从 Service Worker 获取带有参数的页面 URL？

我试过self.registration.scope，但不包括参数。

Answer 1

可以获取waiting.scriptURL或active.scriptURL，将结果传递给URL()构造函数，获取对象

的.search属性

  navigator.serviceWorker.register("sw.js?abc=123")
  .then(function(reg) {
    const scriptURL = reg.waiting && reg.waiting.scriptURL || reg.active.scriptURL;
    const url =  new URL(scriptURL);
    const queryString = url.search;
    console.log(queryString);
  }).catch(function(err) {
    console.log("err", err);
  });

Answer 2

我不清楚您是在询问获取服务工作者脚本的 URL，还是在服务工作者脚本下打开的所有客户端页面的 URL范围。所以...以下是如何做到这两点：

// Get a URL object for the service worker script's location.
const swScriptUrl = new URL(self.location);

// Get URL objects for each client's location.
self.clients.matchAll({includeUncontrolled: true}).then(clients => {
  for (const client of clients) {
    const clientUrl = new URL(client.url);
  }
});

在任何一种情况下，一旦您有了 URL 对象，如果您对查询参数感兴趣，就可以使用它的 searchParams property：

if (url.searchParams.get('key') === 'value') {
  // Do something if the URL contains key=value as a query parameter.
}

从 Service Worker 获取页面 URL 参数

Get page URL parameters from a service worker

javascript

url

url-parsing

url-parameters

service-worker