currently i am using react with nodeJS and express as api. When I send data to api using redux saga without formData it works fine, but when I try to submit with formData, there is an res message and I think it happened because the payload that was sent was empty
and on the network-payload tab, no form data is sent
here's the code I use
export const addNewData = values => {
const data = new FormData()
data.append("nama", values.nama)
data.append("harga", values.harga)
// data.append("image", selectedFiles)
data.append("fasilitas", values.fasilitas)
data.append("deskripsi", values.deskripsi)
post(url.ADD_NEW_DATA, data, {
headers: { "content-type": "multipart/form-data" },
})
}
and
const axiosApi = axios.create({
baseURL: API_URL,
})
axiosApi.defaults.headers.common["authorization"] = token
axiosApi.interceptors.response.use(
response => response,
error => Promise.reject(error)
)
export async function post(url, data, config = {}) {
return axiosApi
.post(url, { ...data }, { ...config })
.then(response => response.data.data)
}
then I tried directly on the submit button without using redux saga and it worked perfectly
Axios.post("http://localhost:4000/v1/data/insert", data, {
headers: {
"content-type": "multipart/form-data",
"authorization": token,
},
})
.then(res => {
console.log("success ", res)
})
.catch(err => console.log(err))
Can anyone help me please? I want to keep using redux saga
UPDATE When i change {...data} to data in async function, formData is successfully sent normally, anyone can explain about this? will it affect when I submit data not in formData format?
export async function post(url, data, config = {}) {
return axiosApi
.post(url, data, { ...config })
.then(response => response.data.data)
}
Solved by changing {...data} to data
export async function post(url, data, config = {}) {
return axiosApi
.post(url, data, { ...config })
.then(response => response.data.data)
}