Загрузить изображение поверх AJAX в виде двоичного массива
В эти дни у меня была специфическая ситуация на работе, когда мне нужно было загрузить изображение через Ajax. В большинстве случаев, когда вам нужно какое-то изображение с сервера, вы можете напрямую использовать ссылку на изображение в теге изображения <img src="some-link"> . Мой случай был другим, потому что изображение скрывалось за некоторой аутентификационной информацией, которую я отправлял через заголовки.
Я попытался преобразовать строку, содержащую двоичные данные изображения, в строку base64 (btoa), но мои усилия не дали результатов, и браузер показывал мне испорченное изображение значка.
Момент ага наступил, когда я понял, что запрашиваю у сервера бинарный массив, а ответ анализирую как строку. Наш рабочий проект использует axios для AJAX-запросов, поэтому, немного погуглив, я наткнулся на интересный отчет о проблеме проекта axios GitHub. Решение оказалось довольно простым.
Как видите, важной частью является responseType: "arraybuffer”, он указывает axios обрабатывать ответ от сервера как массив, поэтому больше нет необходимости иметь дело с кодированием строк.
