通过form-data axios上传文件的问题

Question

我正在尝试上传服务器文件，但它给我的响应是未选择文件。和axios和form-data的文档做同样的事情，但是还是有错误。

let form = new FormData();
form.append('file', fs.createReadStream('./files/50.jpg'));

const config = {
    headers: {
        ...form.getHeaders(),
        Authorization: token
    }
}

axios.post(url, form, config)
.then(response => console.log(response.data, response.status))
.catch(err => console.error(err.config, err.response.data))

响应是

{
  url: 'https://example.com',
  method: 'post',
  data: FormData {
    _overheadLength: 148,
    _valueLength: 0,
    _valuesToMeasure: [ [ReadStream] ],
    writable: false,
    readable: true,
    dataSize: 0,
    maxDataSize: 2097152,
    pauseStreams: true,
    _released: true,
    _streams: [],
    _currentStream: null,
    _insideLoop: false,
    _pendingNext: false,
    _boundary: '--------------------------897634953482711246524185',
    _events: [Object: null prototype] { error: [Function: handleStreamError] },
    _eventsCount: 1
  },
  headers: {
    Accept: 'application/json, text/plain, */*',
    'Content-Type': 'multipart/form-data; boundary=--------------------------897634953482711246524185',
    Authorization: 'Bearer token',
    'User-Agent': 'axios/0.19.2'
  },
  transformRequest: [ [Function: transformRequest] ],
  transformResponse: [ [Function: transformResponse] ],
  timeout: 0,
  adapter: [Function: httpAdapter],
  xsrfCookieName: 'XSRF-TOKEN',
  xsrfHeaderName: 'X-XSRF-TOKEN',
  maxContentLength: -1,
  validateStatus: [Function: validateStatus]
} { errors: [ { code: 65536, message: 'Must upload one file' } ] }

请问怎么上传文件，哪里出错了？或者你可以提供一些替代方法来解决这个问题。

Answer 1

这里是我在 node.js 中上传文件的代码，它工作正常。

    const form = new FormData();
    const file = fse.createReadStream(option.filePath);
    form.append('file', file);
    const header: any = form.getHeaders();
    const reqData = axios({
      method: 'post',
      url: 'myURL',
      data: form,
      headers: header,
      httpsAgent: new https.Agent({
        rejectUnauthorized: false
      }),
      maxContentLength: Infinity,
      maxBodyLength: Infinity,
      onUploadProgress: (progressEvent: any) => {
        const complete = (progressEvent.loaded / progressEvent.total * 100 | 0) + '%';
        console.log('upload percent: ' + complete);
      }
    }).then((response: any) => {});

Answer 2

谢谢大家，但我在 Postman.Code -> NodeJs - Axios

中找到了答案

var axios = require('axios');
var FormData = require('form-data');
var fs = require('fs');
var data = new FormData();
data.append('file', fs.createReadStream('/Users/anton/Downloads/50 (1).jpg'));

var config = {
  method: 'post',
  url: 'https://...',
  headers: { 
    'Authorization': 'Bearer ...', 
    'Content-Type': 'multipart/form-data', 
    ...data.getHeaders()
  },
  data : data
};

axios(config)
.then(function (response) {
  console.log(JSON.stringify(response.data));
})
.catch(function (error) {
  console.log(error);
});

通过form-data axios上传文件的问题

Problem with uploading file through form-data axios

javascript

post

multipartform-data

form-data

axios