Блог

TL;DR: На моем веб-сайте у меня есть имя файла статического файла, и мне нужен массив Blob или байт.

Я предполагаю, что об этом уже спрашивали раньше, так как это довольно просто, но я уже потратил на это 2 часа, и все вопросы касаются <input> элементов / событий / элементов DOM, и я просто хочу прочитать файлы, которые у меня уже есть, когда сайт построен.

Я пытаюсь быстро создать локальный веб-сайт с несколькими изображениями и кнопкой, которая при нажатии должна вызывать вызов API, с прикрепленными к ней изображениями.

Сайт построен с использованием самого простого express приложения, которое я смог найти. Я просто побежал npx express-generator --no-view , чтобы получить самый простой HTML-шаблон. Для всех намерений и целей все происходит в одном файле — index.html .

Я хочу, чтобы файлы были преобразованы в потоки байтов, большие двоичные объекты или во что-нибудь, с чем я мог бы работать. Теперь у меня есть изображения в public папке приложения. Предполагая , что я знаю имена файлов и могу получить к ним доступ index.html / <script> , как я могу перейти от имени файла к Blob байтовой строке или чему-либо подобному?

Иллюстрация в коде:

 img1_fname = "/images/img1.png"
img2_fname = "/images/img2.png"
...
imgN_fname = "/images/imgN.png"

// Question
img1_bytes = ???
img2_bytes = ???
...
imgN_bytes = ???

var formData = new FormData();
formData.append(img1_fname, img1_bytes);
formData.append(img2_fname, img2_bytes);
...
formData.append(imgN_fname, imgN_bytes);

var request = new XMLHttpRequest();
request.open("POST", URL);
request.send(formData);