В API Cache, в чем разница между использованием caches.match(event.request) и caches.match(event.request.url)

Question

Я работаю с работником службы, и у меня есть следующий код

  self.addEventListener('fetch', function (event) {
    const url = new URL(event.request.url)

    if (event.request.mode == "navigate") {
        const fetchData = fetch(event.request).catch(function () {
            //console.log("errr")
            return caches.match("/core/index.php/offline_controlador/index")
        });
        event.respondWith(fetchData)
        return;
    }

    event.respondWith(
        caches.match(event.request).then(function (response) {
            return response || fetch(event.request);
        })
    );
 });

когда я пытался получить эти файлы из кэша, он не работает, но когда я изменяю код на

event.respondWith(
        caches.match(event.request.url).then(function(response) {
          return response || fetch(event.request);
        })
    );

вместо

event.respondWith(
            caches.match(event.request).then(function(response) {
              return response || fetch(event.request);
            })
        );

Работает отлично

Answer 1

Соответствующим разделом спецификации Cache Storage API является 5.4.2. (Хотя это относится к matchAll() метод Cache объект, это то, что в конечном итоге называется "под капотом", когда вы делаете caches.match(),

Особое отношение к вашему вопросу имеет шаг 2:

Если запрос необязательного аргумента не опущен, то:

• Если request это Request объект, то:

  • Задавать r в requestзапрос.

  • Если rметод не GET а также options.ignoreMethod false, вернуть обещание, разрешенное с пустым массивом.

• Иначе, если запрос является строкой, то:

  • Задавать r на связанный запрос результата вызова начального значения Request как конструктор с request в качестве аргумента. Если это вызывает исключение, вернуть обещание, отклоненное с этим исключением.

Подводя итог, самая большая разница в том, что передача в Request объект в качестве первого параметра может вызвать match() потерпеть неудачу, если Request имеет method чего-то другого, кроме 'GET', Может быть, это то, что вы сталкиваетесь.

Помимо этого, два подхода должны быть в основном одинаковыми, хотя и проходить в Request немного более эффективен, так как браузер не должен явно создавать Request объект на основе строки.