CODEWITHSUNDEEP
vue.jsfrontendwhatsappblogsmeta-tags
omar ba44
omar ba44

Reputation: 23

Whatsapp Share Preview Issue: Dynamically Generated Meta Tags with Vue.js

I have a Vue.js blog website where I fetch post data from the backend and dynamically generate meta tags (specifically og:image, og:title, etc.) using unhead/vue.

However, I'm facing an issue: Whatsapp crawlers seem to capture the meta data during initial page load, before the Vue.js component has fetched and rendered the post data. As a result, the Whatsapp share preview displays meta tags that is provided in index.html. So Is there another way or any suggestion? (Or I should just give up and use SSR)

Upvotes: 0

Views: 39

Answers (1)

kissu
kissu

Reputation: 46774

Depends on what approach you want to choose and how much stuff you want to pre-render.
There are services that could pre-render your SPA for you.

Otherwise, Nuxt or those other tools could also do the job.
Nuxt is still the easiest way to go I think, but it will add some abstraction.

Upvotes: 0

Related Questions