URI данных SVG в теге IMG не отображается на IE11

Question

Я разрешаю пользователю загружать изображение SVG и пытаюсь показать его ему.

Изображение хорошо отображается на Edge, Firefox и Chrome, но не на IE11. Когда я вхожу в режим отладки, похоже, что URI данных отличается в IE и в Chrome. Когда я копирую URI данных, который у меня есть в Chrome, в IE, он работает.

В чем проблема? Почему IE меняет URI данных?

Я создал для него JSFiddle:

jsfiddle.net/liorsharabi/ctpq9v04/9/

Thx

Answer 1

Решил,

Проблема заключалась в том, что для использования URI данных в IE11 URI должен быть в base64. поэтому я взял данные SVG и использовал для них функцию 'btoa' и добавил 'svg + xml; base64' в качестве его MIME-типа.

<img src={`data:image/svg+xml;base64,${window.btoa(data)}`} />