鍍金池/ 問答/Java  PHP  Python  HTML/ axios,formData提交的時(shí)候,怎么一起提交文件和數(shù)據(jù),如下圖和代碼

axios,formData提交的時(shí)候,怎么一起提交文件和數(shù)據(jù),如下圖和代碼

問題

axios,formData提交的時(shí)候,怎么一起提交文件和數(shù)據(jù)

前臺(tái)vue

        submitForm(event) {
            event.preventDefault();
            let formData = new FormData();
            formData.append("file", this.file);
            formData.append("data", {
                "aa":"aa",
                "bb":"bb",
                "cc":"cc"
            });
            let config = {
                headers: {
                    "Content-Type": "multipart/form-data"
                }
            };

            axios
                .post("http://localhost:3000/upload", formData, config)
                .then(function(res) {
                    if (res.status === 2000) {
                        /*這里做處理*/
                    }
                });
        },

后臺(tái)node

router.post('/upload', upload.single('file'), async(ctx, next) => {
    // console.log(ctx.req)
    console.log(ctx.req.body.data.aa)
    console.log(ctx.req.file)
    await userModel.imgInsertInto([ctx.req.file.filename, new Date()])
        .then(result => {
            ctx.body = {
                code: 200,
                msg: '圖片上傳成功',
                data: result
            }
        })
        .catch(error => {
            console.log(error)
            ctx.body = false;
        })
        // ctx.body = {
        //     filename: ctx.req.file.filename //返回文件名  
        // }
})

打印接收到的數(shù)據(jù)

clipboard.png

回答
編輯回答
厭惡我

append的第二個(gè)參數(shù)不是對(duì)象

參考:MDN

2018年9月2日 21:13
編輯回答
墨染殤
formData.append("data", {
                "aa":"aa",
                "bb":"bb",
                "cc":"cc"
});//意思是({}).toString() -> [object Object]

form-data是傳不了json的,只有textfile兩種格式。

form-data報(bào)文結(jié)構(gòu)

------Boundary
Content-Disposition: form-data; name="file"; filename="file.txt"
Content-Type: text/plain

------Boundary
Content-Disposition: form-data; name="text"

val
2018年7月31日 08:52