Многобайтовое Unicode декодирование некорректно из данных URI

Question

У меня недавно была проблема с URI данных html:

Мой исходный html содержал символ ā, который правильно отображался, когда html загружался напрямую. Однако когда html был преобразован в URI данных, вместо этого символ отображался как Ä.

. После просмотра полученного URI я обнаружил, что символ был закодирован как %c4%81, но это кажетсячтобы быть правильной кодировкой URI ā.

Я даже пытался преобразовать URI данных в base64, но у меня возникла та же проблема. Похоже, это происходит как в Chrome, так и в Safari.

Мне интересно, есть ли проблема с кодированием многобайтовых символов Юникода в URI данных, потому что ā в настоящее время является единственным многобайтовым символом в моемhtml.

console.log(encodeURIComponent('ā'));

// https://stackoverflow.com/questions/23223718/failed-to-execute-btoa-on-window-the-string-to-be-encoded-contains-characte
console.log(btoa(unescape(encodeURIComponent('ā'))));

<iframe src="data:text/html,%c4%81"></iframe>
<iframe src="data:text/html;base64,xIE="></iframe>

Answer 1

Вам необходимо указать кодировку вашего символа при работе с URI текстовых данных, чаще всего UTF-8.

Если вы просто добавите объявление ;charset=UTF-8 к вашему типу mime, браузер будет правильно декодировать символ.

<iframe src="data:text/html;charset=UTF-8,%c4%81"></iframe>
<iframe src="data:text/html;charset=UTF-8;base64,xIE="></iframe>