Требуется для преобразования 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, …}

Надеюсь, это поможет вам. Пожалуйста, оставляйте свои отзывы, так как они мне понадобятся, чтобы стать лучше.