My response is not an url, How can I display an image which is not url using base64 and response does not contain bodyBytes?

Question

My api is get() and the response contains data like this

The above image which you can see is my image which I want to display it on web using reactjs. ANd I dont know how can this be done. The get api returns data, config, headers, request, status,statusText I want the data above which I some weird format, my image to be displayed. I dont know how to do it. Need help

---

Update:

action

export const getFileImage = (payload) => async dispatch => {
    try {
        console.log("Payload--->",payload);
        let response = await axios.get('/api/movies/' + payload.movieId + '/document/' + payload.genre.toLowerCase().toString());
        console.log("Response----->",response);

    } catch (error) {
        console.log("error");
    }
}

Output of response :

Answer 1

OK, you asked for an example and I wrote this answer...

You can use base64 format to show Images in your React component:

render(){
    {this.state.image ? <img src={`data:image/png;base64,${this.state.image}`}/>: ''}
}

I think it would be better to ask backend developer or API provider to convert output for web and your requirements in React JS.