Це відео не доступне.
Перепрошуємо.
Angular Service Worker | Progressive Web Apps Development
Вставка
- Опубліковано 25 кві 2020
- A service worker is a script that browser runs in the background, separate from a web page. With the help of the service worker, we can also implement push notification and background sync. Service workers can store files or responses in cache storage so it allows developers to create an offline experience for the user.
Service Worker in angular can be achieved by adding @angular/pwa package, this will going to handle lots of boilerplate code for us like registering a service worker, installing a service worker, and activating the service worker and lots more.
GitHub: github.com/fun...
#ServiceWorkers #AngularPwa
Progressive Web Apps Development: bit.ly/359BXpK
Angular Tutorial: bit.ly/2Tnwk1t
Dashboard with chart.js: bit.ly/3c9Jd85
All about Observable: bit.ly/2wVVnBl
All about Http call: bit.ly/2I3Zcqo
Angular Interview: bit.ly/2T67jZN
Application Development: bit.ly/398w7Gf
Upload File to server: bit.ly/3ccsjWd
Data Structure and algo: bit.ly/3c8b7Bh
Slack: bit.ly/2RXPcEK
You can support me on Patreon: / funofheuristic
Thanks for watching...
Thank you! I didn't skip the ad in case it helps you haha...
Get the data from the “CAS” “GUESS”instead of server? I’m wondering if you were trying to say Cache...
Nice info...bro
Thanks a lot for wonderful explanation..
Thank you so much, very clear and well explained.
thanks for such a good explaination
beautiful info and its very good
I get errors(ERR_INTERNET_DISCONNECTED) for all service calls fetch even after adding url in config when I choose offline in service worker. Same error for ngsw-cache-bust also.. could you pls help?
Great video.. but it's hard to watch in mobile.
Tnx for sharing!
I got error - Gateway timeout (504 error) how to resolve? Please give me answer
Hello sir, each time we make changes to the project do we need to build it again and run http-server?
Yes if you want to rest the pwa features, for normal application change ng serve will work
What if we want to cache all apis except 1 how can we do that?
why you are explaining while standing?
Hi, can we use service worker in cordova
Any idea how to check wifi signal strength
hi, noob question here:
what is the difference between @angular & @angular/pwa? Also, is it possible to update old angular projects from normal angular to PWA?
Hello, angular is framework and @angular/pwa is bundel which handel your service worker and enable pwa for your project.
You can add the @angulat/pwa to your project like I have did in the video.
Hey, I did the same added angular/pwa in my existing angular app but I can't see manifest and service worker in local host .. can you please help
Please build the application and run from dist folder, use http-service
@@FunOfHeuristic Thanks a lot it worked but as I clicked on offline I am continuously getting "net::ERR_INTERNET_DISCONNECTED", please help
How an we implement, Service worker in existing angular projects?
Same , just add @angular/pwa
If the project is big and there we are using a lot of Api call then we need to add all the api details in the cache?
In this scaneraio, it's very difficult to add all the Api is there any other method for doing the same?
You can use baseUrl/* to cache all the call under that url.
Hi thank you for the explanation it worked alot for me. Could you please make a video combining both SW and SSR in angular please?
Ya I will
Hi, can we create a single PWA for websites having a different pages
Yes, your whole application will become a pwa
Great
In JavaScript we need to write code for sw lifecycle (like register,install event etc.) But in angular , provide ngsw-config.json file for this. We do not need to write code for sw lifecycle, am I right?
Yes, angular service workers handle all the lifecycle.
@@FunOfHeuristic thank you for quick reply
Why have not covered the Push Notification?
Push notifications and background sync will be a dedicated video for each topics.
Hi, can you make a video on file download using angular and nodejs
Ya I will 🙂
Starturl not registered error I am getting and thank you in advance it will be great help if you share the code
Code is in GitHub and the link is present in the description.
@@FunOfHeuristicI am getting start url not registered error
Hi
I am using
if (!this.update.isEnabled) {
console.log('Not Enabled');
return;
}
After changes in app its always shows Not Enabled then what was an issue ?
You can check in your application tab in your dev tools that service worker is registered or not, it need https in prod, and in local your should run your application from dist/project name
I am facing error when hit http-server -p 8080
Please help me, I tried twice in two different project
What is the error?
@@FunOfHeuristic 'http-server' is not recognized as an internal or external command, operable program or batch file.
Please run npm install -g http-server
@@FunOfHeuristic ok Thank you. I'll try
@@FunOfHeuristic After running this, website lists as a directory structure instead of website
after http-server the webpage is not opening and service worker is also not running
Run the http-server inside your dist/applicationName so that it can run your index.html and then it will going to work.
@@FunOfHeuristic it's not working ,on the browser it showing list of files inside of dist/appName. Pls suggest ahead !
@@jigneshmahadik7777 Hi did you figure a way to fix this?
If index.html present in your directory it should show that one in your startup.
@@FunOfHeuristic @jignesh mahadik For some reason port 8080 didn't work for me, when I continued to follow your video with port 8000 it worked. Not sure why but at least this working. Thanks :)
22:25 I think you said it wrong. It's reverse.
Did you saying about download of application from server to service worker
@@FunOfHeuristic Here at that point, as per my understanding, the data is coming from service not from service worker. Correct me if I am wrong.
If we are caching some api call or file then initially the response will come from server to the cache of the browser that we can say service worker, but when the user will request again the browser will fast fetch the data from the service worker and render it but the service worker will have a look up to the server to update the data in the cache.
@@FunOfHeuristic ok. I will give it a try . Thanks
Your content is good but work on your english and pronunciation
Make up your mind! You say you're making an app and instead you're creating a website. Learn how to make a real native app instead of trying to make a website with way too much code look like one.