I used sw precache with service worker.I cached only browser folder in service worker.So that server side rendering not working in service worker.can anyone pls help me to solve this.if ssr working service worker not working and vice versa
below is my sw precache config.json
module.exports = {
navigateFallback: '/index.html',
stripPrefix: 'dist/browser',
root: 'dist/browser',
staticFileGlobs: [
'dist/browser/index.html',
'dist/browser/**.js',
'dist/browser/**.css',
'dist/browser/**.ico',
'dist/browser/assets/images/**.jpg',
'dist/browser/assets/images/**.png',
'dist/browser/assets/images/**.gif',
'dist/browser/assets/js/**/**.js',
'dist/browser/assets/js/**.js',
'dist/browser/assets/css/**.css'
],
runtimeCaching: [{
urlPattern: /^https:\/\/tg\.s3\.rfyfg\.com\//,
handler: 'cacheFirst'
}]
};
Thanks
Adding a service worker to an Angular app is one of the steps for turning it into a Progressive Web App (also known as a PWA). At its simplest, a service worker is a script that runs in the web browser and manages caching for an application. Service workers function as a network proxy.
The ngsw-config.json configuration file specifies which files and data URLs the Angular service worker should cache and how it should update the cached files and data. The Angular CLI processes the configuration file during ng build .
It's trying to get the service worker configuration to see what needs updated, but can't access the file. However, this should not impede the service worker from serving up anything it's already cached, and operate normally until back online. Once online you will see the call to the ngsw.
The Angular service worker's behavior follows that design goal: Caching an application is like installing a native application. The application is cached as one unit, and all files update together.
You could choose to only send server-side rendered content to web crawlers so that they can index your page for SEO.
An example configuration using nginx:
location / {
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto https;
proxy_set_header Host $http_host;
proxy_redirect off;
proxy_ignore_headers X-Accel-Expires Expires Cache-Control;
if ($http_user_agent ~* "whatsapp|googlebot|yahoo|bingbot|baiduspider|yandex|yeti|yodaobot|gigabot|ia_archiver|facebookexternalhit|twitterbot|developers\.google\.com|linkedinbot|discordbot|embedly|quora link preview|slackbot|pinterest|vkShare") {
proxy_pass http://localhost:4000; // your server
break;
}
rewrite . /static/index.html last;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With