Next.js Discord

Discord Forum

Render html

Answered
Florida White posted this in #help-forum
Open in Discord
Florida WhiteOP
I'm using nextjs to render some html I'm getting from the backend, this html has head and body and everything, it is a whole page

I'm using a single div with dangerouslySetInnerHTML to render this html but doing this makes the html block be inside multiple divs in the body.

I was wondering if there's a better way to do this while still using nextjs? maybe modifying the _app or the _document file?

The picture attached shows where the html block is placed.
Answered by Rafael Almeida
You probably can't do that from inside a component. iirc there is a way to replace the entire page using JavaScript with the document's open/write methods but this is highly discouraged. Instead, you can create a Route Handler that fetches this external API and returns the entire data as a new document
View full answer

6 Replies

@Florida White I'm using nextjs to render some html I'm getting from the backend, this html has head and body and everything, it is a whole page I'm using a single div with dangerouslySetInnerHTML to render this html but doing this makes the html block be inside multiple divs in the body. I was wondering if there's a better way to do this while still using nextjs? maybe modifying the _app or the _document file? The picture attached shows where the html block is placed.
You probably can't do that from inside a component. iirc there is a way to replace the entire page using JavaScript with the document's open/write methods but this is highly discouraged. Instead, you can create a Route Handler that fetches this external API and returns the entire data as a new document
Answer
Florida WhiteOP
Thanks ill look into that
Florida WhiteOP
Is there a way to render this?

I'm using a route handler to return a string of html but i'm getting a string in the document hah
@Rafael Almeida would appreciate your help if you're available 🙏
Response accepts a second argument with a config object, try setting the headers to Content-Type: 'text/html'
Florida WhiteOP
Thanks man that did it!