Post Library Call from Angular Application

Developer Experience
1

When trying to make a post call to the /library endpoint to add media to our company CMS, the body data seems to be ignored when sent through an axios post request or xhr post request. I do see a record added to the root folder of the CMS but it does not have the given name, tag, or file and it ignores the folderId entirely (because it goes to the root folder). When using postman with the same data, however, the post request works properly.

Steps I am following:

  1. Create a FormData object to use as the data passed to the post request, like below:

      const form = new FormData();    
  form.append('name', body.name);
  form.append('folderId', body.folderId);
  form.append('files', body.files);
  form.append('tags', body.tags);

  2. Include the proper token for our CMS as part of the auth header and set content type as “multipart/form-data”

  3. Call axios.post(url, form, config);

RESULT: 200 Success/OK response, record added to root folder with what looks like a UUID as a name, red X as file thumbnail, and no included tags.

Any thoughts or suggestions would be greatly appreciated!

2

You’re snippet looks good actually, so I am not sure why that isn’t working.

If you go to your working postman call and pull out an Axios code sample, does it look reasonable?

This is what I get, which is basically what you have:

const axios = require('axios');
const FormData = require('form-data');
const fs = require('fs');
let data = new FormData();
data.append('files', fs.createReadStream('/path/to/file'));
data.append('name', 'NAME');

let config = {
  method: 'post',
  maxBodyLength: Infinity,
  url: 'http://localhost/library',
  headers: { 
    'Authorization': 'Bearer xxxxxxx', 
    ...data.getHeaders()
  },
  data : data
};

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