# Service Workers ## noch ✔ todo list @done (15-05-22 17:22) - Problem: Service Workers seem to work only Async Problem: Service Workers fetch their own source code (Self-supporting System) -> a Problem in the Service Worker might lead to itself to beeing able to replace itself, even if the source code was already fixed ☐ Bugs: the Service Workers are still a hot iron and there are known issues: - "fetch" does not fetch the latest version, but uses itself a cached version https://code.google.com/p/chromium/issues/detail?id=451664 - Service Workers themselves are loaded primarily from cache. They are only indirectly updated: after loading from cache it is checked if the time stamp on them is still valid, if not they are replaced by a newer version. The new service worker is then used the next time all pages using it are closed, e.g. this require not reloading but actualy closing the window. See https://github.com/slightlyoff/ServiceWorker/blob/master/explainer.md "Updating a service worker" for that. - The serice worker scope applies to the source url of the page fetching the resources, not the target URL. - Issue: Having open the development tools does also prevent the updating of the server
Formatter
Mon Jan 27 2014 14:49:11 GMT+0100 (Central Europe Standard Time)
enabled
if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register(URL.source.withFilename("sw2.js"), {
    scope:URL.source.withFilename("test/")
  }).then(function(registration) {
    // Registration was successful
    console.log('ServiceWorker registration successful with scope: ',    registration.scope);
  }).catch(function(err) {
    // registration failed :(
    console.log('ServiceWorker registration failed: ', err);
  });
}
// Sync request bypass the Service Workers
URL.source.withFilename("test.txt").asWebResource().get().content
// Service Works seem to work only Async
URL.source.withFilename("test/test.txt").asWebResource().noProxy().beAsync().get().whenDone(function(content){
    alertOK("content: " + content)        
})
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
# Workflow 1. Edit https://lively-kernel.org/babelsberg/users/jenslincke/sw2.js 2. Force reload https://lively-kernel.org/babelsberg/users/jenslincke/sw2.js 3. Close and reopen https://lively-kernel.org/babelsberg/users/jenslincke/test/ServiceWorkers.html twice 4. New service workers is active For an explanation see for this complexity see http://www.html5rocks.com/en/tutorials/service-worker/introduction/
sw2.js
X
–
Menu
N
users/jenslincke/
...
../
test/
config.js (not parsed)
serviceworker.js
sw2.js
-----
-----
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
console.log('load');
self.onfetch = function(event) {
  console.log('got a request' + event.request.url);
if (event.request.url.match("test.txt")) {
    
  var salutation = 'Hello, ';
  var whom = decodeURIComponent(event.request.url.match(/\/([^/]*)$/)[1]);
  var energy_level = (whom == 'Cleveland')
      ? '!!!' // take it up to 11
      : '!';
  var version = '\n\n(Version 15)';
  var body = new Blob([salutation, whom, energy_level, version]);
  event.respondWith(new Response(body));
} else {
    event.respondWith(fetch(event.request))
}
};
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
>
<