«Превратите свой веб-сайт в прогрессивное веб-приложение», — говорили они.
«Это будет легко», — сказали они.
Так я и сделал.
Мой сайт (www.romanorum.com.au) представляет собой довольно традиционные HTML-формы, динамические веб-страницы и т. д., использующие бритву. Я следовал за прыгающим мячом, сделал свой сайт HTTPS, загрузил сценарии сервис-воркеров, запустил Lighthouse и т. д. Конечно, мои динамические веб-страницы постоянно выдавали ошибки, используя Cache First. Я изменил его на Server First, и все выглядело нормально ... но теперь я замечаю, что любая страница, которая публикует html-форму (например, мой экран поиска или страница проверки), получает ошибку «Не удается найти вашу страницу» в Edge. Эти страницы по-прежнему отлично работают в Chrome и даже в Internet Explorer, но Edge никогда не передавал данные форм с тех пор, как я преобразовал их в PWA, и вместо этого выдавал ошибки.
Формы отправляются с использованием собственного HTML5, я использую как минимум javascript на сайте. Что я мог сделать не так?
РЕДАКТИРОВАТЬ: Вот сценарий сервисного работника, который я добавил из PWABuilder, файлы cshtml для публикации не были изменены, поскольку раньше они прекрасно работали в Chrome/IE и Edge. Я думаю, что мой сайт на самом деле не PWA ...
var CACHE = 'pwabuilder-precache';
var precacheFiles = [
/* Add an array of files to precache for your app */
];
//Install stage sets up the cache-array to configure pre-cache content
self.addEventListener('install', function(evt) {
console.log('[PWA Builder] The service worker is being installed.');
evt.waitUntil(precache().then(function() {
console.log('[PWA Builder] Skip waiting on install');
return self.skipWaiting();
}));
});
//allow sw to control of current page
self.addEventListener('activate', function(event) {
console.log('[PWA Builder] Claiming clients for current page');
return self.clients.claim();
});
self.addEventListener('fetch', function(evt) {
console.log('[PWA Builder] The service worker is serving the asset.'+ evt.request.url);
evt.respondWith(fromServer(evt.request).catch(fromCache(evt.request)));
evt.waitUntil(update(evt.request));
});
function precache() {
return caches.open(CACHE).then(function (cache) {
return cache.addAll(precacheFiles);
});
}
function fromCache(request) {
//we pull files from the cache first thing so we can show them fast
return caches.open(CACHE).then(function (cache) {
return cache.match(request).then(function (matching) {
return matching || Promise.reject('no-match');
});
});
}
function update(request) {
//this is where we call the server to get the newest version of the
//file to use the next time we show view
return caches.open(CACHE).then(function (cache) {
return fetch(request).then(function (response) {
return cache.put(request, response);
});
});
}
function fromServer(request){
//this is the fallback if it is not in the cache to go to the server and get it
return fetch(request).then(function(response){ return response});
}