tengo ya un par de días dandole vueltas a la situacón pensando que este error estaba en mi backend, no obstante hoy al intentar almacenar una imagen desde postman no tuve problema alguno por lo que supongo el problema de Raiz está en la forma en la que envio formdata con la imagen al servidor.
Estoy usando Expo image-picker para obtener una imagen y mandarla al servidor, el problema es que creo que no lo estoy haciendo correctamente ya que el servidor me muestra el request como null y por lo tanto no pasa nada, este es el codico que estoy intentando:
//Codigo en el componente
const imagepreview = async()=>{
let result = await ImagePicker.launchImageLibraryAsync({
allowsEditing: true,
aspect: [4, 3],
quality: 1,
});
console.log(result)
if(result.cancelled == false){
setImage(result.uri)
seturi(result.uri)
let localUri = result.uri;
let filename = localUri.split('/').pop();
// Infer the type of the image
let match = /\.(\w+)$/.exec(filename);
let type = match ? `image/${match[1]}` : `image`;
settype(type)
setname(filename)
}
}
const sendData = async()=>{
let data = {uri:image,type:fileType, name:name}
// Upload the image using the fetch and FormData APIs
let formData = await new FormData();
// Assume "photo" is the name of the form field the server expects
await formData.append('photo', data);
const send = await user.changeprofilepicture(formData)
}
Codigo en la clase en la que hago las peticiones, sí la estoy mandando dos veces y nunguna de las dos funciona:
async changeprofilepicture(formdata){
console.log(formdata)
const token = JSON.parse(localStorage.getItem('user-token'))
let url = baseurl+'changeprofilepicture'
let options = {
headers: {
'content-type': 'multipart/form-data'
}
}
await axios.post(url, formdata, options)
await fetch( {
method: 'POST',
body: formdata,
headers: {
'Accept': 'application/json',
['Content-Type']:'multipart/form-data',
},
});
await axios.post(url, {
photo: formdata
}, {headers :
{'Content-Type':undefined}})
}
Y por ultimo mi codigo en el servidor
async changeprofilepicture({request, response}:HttpContextContract){
try{
const file = request.file('photo')
console.log(file)
await file?.move(Application.tmpPath())
return response.json({
status: 'sure'
})
}catch (e){
console.log(e)
}
}
Hago enfasis en que desde postman esto está funcionando no obstante estoy seguro de que el error está en la manera en la que envio formdata al servidor, agradecería mucho que alguien pudiese al menos ponerme en el camino correcto para salir del bache en el que ahora estoy