Question

我正在创建一个接受POST和GET请求的基本服务器。我希望能够将图像上传到目录，但是将日期（位置，名称，描述，ID等）上传到JSON文件。当我有一个GET请求时，它会收集路径的最后一部分（即/ upload？image = img1＆image = img2），但是在POST请求的情况下，它只会收集上传路径（即/ admin / gallery）。这样一来，当我解析标题时，它仅会捕获最后提交的图像。

自从我发布到/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

您需要在输入文件中添加ID。请参阅下面的代码。

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);
}

页面仅上传一张图片

1 个答案: