IPFS : Axios responses not properly structured

Hello,
I am working on a dapp and doing my request for infura ipfs api with Axios.
The ‘path’ file argument is required, so I used FormData() to make my path and add multiple files and directories in one request, using form.append() several time.

But the response given to me by infura API is not a correct object.
Do you have any suggestions for the response to be properly structured?
(i can’t use JSON.parse() I have a syntax error)

You can find my request below:

  const form = new FormData();

  for (let i = 0; i < _files.length; i++) {
    form.append(
      "path",
      new Blob(new Int8Array(_files[i].result)),
      _files[i].path
    );
  }

  const res = await axios
    .post("https://ipfs.infura.io:5001/api/v0/add", form, {
      params: {
        "wrap-with-directory": true,
        recursive: true,
      },
      headers: {
        Authorization: auth,
      },
    })
    .catch(function (error) {
      if (error.response) {
        // Request made and server responded
        console.log(error.response.data);
        console.log(error.response.status);
        console.log(error.response.headers);
      } else if (error.request) {
        // The request was made but no response was received
        console.log(error.request);
      } else {
        // Something happened in setting up the request that triggered an Error
        console.log("Error", error.message);
      }
    });

and the response here:

{data:"{"Name":"oue/1/doc 1.txt","Hash":"Qmb54JErK89sKBHaYmECAA2h4stLu1chRGc1f94ikMG9DA","Size":"80"}
{"Name":"oue/1/1.1/doc 1.txt","Hash":"QmQfgAgGhQbAaLnPr6jTFjnyAkgEhVYoeoqAcHLEqbL9W7","Size":"135"}
{"Name":"oue/1/doc 2.txt","Hash":"QmZ3RT7fPJVixXS644vRAUk2752bfd3da35FSCUxyjn7TG","Size":"18982"}
{"Name":"oue/capybara.png","Hash":"QmX3CeNum4TpqVL73cF23R12BwHk52VcGr11KWuiDy73sq","Size":"40804"}
{"Name":"oue/doc 1.txt","Hash":"Qmb54JErK89sKBHaYmECAA2h4stLu1chRGc1f94ikMG9DA","Size":"80"}
{"Name":"oue/Rectangle 1.png","Hash":"QmQmxL9VnoBnCXuMZiUkyX16VZrSrrpLR4JamLFzBJUcVL","Size":"156056"}
{"Name":"oue/sqdq/Mask for the deaf-rafiki.png","Hash":"QmezcovZZrwEgweLuZxWMFtXV5QSNRh3d4fGevBTFybf3o","Size":"612676"}
{"Name":"oue/1/1.1","Hash":"QmTLvseRvuJmN93jEHm8vtJpdsYpwc3b6DyzmrjczZ5nFU","Size":"191"}
{"Name":"oue/1","Hash":"QmdWZp6yx6cg1tr32b12a1KXvfjuRXxctMAULKhK8QoanV","Size":"19407"}
{"Name":"oue/sqdq","Hash":"QmUTA74bLBLbW5e8HEAEiAeRnivd6s4Zgaq5JRgRnsLvgz","Size":"612752"}
{"Name":"oue","Hash":"QmaxH7fi5pixAaEh7JEqhh7PRrhTsUey6PDGs1N8EBFf3C","Size":"829362"}
{"Name":"","Hash":"Qmbmqy65H2PZmmaRHgWSEfAXhS8o4YvpoWM3WoTi1M7izh","Size":"829413"}
"}

Hi KAM,

Welcome to our forums!

If I’m reading your code right, the output you show is coming from the
console.log(error.response.data);
And that’s what I’d expect to see.

Try outputting the res that get’s returned - this is the actual response - I think you’ll have a better result.

Warm regards,
Chris | Infura | ConsenSys

Hello Chris,

Sorry, it’s my fault, I forgot to put the end of my code, the output comes from “console.log(res.data)”.
I did a lot of research, and the problem may be axios because I found this: https://github.com/axios/axios/issues/3116#issuecomment-842466841

or maybe the way I send multiple files. Anyway, the only way I found to solve this was to put the following code in my axios query.

   transformResponse: [
        function (data) {
          data = JSON.parse("[" + data.split("}\n{").join("},{") + "]");
          return data;
        },
      ]
1 Like