BqTools

Конструктор PWA

Настройте `manifest.json`, параметры кеширования и получите шаблоны файлов для вашего PWA. Сначала заполните поля — результат появляется мгновенно, копируйте JSON и JS, затем упакуйте всё в ZIP.

Manifest

Кеширование

Как использовать

После генерации manifest и service worker встроите их в свой проект:

  1. Скопируйте manifest.json в публичную папку сайта и добавьте ссылку в <head>:
    <link rel="manifest" href="/manifest.json">
  2. Опубликуйте service-worker.js рядом с сайтом и зарегистрируйте его:
  3. Поместите register-service-worker.js или вставьте скрипт прямо в страницу:
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('/service-worker.js');
    }
  4. Убедитесь, что все пути в manifest (start_url, scope) и списке кеша совпадают с фактическими ресурсами.

Пример HTML

<head>
  <link rel="manifest" href="/manifest.json">
  <script src="/register-service-worker.js"></script>
</head>

<script>
if ('serviceWorker' in navigator) {
  navigator.serviceWorker
    .register('/service-worker.js')
    .catch(console.error);
}
</script>

Результаты

manifest.json


            

            

                
service-worker.js