miércoles, 7 de junio de 2017

Subir archivos a una API usando axios

Esta semana estaba trabajando en un feature de un proyecto, y me tope con el problema de subir un archivo a una API. Sin embargo, simplemente al enviar el archivo como data, la API me respondía un status 415 (Unsupported Media Type).

Para solucionarlo, podemos crear una variable FormData y agregar el archivo con el nombre que espera el servidor. De esta forma:

const formData = new FormData();
formData.append(name, file)

Y luego, creamos una variable de configuracion con el content-type correcto, de la siguiente forma:

const config = {
   headers: {
      'content-type': 'multipart/form-data'
   }
}

Luego solo tenemos que llamar a axios como lo haríamos normalmente:

axios.post(url, formData, config);

Código de ejemplo

'use strict';
const axios = require('axios')
module.exports = (url, file,name='file') => {
   if (typeof url !== 'string') {
      throw new TypeError(`Expected a string, got ${typeof url}`);
   }
   const formData = new FormData();
   formData.append(name,file)
   const config = {
      headers: {
      'content-type': 'multipart/form-data'
      }
   }
   return axios.post(url, formData,config)
};

0 comentarios:

Publicar un comentario