PWA and generated ServiceWorker.js

Hi,

My generated ServiceWorker.js looks like below:

var CACHE_NAME = "ONE_PWA";
var CACHED_URLS = [
"index.html",
"frmLogin.html",
"images\login.png",
"ONE_PWA.js"
];

self.addEventListener('install', function(event) {
event.waitUntil(
caches.open(CACHE_NAME).then(function(cache) {
return cache.addAll(CACHED_URLS);
})
);
});

self.addEventListener('fetch',function(event) {
event.respondWith(
fetch(event.request).catch(function() {
return caches.match(event.request).then(function(response) {
if (response) {
return response;
} else if (event.request.headers.get("accept").includes("text/html")) {
return caches.match("index.html");
}
});
})
);
});

and when I run application on web console I got an error:
Uncaught (in promise) TypeError: Request failed ServiceWorker.js:1

when I change line number five from "images\login.png" to "images/login.png" all is ok and serviceworker starts properly.

???

Might be server related?
Is this a specific server that might need a forward slash?

Hi, It wasn't deployed on external server yet ... I only run web application from Delphi and ... the application starts on TMS internal server I think.

First time we hear this is an issue with our debug server.
I could not see such problem here (Windows 10 / Chrome browser) and we have not received any similar problem report so far, so it is unclear why you have this problem.

Try this ... this is PWA simple project made from scratch.
pwa.zip (835.0 KB)

On console in chrome I see:

I test your app and the browser console is empty.
I suggest to try another browser / another machine and verify.

Did you check Application tab on Chrome after F12, ServiceWorker for app is up and running?

I have Chrome version 86.0.4240.183 64-bits on Windows 10 and Delphi 10.4

Due to a caching issue we did not immediately see this.
We could see it now and applied a fix that will be included in the next update.

Ok thanks ... but anotherone problem with ServiceWorker.js ... generated file has ? on te first line like below, I don't know if is it the same problem.

?var CACHE_NAME = ....

What I see, pasted from Chrome console:

var CACHE_NAME = "Project1";
var CACHED_URLS = [
  "Project1.html",
  "images/login.jpg",
  "Project1.js",
  "Unit1.html"
  ];

self.addEventListener('install', function(event) {
                event.waitUntil(
                                caches.open(CACHE_NAME).then(function(cache) {
                                return cache.addAll(CACHED_URLS);
                })
                                );
});


self.addEventListener('fetch',function(event) {
   event.respondWith(
     fetch(event.request).catch(function() {
                   return caches.match(event.request).then(function(response) {
       if (response) {
                                   return response;
       } else if (event.request.headers.get("accept").includes("text/html")) {
                                   return caches.match("Project1.html");
                   }
                   });
   })
                   );
});

I see this when I opened ServiceWorker.js file via notepad.

I cannot reproduce this and I cannot see a reason for this.
I would suggest to recheck when we release the next update.

Ok

Hi,

The same issue after version 1.5.6.0 ... in pwa\TMSWeb\Release\ServiceWorker.js I still see question mark in first line. Try my empty pwa project pwa.zip (811.6 KB)

We have internally already fixed this.
The next update will adddress this. Manually edit the file for now when you need to deploy this to a web server.

Ok ... I can change this manually