I am creating an Angular8 Universal application which is deployed on firebase. Referred this website Angular universal with firebase
When I run and serve the application with express server locally all of the routes are loading with updated meta tags. When I deploy the application on firebase everything works fine but meta tags on root path are not updating. They work absolutely fine for all other routes. Also meta tags are updating when I open inspect-element. I have added some configuration for not caching the html file on firebase.json How to prevent caching for the index.html of an SPA and also set the "cache" value to "No-cache" in server.ts file as
app.get('*', (req, res) => {
res.set('Cache-Control', 'public, max-age=0, s-maxage=0, no-cache');
res.render('index', { req });
});
But nothing worked for me. Please help.
This is a issue related to firebase cloud function. The cloud function is not getting invoked on the root path (www.domain.com), hence not updating meta tags on server side. I solved this issue by creating a folder 'test' in the root directory of the application and copying all the data from dist/browser folder into 'test' folder and renaming the index.html file to something else (eg. index2.html). Also updated the firebase.json file with the following line:
....
"hosting": {
"public": "test",
....
So whenever a URL is entered firebase searches the index.html file in the public folder and If there is no index.html file present it will invoke our cloud function.