ReactJS - 使用 redux-saga 發送一個空對象

Question

我正在使用 saga.js，當我提出請求時，我的文件是空的。

我需要做一些額外的事情來通過 saga yield 發送一個對象嗎？

我的 saga.js：

export function* uploadS3Request({ payload }) {
  console.log('payload', payload)
  const { uploadTypeName, title, imageHeight, imageWidth, file } = payload

  try {
    yield call(api.post, `https://someurl.com/s3`, {
      uploadTypeName,
      title,
      imageHeight,
      imageWidth,
      file
    })

    toast.success('SUCCESS TEST');

  } catch (err) {
    toast.error('Error while trying to update image');
  }
}

這是我的 saga.js 中有效負載的 console.log：（所有信息都在這里）

但我的請求，文件是空的：

Answer 1

這不是 redux 或 redux-saga 問題，而是制作多部分表單主體的問題。

假設您使用的是axios或apisauce ，您將希望將文件附加到表單數據並發送。

...
const { uploadTypeName, title, imageHeight, imageWidth, file } = payload
const formData = new FormData();
formData.append('file', file);
formData.append('uploadTypeName', uploadTypeName);
...

yield call(api.post, `https://someurl.com/s3`, formData, {
  headers: {
    'Content-Type': 'multipart/form-data'
  }
})
...