Change meta tags in PWA

I have a progressive web app that has a page that displays images. Currently, when a user shares a URL to an image (/image/123) on Twitter or Facebook there is no image preview because the page is lacking the appropriate meta tags and the scrapers for both Twitter and Facebook do not execute any scripts. My understanding is that any attempt to dynamically update these tags will not work.

What is the best way to manage meta tags dynamically in a progressive web app?

4 Likes

I’m also having this problem. Meta tags for social media sharing are set inside the header tags, but there doesn’t appear to be a way to change these in the ionic router. Any help would be hugely appreciated.

1 Like

I am facing with this issue.
I tried this:
1. this.meta.addTag({ name: ‘twitter:card’, content: ‘summary_large_image’ });
this.meta.addTag({ name: ‘twitter:site’, content: ‘@alligatorio’ });
this.meta.addTag({ name: ‘twitter:title’, content: ‘Front-end Web Development, Chewed Up’ });
this.meta.addTag({ name: ‘twitter:description’, content: ‘Learn frontend web development…’ });
this.meta.addTag({ name: ‘twitter:image’, content: ‘https://alligator.io/images/front-end-cover.png’ });
this.meta.addTag({ name: ‘og:description’, content: ‘Huy test’ });
2. Progressive Web App - Metatags
Any advices???. Thanks.