Skip to content

Support CacheStorage.match() options in SW Static Routing API cache source #1797

@yoshisatoyanagisawa

Description

@yoshisatoyanagisawa

Problem Description
The ServiceWorker Static Routing API provides a powerful cache source type for addRoutes(). Currently, this source allows developers to specify which cache storage to query in two ways:

  • Matching against all cache storages (e.g., source: "cache").
  • Matching against a specific cache storage (e.g., source: { cacheName: "my-specific-cache" }).

However, this only controls which cache is checked. The how it is checked is not configurable.

The underlying CacheStorage.match() API, which this feature is analogous to, supports a richer options object that allows for more granular control over the matching logic, including:

  • ignoreSearch
  • ignoreMethod
  • ignoreVary

We have received requests from developers who need this same level of control directly within their static routes. For example, a common use case is to serve a cached asset regardless of its URL query parameters (ignoreSearch: true).

Without this feature, developers are forced to fall back to a full fetch event listener in their ServiceWorker to implement this logic, which negates some of the performance benefits of the API.

Proposed Solution
I propose extending the CacheSource dictionary to include an optional options member. This member would be a dictionary that directly corresponds to the options parameter of CacheStorage.match().

The existing RouterSourceDict dictionary would be extended to support this:

// Current
dictionary RouterSourceDict {
  DOMString cacheName;
};

// Proposed
dictionary RouterSourceDict {
  DOMString cacheName;
  // See https://w3c.github.io/ServiceWorker/#dictdef-cachequeryoptions for details
  CacheQueryOptions cacheOptions;
};

This would allow developers to define routes with fine-grained cache matching logic.

Examples
Example 1: Match in a specific cache, ignoring URL search parameters

This rule would match a request for /articles/hello?utm_source=... against a cache entry for /articles/hello.

event.addRoutes([
  {
    condition: { urlPattern: "/articles/*" },
    source: {
      cacheName: "article-cache",
      cacheOptions: {
        ignoreSearch: true
      }
    }
  }
]);

Example 2: Match in any cache, ignoring the VARY header

This rule would match against all cache storages, and if a matching response is found, it would be returned even if its VARY header doesn't match the request.

event.addRoutes([
  {
    condition: { urlPattern: "/images/*" },
    source: {
      // No cacheName: queries all caches
      cacheOptions: {
        ignoreVary: true
      }
    }
  }
]);

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions