Страница загружает только одно изображение

Question

Я создаю базовый сервер, который принимает POST и GET запросы. Я хочу иметь возможность загружать изображения в каталог, но дату (местоположение, имя, описание, идентификатор и т. Д.) В файл JSON. Когда у меня есть запрос GET, он собирает последнюю часть пути (т.е. / upload? Image = img1 & image = img2), но в случае запроса POST он собирает только путь к загрузке (то есть / admin /галерея). Это делает так, что когда я анализирую заголовок, он берет только последнее изображение, которое было отправлено.

Поскольку я публикую на /upload, у меня есть обработчик, который анализирует запрос и определяет, какой это тип носителя, и записывает содержимое в файл. Все остальное работает нормально, но Я думаю, что он видит несколько объектов с именем "image" и выбрасывает все, кроме последнего.

HTML:

<form method="POST" id="galleryForm" action="/upload" enctype="multipart/form-data">
    <fieldset>
        <label for="gallery">Picture File(s):</label> 
        <input name="image" type="file" multiple />         
        <input type="submit" value="Add Pictures" />
    </fieldset>
    <fieldset>
        <input type="text" name="title" value="Title..." required  />
    </fieldset>
</form>

JavaScript:

if (req.body.image) {
    fs.writeFile(`public/media/images/${req.body.image.filename}`, req.body.image.data, function (err) {
        console.log(req.body.image);
        dataStore.create('gallery', {
            title: req.body.title,
            type: "image",
            description: req.body.description,
            images: ["public/media/images/" + req.body.image.filename]
        }, function (err, id) {
            res.statusCode = 303;
            res.statusMessage = "See Other";
            res.setHeader("Location", "admin/gallery.nsp");
            res.end();
        });
    });
}

Мой файл JSON выглядит так:

"6ed143c4-8493-448f-b3c3-d4e04cc5baaa":{
    "title":"Title...",
    "type":"image",
    "description":"Enter a description...",
    "images":[
        "public/media/images/img1.jpeg"
    ],
    "id":"6ed143c4-8493-448f-b3c3-d4e04cc5baaa"
}

Но должно получиться так:

"6ed143c4-8493-448f-b3c3-d4e04cc5baaa":{
    "title":"Title...",
    "type":"image",
    "description":"Enter a description...",
    "images":[
        "public/media/images/img1.jpeg",
        "public/media/images/img2.jpeg"
    ],
    "id":"6ed143c4-8493-448f-b3c3-d4e04cc5baaa"
}

Answer 1

Вам нужно добавить идентификатор в ваш входной файл.См. Мой код ниже.

html пример

<input name="image" id="my-input" type="file" multiple />  

Для jQuery-удобных людей это так же просто

// assuming there is a file input with the ID `my-input`...
var files = $("#my-input")[0].files;

for (var i = 0; i < files.length; i++)
{
 alert(files[i].name);
}

Для примера javascript

// assuming there is a file input with the ID `my-input`...
var files = document.getElementById("my-input").files;

for (var i = 0; i < files.length; i++)
{
 alert(files[i].name);
}