Angular 8 Служебный работник не работает в автономном режиме - PullRequest
0 голосов
/ 25 февраля 2020

Я испытываю ту же или очень похожую проблему, о которой здесь сообщало Линве: Angular: конфигурация работника службы (на момент ответа на этот вопрос нет ответа).

Я создал новый проект с использованием Angular CLI, а затем добавил поддержку для сервисных работников, следуя шагам, изложенным здесь: https://angular.io/guide/service-worker-getting-started. Я изменил содержание сайта, чтобы сказать не что иное, как «Это компонент приложения», так что это очень просто, без функциональности. Я просто пытаюсь протестировать сервисных работников в одиночку.

Технология сервисных работников использует файл с именем manifest.webmanifest, для которого не определен тип MIME в моем локальном IIS, поэтому я добавил его (application / manifest + json). Но даже тогда мой веб-браузер (Chrome) не всегда мог найти файл (и вместо этого получал страницу index. html по запросу на выборку). Но, согласно manifest. json vs manifest.webmanifest , в имени нет ничего волшебного, поэтому я добавил «. json» в конец файла и изменил ссылки для работы с это имя вместо Кажется, это работает нормально.

Работая в Visual Studio 2019 (используя IIS Express и обрабатывая запросы на https://localhost: 44303 / ), работник службы никогда не создавался в все. Когда я перешел на вкладку «Приложения» DevTools Chrome и искал сервисных работников, я ничего не увидел.

Но когда я развернул сайт на локальном IIS, я увидел (либо по http, либо по http или в https), что сервисный работник был создан и запущен: enter image description here

И когда я работал в сети, я мог видеть, что контент обслуживается сервисным работником (например, Линве). Но когда я перешел на вкладку «Сеть» и перевел браузер в автономный режим, я получил ту же ошибку, как если бы я вообще не использовал работников сферы обслуживания:

enter image description here

На вкладке сети я вижу сбойную команду извлечения (ожидается ??), но я не вижу других ошибок: enter image description here

Я перехожу только к работникам сферы обслуживания для этого (довольно простого) приложения, поскольку Chrome прекращает поддержку AppCache в апреле. Я не знаю, какая альтернатива существует, если работники сферы обслуживания не будут работать в Chrome ...

. Любая помощь будет принята с благодарностью.

(отмечу, что Линве указал, что его проблема была только в браузерах, работающих на Windows - он сказал, что браузеры, работающие на MA C, в порядке. У меня нет MA C для проверки это, но этот комментарий предлагает что-то определенное от c до Windows.)

ОБНОВЛЕНИЕ: Я начал заново, точно следуя шагам, изложенным здесь: https://angular.io/guide/service-worker-getting-started. Затем я запустил его с помощью http-сервера, и все заработало отлично. Я перевел его в автономный режим, обновил страницу и увидел кэшированное содержимое.

Затем я взял этот завершенный проект и скопировал все файлы в папку ClientApp проекта Visual Studio 2019 Angular (после первого удаление всех файлов из этой папки). Затем я опубликовал его в своем локальном IIS и получил ту же проблему, о которой сообщалось ранее. Сервисный работник создан, и я вижу его, но при выходе из сети я не получаю никакого кэшированного контента. Внесенное мной изменение only касалось outputPath в моем файле angular. json, потому что я хотел, чтобы оно было развернуто в root каталога dist, а не в подпапку ниже каталога dist ( где IIS не смог его найти).

Затем для дальнейшего эксперимента я скопировал все файлы из папки dist / [имя проекта] в исходном приложении, созданном с помощью интерфейса командной строки, и поместил их в root папки приложения в IIS (после первого удаления всех других файлов). Я изменил базовый href файла index. html в соответствии с именем приложения, но никаких других изменений не внес. И, опять же, я вижу ту же проблему, о которой сообщалось первоначально - я вижу работника службы, но кэшированное содержимое не обслуживается в автономном режиме. (Это происходит, когда я захожу на сайт IIS через http или https - без разницы.)

Итак, мне кажется, что те же самые файлы, которые работают и работают правильно, когда я обслуживаю их с http-сервером, не работают правильно, когда мой сервер IIS (это на Windows 10 professional P C).

Откуда я go отсюда ???

1 Ответ

0 голосов
/ 26 февраля 2020

ОК, оказывается, это не имеет никакого отношения к IIS, но вместо этого root проблемы связано с областью регистрации сервисного работника. Сервер узла просто работает с localhost на каком-то порту. Но в IIS код развертывается в приложении, а не только на локальном хосте (например, http://localhost/myapplication/).

Для этого необходимо построить решение angular, что можно сделать, передав параметр baseHref в команду построения:

ng build --prod --baseHref=/myapplication/ 

После нескольких часов копания я узнал о это здесь: https://github.com/angular/angular/issues/29163.

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

Теперь, если вы хотите развернуть тот же код в другом приложении с другим именем, это не сработает. Вы не можете просто изменить базовое значение href файла индекса. html - вам нужно создать новую сборку с именем приложения, в котором вы собираетесь развернуть. Это не проблема в моей конкретной ситуации, но я вижу, что это кошмар, если кто-то хочет, чтобы один и тот же код был развернут на множестве разных приложений, каждое из которых имеет свое имя, то есть customer1AppInstance, customer2AppInstance и т. Д. c. Я бы ожидал, что этого будет достаточно просто изменить базовый href в файле index. html, но это не так - имя приложения, очевидно, запекается в сгенерированном javascript.

В любом случае, это работает .

...