How to insert a blob url in img src in react quill

Question

I’m trying to insert a blob url something like blob:http://localhost:8000/d986abd0-8e4a-4731-b0

With embed method by react quill

    quill.current.editor.insertEmbed(
quillRange.current.index,
"image",
blob:http://localhost:8000/d986abd0-8e4a-4731-b0
)

But when I inspect the code in browser I see something like below

The Embed method works totally fine with normal http urls, but in my case I need to convert the binary data from server convert it to blob url and then display, can someone please tell how can I do that

Answer 1

According to https://github.com/quilljs/quill/issues/1795#issuecomment-340308922, you can try sanitize.

// ...
const Image = Quill.import('formats/image');
Image.sanitize = () => url; // You can modify the URL here
// ...