Angular Universal: добавление сервисного работника не разрешает определенные заголовки для страниц

Question

У меня есть приложение Angular Universal, с помощью этого вызова в CLI

ng add @ nguniversal / express-engine --clientProject myapp

Я создаюAboutComponent.И я даю этому AboutComponent его собственный заголовок, используя Title из'@angular/platform-browser'.

Так что это работает!В командной строке я использую

npm run build: ssr

npm run serve: ssr

, а затем проверяю источник просмотра в Chrome Dev Toolsи увидеть другое название для страницы about.

Затем я добавляю работника службы, используя

ng add @ angular / pwa

Я запускаю npmЗапустите build: ssr и npm. Запустите снова подачу: ssr, и теперь в View Source в Chrome Dev Tools для страницы about отображается заголовок из индекса вместо определенного заголовка AboutComponent.

Есть ли способ получитьУниверсальный, чтобы сохранить отдельные заголовки для каждой страницы, а также иметь работника службы?

Вот мой github: https://github.com/flocela/univ-servworker

Спасибо.

РЕДАКТИРОВАТЬ: Вот мое о.Файл component.ts:

import { Component, OnInit } from '@angular/core';
import {Title} from '@angular/platform-browser';

@Component({
  selector: 'app-about',
  templateUrl: './about.component.html',
  styleUrls: ['./about.component.sass']
})
export class AboutComponent implements OnInit {
  constructor(private title: Title) { }

  ngOnInit() {
    this.title.setTitle('About');
  }
}

Answer 1

Так как работник Service уже запущен в браузере, поэтому, если вы просматриваете «view-source», он вернет файл index.html локального кэша вместо SSR. В основном ваш SSR работает, но вы не можете просмотреть его в браузере bcz кеша PWA. Используйте команду «Post man», команду curl или любой клиент REST, чтобы получить скомпилированный файл SSR. Должен возвращать ожидаемый источник просмотра.

Чтобы проверить это лучше, просто попытайтесь поделиться ссылкой на свою страницу (надеюсь, она активна) на любом сайте социальной сети, например, FB, и там вы увидите заголовок в предварительном просмотре ссылки.