Render HTML + Javascript from HTTP response

Question

I am sending a HTTP GET request from a browser to an external API using React. I'm getting a response containing some HTML and Javascript which I would like to render in my browser.

Here's my code so far:

  const url = getExternalEndpoint()
  fetch(url)
    .then(function(response) {
      return response.text();
    }).then(function(data) {
      console.log(data);
    })

Based on Retrieve data from a ReadableStream object?

So I can see the HTML in the console, but I'm not sure how to render it.

For context, the external server I'm sending the request to is an OpenID Connect server.

Does this answer your question? [How to render HTML in string with Javascript?](https://stackoverflow.com/questions/41843654/how-to-render-html-in-string-with-javascript) — Jan Pfeifer, Jan 17 '23 at 09:25

score 0 · Answer 1 · answered Jan 17 '23 at 09:49

So, there is one library called react-html-parser

To install, use the following command

npm install react-html-parser
# or  
yarn add react-html-parser

Here, you can use the state to update the value from API.

    import ReactHtmlParser from 'react-html-parser'; 
     const [html_string, Sethtml_string] = useState('')

    //set value in the  html_string 
      <div> { ReactHtmlParser (html_string) } </div>

Render HTML + Javascript from HTTP response

1 Answers1