Thank you so much. You have no idea how much your videos helped me in the last 2 months (with NodeJS and DOM too). You are a real live saver, I really appreciate 👏👏👏
@@SteveGriffith-Prof3ssorSt3v3 Oh thank you so much for replying so quickly I honestly did not expect that. Although my real problem is that I have a distribution for a static website and I sign with the wild card /*, each file can be fetched with the same signed url by putting /name, but opening index.html (or just the cf url) only fetches index.html and no further resources. Any input would be very appreciated
It's the exact same as a fetch call made from another script. The response object has a body property and a headers property. I have a Playlist on Ajax and fetch that talks about headers etc.
Steve, I was wondering how do I trigger a notification from the server for the user receiving a comment on one of their posts. Right now, with this, the user simply gets a notification every time the page is refreshed. I have been following your series on Service Workers and really love it but the solution I have is to designate a button and when that button is clicked, then, the service worker sends the push notification letting the user know if they have comments. How do I send the push notification automatically without the user clicking any buttons but not every single time the page is refreshed, only when a new comment appears? Thanks in advance. I just found your channel and love your teaching style!!
Is it possible to intercept request of one worker and send it to other worker. Our scenario is to make one worker responsible for making backend api call
No. A service worker is responsible for your site. If you want to divide responsibility then you can put different workers in charge of different folders. The logic for backend api calls needs to be inside your fetch event listener.
@@SteveGriffith-Prof3ssorSt3v3 thanks for your reply. Can we implement in such a way that i intercept a request from slave-worker and wait for sometime before returning response back. I.e. intercept request and send message to browser/master to load.. return response to slave-worker once browser/master worker respond back with loaded data
There is a very limited time where the browser will wait before deciding that there was no response from the server. This is not a master-slave relationship. A service worker is like a proxy server. EVERY request from the browser goes through the service worker. Your code in the fetch event listener is what decides if you: - send the browser a cached response - fetch a new response from the server and immediately send it to the browser - fetch a new response, send a cached copy to the browser, and save the new one in the cache. - and other scenarios too. Browsers can send messages with postMessage() to the service worker asking if there is a new copy of a file. This can be done like polling of a web server. The message receipt in the service worker can trigger a new file fetch to save a new copy in the cache too.
@@SteveGriffith-Prof3ssorSt3v3 You misunderstood the question. I don't want to go through the list at the link you mentioned every couple of minutes. I want to prevent service workers from installing so I will only need to clear that list ONCE. Only service workers I give explicit permission for with a button click should be allowed.
When a service worker means fetch, it does not necessarily mean a fetch made by the fetch API? it is all xhr requests isn't it? the naming was quite confusing.
The fetch event means ANY request from the browser. It could be fetch or xhr or the browser asking to loading and image or css link from the html...any request and every request.
Thanks for the video, but it would be great if you showed that it really fails if you don't clone the fetchResponse. Because I don't clone it and it works
cloning Response objects is done because you can only use the object for one purpose. You can put the Response object into the Cache OR you can send the Response object to the webpage and use it there.
Thank you so much. You have no idea how much your videos helped me in the last 2 months (with NodeJS and DOM too). You are a real live saver, I really appreciate 👏👏👏
Amazing video. Very complete as always!
Thank you man. I'm following your tutorials learning more about service workers.
Thanks man, it's a great clarification regard to service workers, keep going 👍
Great Series!
You are treasure,Thanks teacher.
Very helpful, can you add query params to the request url in the service worker?
Yes. And you can define options in the match to say whether you want to include or ignore the query params.
@@SteveGriffith-Prof3ssorSt3v3 Oh thank you so much for replying so quickly I honestly did not expect that. Although my real problem is that I have a distribution for a static website and I sign with the wild card /*, each file can be fetched with the same signed url by putting /name, but opening index.html (or just the cf url) only fetches index.html and no further resources. Any input would be very appreciated
can you tell me how do get payload,preview and headers details from networks using service worker
It's the exact same as a fetch call made from another script. The response object has a body property and a headers property.
I have a Playlist on Ajax and fetch that talks about headers etc.
ruclips.net/video/7EKebb4VUYQ/видео.html
Steve, I was wondering how do I trigger a notification from the server for the user receiving a comment on one of their posts. Right now, with this, the user simply gets a notification every time the page is refreshed.
I have been following your series on Service Workers and really love it but the solution I have is to designate a button and when that button is clicked, then, the service worker sends the push notification letting the user know if they have comments.
How do I send the push notification automatically without the user clicking any buttons but not every single time the page is refreshed, only when a new comment appears?
Thanks in advance. I just found your channel and love your teaching style!!
Push notifications is a whole other topic with service workers. Still need to make a tutorial about those and background syncing
@@SteveGriffith-Prof3ssorSt3v3 Appreciate the response Steve. I'll be pressing 'refresh' on your channel until its out :)
Is it possible to intercept request of one worker and send it to other worker. Our scenario is to make one worker responsible for making backend api call
No. A service worker is responsible for your site. If you want to divide responsibility then you can put different workers in charge of different folders. The logic for backend api calls needs to be inside your fetch event listener.
@@SteveGriffith-Prof3ssorSt3v3 thanks for your reply. Can we implement in such a way that i intercept a request from slave-worker and wait for sometime before returning response back. I.e. intercept request and send message to browser/master to load.. return response to slave-worker once browser/master worker respond back with loaded data
There is a very limited time where the browser will wait before deciding that there was no response from the server.
This is not a master-slave relationship.
A service worker is like a proxy server. EVERY request from the browser goes through the service worker. Your code in the fetch event listener is what decides if you:
- send the browser a cached response
- fetch a new response from the server and immediately send it to the browser
- fetch a new response, send a cached copy to the browser, and save the new one in the cache.
- and other scenarios too.
Browsers can send messages with postMessage() to the service worker asking if there is a new copy of a file. This can be done like polling of a web server. The message receipt in the service worker can trigger a new file fetch to save a new copy in the cache too.
@@SteveGriffith-Prof3ssorSt3v3 thanks for clarification
When it comes to performance, what would be the difference between Web Cache and the Cache API used by SW?
No performance difference, just different places for saving things for different purposes.
How can I remove all service workers on my system simultaneously and stop them from reinstalling?
You can access all your service workers in Chrome via: chrome://serviceworker-internals/
@@SteveGriffith-Prof3ssorSt3v3 You misunderstood the question. I don't want to go through the list at the link you mentioned every couple of minutes. I want to prevent service workers from installing so I will only need to clear that list ONCE. Only service workers I give explicit permission for with a button click should be allowed.
@@StijnHommes Open in Chrome
chrome://serviceworker-internals/?devtools
then F12 in Console
$$('.unregister').forEach(b => b.click())
When a service worker means fetch, it does not necessarily mean a fetch made by the fetch API? it is all xhr requests isn't it? the naming was quite confusing.
The fetch event means ANY request from the browser. It could be fetch or xhr or the browser asking to loading and image or css link from the html...any request and every request.
❤
Thanks for the video, but it would be great if you showed that it really fails if you don't clone the fetchResponse. Because I don't clone it and it works
cloning Response objects is done because you can only use the object for one purpose. You can put the Response object into the Cache OR you can send the Response object to the webpage and use it there.