Несколько виртуальных путей PWA с одним и тем же внутренним кодом не создают отдельных установок - PullRequest
Новая
       43

Несколько виртуальных путей PWA с одним и тем же внутренним кодом не создают отдельных установок

0 голосов
/ 09 июля 2020

У меня есть общее c обычное NodeJS приложение, к которому имеют доступ несколько пользователей. Пользователи идентифицируются по пути. Например: https://someapp.web.app/abc может быть одним путем, а https://someapp.web.app/def может быть другим путем.

На пути сервера NodeJS I send тот же серверный код, передав параметры пути в программу. Маршрут выглядит примерно так: 

app.get('/*', async (req, res) => {
    ...
    locals.path = req.path;
    ...
    res.render('index', locals);
}

В приведенном выше примере index - это шаблон, который использует локальные данные для настройки

Я бы хотел, чтобы для каждого пути был отдельный manifest и связанные с ним значки, и что на одном устройстве (телефоне или рабочем столе) возможны несколько установок. Таким образом, https://someapp.web.app/abc будет одним значком, а https://someapp.web.app/def - другим значком.

У меня возникли трудности с размещением и определением области действия манифеста и работника службы. Он всегда добавляет только один значок (первый установленный путь) на главный экран или рабочий стол. Мои настройки:

В папке publi c (root) у меня есть каждый манифест, а именно. abc-manifest.json и def-manifest.json и общий sw.js.

abc-manifest.json: 

  'scope': '/abc',
  'start_url': '/abc',
  ...

Доступ к сервис-воркеру из индекса. js - : 

if (navigator.serviceWorker) {
    navigator.serviceWorker.register('sw.js')
      .then(function (registration) {
        console.log('ServiceWorker registration succeeded');
      }).catch(function (error) {
        console.log('ServiceWorker registration failed:', error);
      });
  }

Я попытался изменить пути к области видимости и start_url на /, но это не сработало. Поскольку все запросы к пути publi c являются общими и не входят в виртуальный путь /abc, я не могу понять, как заставить это работать.

Спасибо

1 Ответ

0 голосов
/ 09 июля 2020

Может ли это быть вариант иметь выделенный маршрут, который будет перенаправлять пользователя на /abc или /def?

В манифесте: 

{
  "start_url": "https://example.com/login",
  "scope": "https://example.com/",
}

/login будет убедитесь, что вы перенаправили на /abc или /def.

Таким образом вы могли бы сохранить одного сервисного работника и один манифест.

А в сервисном воркере, возможно, попытайтесь вернуть указанные c значок в зависимости от имени файла. 

self.addEventListener('fetch', e => {

  // Serve correct icon
  let url = new URL(e.request.url)
  if (url.pathname.contains('/android-icon-512.png')) {
    return respondWith(e, '/android-icon-512-abc.png')
  }
  // other ifs…

  // Return from cache or fallback to network.
  respondWith(e, e.request)
})

const respondWith = (e, url) =>
  e.respondWith(caches.match(url)
    .then(response => response || fetch(e.request).then(response => response))
  )

Возможно, вам понадобится специальный заголовок c, чтобы сделать это, или используйте параметр URL (icon.png?user=abc), чтобы запросить правильный значок. Я подбрасываю идею, потому что она, вероятно, во многом зависит от серверной и / или интерфейсной архитектуры вашего приложения.

Однажды я сделал это: серверная часть (PHP / Laravel) обработал правильный возврат значка и манифеста (у меня был один для каждого варианта использования) на основе других вещей.

...