首页 > 解决方案 > 如何仅缓存字体文件并从缓存中访问它们

问题描述

我试图弄清楚如何使用 Promise 来缓存带有content-type font/woff&的字体文件font/woff2
我想将网站的 url 作为参数传递,Promise 会获取与定义匹配的所有文件content-type并将它们放入Cache.
之后,我想从Cache.

谁能帮我找出正确的方法。
提前致谢!

标签: javascriptcachingpromisecontent-type

解决方案


您可以使用service-worker

self.addEventListener('install', (event) => {
  event.waitUntil(caches.open('your-cache-name').then((cache) => {
  console.log('installing service worker', event);
  return cache.addAll([
    'paths/to/your/font/files',
   ]);
 }));
});

self.addEventListener('fetch', (event) => {
  event.respondWith(caches.match(event.request).then((response) => {
  if (response) {
    return response;
  }
  return fetch(event.request);
 }).catch(err => console.log('nope not in the cache', err)));
});

application您可以在Chrome的选项卡中调试它DevTools


推荐阅读