Angular Обновление Service Worker на нескольких доменах - PullRequest
Новая
       30

Angular Обновление Service Worker на нескольких доменах

0 голосов
/ 09 марта 2020

Context

В настоящее время мы создаем наше приложение, используя Angular. Это одно приложение обслуживается из нескольких доменов и предоставляет разные цвета и контент в зависимости от того, в каком домене находится пользователь. Но это то же самое приложение Angular.

Чтобы обеспечить скорость и некоторый опыт работы в автономном режиме, мы настроили работника сервиса, который работает просто отлично. Мы используем следующий код для отображения диалогового окна для наших пользователей при каждом обновлении приложения перед автоматической перезагрузкой страницы: 

export class ApplicationService {
  constructor(private dialog: DialogService, private worker: SwUpdate) {
    this.worker.available.subscribe(event => {
      this.dialog.updateApplication();
    });
  }
}

Проблема

Поскольку приложение обслуживается в нескольких доменах , это также означает, что каждый домен управляет своим собственным доменным кешем.

Например, когда пользователь переходит на domain-a.com и доступна новая версия, появится диалоговое окно и страница обновится sh и это нормально.

Однако, если тот же пользователь перейдет к domain-b.com, он испытает то же самое, и это не то, что мы хотим. Поскольку это одно и то же приложение, мы в идеале хотим, чтобы все домены были обновлены до новой версии.

Итак, вопрос в том: возможно ли это? И если да, какие стратегии мы можем реализовать, чтобы обойти эту проблему?

РЕДАКТИРОВАТЬ

Вот частичное содержание моего манифеста, а также конфигурация моего работника службы:

manifest.webmanifest 

{
  "name": "my-project",
  "short_name": "my-project",
  "theme_color": "#277f31",
  "background_color": "#fafafa",
  "display": "standalone",
  "scope": "/",
  "start_url": "/",
  "icons": [...]
}

ngsw-config. json

{
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html",
          "/*.css",
          "/*.js"
        ]
      }
    }, {
      "name": "assets",
      "installMode": "lazy",
      "updateMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**",
          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
        ]
      }
    }
  ]
}

1 Ответ

0 голосов
/ 10 марта 2020

Вы используете разные домены, и PWA должны соответствовать ограничениям Same Origin Policy . Источник URL-адреса сценария работника службы должен совпадать с источником страницы, вызывающей метод register(). Та же политика происхождения также влияет на область действия для Cache или IndexedDB.

В вашем случае у вас может быть один домен root, в котором вы регистрируете работника сервиса и под ним ряд субдоменов / путей , Как: domain.com/domain-a и domain.com/domain-b. Таким образом, вы по-прежнему сможете предоставлять различный пользовательский интерфейс в соответствии с выбранным конечным путем, и вы можете использовать централизованное ПО и кэш-память для всех поддоменов.

Я также предлагаю вам прочитать эту статью , где они советуют не делить сайты на разные источники.

...