'display svg images from base64 string in reactJS

I have a base64 String of an image that I want to display on a webpage using react

this is my approach

const Picture = ({ data }) => <img src={`data:image/*;base64,${data}`} />
    return (
        (base64String?
            <Picture data={ base64String } /> : <p>loading</p>
        )
    )
}

this works perfectly till I use a svg

when I do this

<img src={`data:image/svg+xml;base64,${data}`} />

it works only with svg

I want to display all images formats

what am I missing ?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source