How to show base64 image in react?

Did you make sure to add the encoding type in the src attribute along with the base64 encoded value?

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

const byteCharacters = atob(result);const byteNumbers = new Array(byteCharacters.length);for (let i = 0; i < byteCharacters.length; i++) {    byteNumbers[i] = byteCharacters.charCodeAt(i);}const byteArray = new Uint8Array(byteNumbers);let image = new Blob([byteArray], { type: 'image/jpeg' });

Once you have the Blob you need to convert that into a data url like this:

let imageUrl = URL.createObjectURL(image);this.setState({image: imageUrl});

now u can use this url saved in your state as a source for image like this:

<img src={this.state.image} />

Hope this helps!!

When you get this error:

<img src="[object Object]">

this means you insert an object to the src instead of a string.my guess is that your response returns an object and not string

 axios.get(`http://localhost:4000/image/get`).then((result) => {        this.setState({ image: result })        console.log(result);    });

check if the result is an object