React: proxy img src references to a specific folder/file system location

308 Views Asked by At

For some context, I'm trying to render CrowdAnki JSON files in React. All the HTML in the JSON file is formatted to have this problem, and all the cards are stored as HTML strings which I have to (somewhat dangerously) pass to the react-contenteditable component e.g. <ContentEditable html={anki_field} />.

Is it possible in React to proxy all img src calls specifically to a specific folder? In this specific case, all the images and media are located in a folder e.g. public/deck/media/, and all the src attributes directly reference the media file e.g. <img src="media-file.jpg" />, for a file public/deck/media/media-file.jpg.

For this specific instance I don't think adding a proxy to the package.json would work, as I still need to fetch the JSON file from e.g. public/deck. Otherwise, is there some way to change all the img src file paths post-rendering?

0

There are 0 best solutions below