如何使用Axios上传FormData?

时间:2018-08-13 02:14:40

标签: javascript node.js vue.js axios

我正在尝试使用formData从前端上传3张照片。它将调用外部API进行上传。但是遇到如下错误。

前端上传

 const formData = new FormData()
  formData.append('photoA', this.photoA)
  formData.append('photoB', this.photoB)
  formData.append('photoC', this.photoC)
   axios.post(`http://localhost:4172/uploadDocs`, 
      { 
          data: formData,
          accessToken: store.state.token
      },
      { headers: {
          // 'Content-Type': 'Application/json',
          // 'x-access-token': localStorage.getItem('token')
        }
      }
    ).then (function (response) {
      return response.data
    })

Nodejs上传API

async uploadDocs (req, res) {
    const options = {
        method: "POST",
        url: "https://example.com/api/v1/users/uploadDocuments?access_token=" + req.body.accessToken,
        headers: {
            //"Authorization": "Basic " + auth,
            //"Content-Type": "multipart/form-data"
        },
        data: req.body.data
    };
    try {
        request(options, function (err,response,body){
            if (err) {
                res.send(err)
            } else {
                res.send(response.body)
            }
        })
    } catch (error) {
        res.status(400).send({
            error: "Server error."
        })
    }
}

所以这里有2个错误:

a)前端错误:它不断在HTML中产生Cannot POST /错误

b)后端错误:

<h1>Cannot read property &#39;photoA&#39; of undefined</h1>
<h2></h2>
<pre></pre>

为此奋斗了几天。任何帮助将不胜感激。

0 个答案:

没有答案