Fetching Meta Data (title and description etc.) from an api before page serve - SSR

[akshay-sood]

Hi guys,

I am using quasar for building apps since November 2020, and I must say, it's amazing and super wonderful!

I now tried to give it a try to build an SSR website. And am stuck badly here:

I understand this might come off as a total noob question, but no matter what I do, for the life of me, I can not figure out how to fetch the metadata from a backend API and set it using createMetaMixin (Quasar v2). No matter whatever I do, the remote API is always fetched after the page has been rendered and sent to the client, so meta tags are set after page render.

I am using Options API.

Can someone please help me out with this?

[dmitry]

For the global API requests you may use a boot files, as they allow you to use async/await.
For the specific pages there is a special method named preFetch which is called everytime router uses the page in the backend.

[akshay-sood]

@dmitry Thank you so much for pointing me in the right direction. I have almost resolved the issue!

Just two things though:

1. Any idea, how to handle preFetch when the same component is rendered on different routes? e.g: the Service Detail page which can have different services based on the route? I think preFetch is not re-running in this scenario. However, going from 1 component to another works fine, and also ssr on all pages.

2. Is there any possibility to use preFetch in a mixin? It would save me a bit of redundant code.

[KarelDiaz]

Im having the same problem

[KarelDiaz]

@akshay-sood could you solve that?

[akshay-sood]

@KarelDiaz which problem? Having prefetch code in mixing? I don't remember what I ended up doing there, but if you can tell me exact issue you are facing, I can try to find out what I did about that.

[KarelDiaz]

@akshay-sood
Fetching Meta Data (title and description etc.) from an api before page serve - SSR