Требуется для преобразования URL-адреса base64 в файл, который можно легко отправить на серверную часть. Итак, я получил код из stackoverflow. Тем не менее, я действительно не понимал код, и я решил пойти изучить код и поделиться тем, что я узнал.
Это рабочий код, полученный из Stackoverflow.
function dataURLtoFile(dataurl: string, filename: string) { var arr = dataurl.split(","), mime = arr[0].match(/:(.*?);/)[1], bstr = atob(arr[arr.length - 1]), n = bstr.length, u8arr = new Uint8Array(n); while (n--) { u8arr[n] = bstr.charCodeAt(n); } return new File([u8arr], filename, { type: mime }); }
В этой статье я объясню, что делает приведенный выше код. Я объясню каждую строку, насколько мне известно.
Код определяет функцию dataURLtoFile
, которая принимает два параметра: dataurl(in my case was a base 64 url)
и filename(what name you would like to give to the file )
. Цель этой функции — преобразовать URL-адрес данных в объект File, который может быть полезен для различных целей, таких как загрузка файлов или работа с двоичными данными в JavaScript.
var arr = dataurl.split(",")
: Параметр dataurl
– это URL-адрес данных, который начинается с префикса типа "data:image/jpeg;base64", за которым следуют фактические данные в кодировке base64. В коде используется метод split
для разделения dataurl
на символ запятой ','. Результатом является массив с именем arr
, где первый элемент (индекс 0) — это префикс (последовательность символов, которая появляется в начале строки или идентификатора), а второй элемент (индекс 1) — это данные в кодировке base64. .
давайте назовем это примером dataUrl : 8pPX9aQxx4PPGPWkB//9k=
mime = arr[0].match(/:(.*?);/)[1]
: Эта строка извлекает MIME-тип данных из префикса. Он использует регулярное выражение (/(.*?);/
) для сопоставления всего, что находится между двоеточием (':') и первой точкой с запятой (';'). Совпадающая часть представляет тип MIME и фиксируется с помощью круглых скобок. [1]
в конце получает доступ к захваченной части матча. Например, если URL-адрес данных — data:image/png;base64,..., mime
будет установлен на image/png.
bstr = atob(arr[arr.length - 1])
: Функция atob
используется для декодирования данных в кодировке base64, которые являются последним элементом массива arr
. Декодированные двоичные данные хранятся в переменной bstr
.
n = bstr.length
: переменной n
присваивается длина двоичной строки bstr
.
u8arr = new Uint8Array(n)
: создается новый массив Uint8Array длиной n
, где каждый элемент представляет собой 8-битное целое число без знака.
while (n--) { u8arr[n] = bstr.charCodeAt(n); }
: Этот цикл перебирает каждый символ в двоичной строке bstr
, начиная с последнего символа и двигаясь к первому. Он преобразует каждый символ в его символьный код (числовое значение, представляющее символ) и сохраняет его в соответствующей позиции в массиве Uint8Array u8arr
. Это эффективно преобразует двоичную строку в Uint8Array.
return new File([u8arr], filename, { type: mime });
: Наконец, функция создает новый объект File, используя Uint8Array u8arr
, указанный filename
и тип mime
. Объект File представляет данные файла, которые можно использовать для дальнейших операций, таких как отправка их как часть представления данных формы или сохранение их в файловой системе.
Вывод должен выглядеть так
File {name: 'earth.jpg', lastModified: 1690510405362, lastModifiedDate: Fri Jul 28 2023 03:13:25 GMT+0100 (West Africa Standard Time), webkitRelativePath: '', size: 235994, …}
Надеюсь, это поможет вам. Пожалуйста, оставляйте свои отзывы, так как они мне понадобятся, чтобы стать лучше.