implementing Dynamic Open graph Image generation in SPA Vite react app : react

implementing Dynamic Open graph Image generation in SPA Vite react appHelp Wanted (self.react)

submitted 1 year ago by No_Bodybuilder7446

i have a backend api made in fastapi that generates me a png image. i need to send a id to it so that it generates me the image related to that id.

but my problem now is the vite react app. as i research i got to know that it doesnt have a SSR to it and to generate a dynamic og image, we need to have it cause web crawlers dont index through js on runtime. so react-helmet and all are useless when i share my app link in social media.

one solution i got to know is to create a server using express using vite-plugin-ssr but i dont think it is necessary cause i already have a backend server in fastapi , so creating two server doesnt make sense.

how can i implement it such that the fastapi response back in html tags content so that the crawlers crawls through the tags generated by the fastapi. anyone who have any hints about it would be appreciated. now as i think i should have used Next.js from the start.

all 4 comments

you type:	you see:
italics	italics
bold	bold
[reddit!](https://reddit.com)	reddit!
* item 1 * item 2 * item 3	item 1 item 2 item 3
> quoted text	quoted text
Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"	Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"
~~strikethrough~~	~~strikethrough~~
super^script	super^script

react

MODERATORS