簡體   English   中英

如何通過formdata發送帶有文件的對象數組

[英]How to send array of objects with files via formdata

所以我試圖通過 axios 將一組對象發送到后端(我正在使用 express.js)。 當我發送沒有文件的對象時,我沒有問題,但是一旦我嘗試用它發送文件,我就遇到了一些問題。 我知道我必須使用 formData 來做到這一點,而且我之前已經這樣做了,但是這次我有一個需要發送的多個對象的數組。 所以不知道這次 append 是如何工作的。 這是我的對象的簡化版本

const treatementListe = {
    "id": 0,
    "date": "2021-10-22T09:41:19.678Z",
    "selectedTraitements": "Injection1",
    "selectedZones": "Face",
    "traitementNote": "Careful",
    "files": [
        {
            "upload": {
                "uuid": "be68c533-92d5-4f5d-b9e4-ba338f264641",
                "progress": 100,
                "total": 20261,
                "bytesSent": 20261,
                "filename": "1617826401810IMG-20210211-WA0002.jpg",
                "chunked": false,
                "totalChunkCount": 1
            },
            "status": "success",
            "previewElement": {},
            "previewTemplate": {},
            ...etc
        }
    ]
},

{
    "id": 1,
    "date": "2021-10-22T09:41:19.678Z",
    "selectedTraitements": "Injection2",
    "selectedZones": "Ear",
    "traitementNote": "Careful",
    "files": [
        {
            "upload": {
                "uuid": "be68c533-92d5-4f5d-b9e4-ba338f264641",
                "progress": 100,
                "total": 20261,
                "bytesSent": 20261,
                "filename": "1617826401810IMG-20210211-WA0002.jpg",
                "chunked": false,
                "totalChunkCount": 1
            },
            "status": "success",
            "previewElement": {},
            "previewTemplate": {},
            ...etc
        }
    ]
}

axios 發布請求

typeForm() {
        const fd = new FormData();
        fd.append('traitementsListe', traitementsListe)
        //isn't working
        console.log(traitementsListe)
        if(traitementsListe.length > 0) {
             const patient = axios.post(`${baseUrl}addOldfolder`, fd)
            .then(response => {
                console.log(response)
                
                 return response.data;
         }).catch(error => ({ error: JSON.stringify(error) }));  
         }
        
    }

編輯:這是我的后端代碼

router.post('/addOldfolder', async(req,res) =>{
    
    try {
        console.log(req.body)
        // output empty object
        res.send(req.body)
        // sends empty object
    } catch(err){
        res.status(400).send(err);
    }
})

喜歡下面

fd.append('traitementsListe', JSON.stringify(traitementsListe));

問題解決了。 但我真的不明白為什么它有效,我所要做的就是添加

router.post('/addOldfolder', upload.array("files"), async(req,res) =>{
    
    try {
        console.log(req.body)
        // output empty object
        res.send(req.body)
        // sends empty object
    } catch(err){
        res.status(400).send(err);
    }
})

因為我在上傳文件時多次使用該中間件。 我設法通過添加中間來控制對象!

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM