solidity drive app using the traffic react box

Question

I was making solidity drive app using the traffic react box.

Drag the file to your browser to upload the file to ipfs and attempt to save the returned hash value by calling the deployed smart contact.

When the file is decried, the error 'POST http://localhost:5001/api/v0/add?stream-channels=true 403 (Forbidden)' is returned.

I need help with how to fix it.

// here is my onDrop Event Code

  onDrop = async (file) => {
try {
  const {contract, accounts} = this.state;
  const stream = fileReaderPullStream(file);
  const result = await ipfs.add(stream);
  const timestamp = Math.round(+new Date() / 1000);
  const type = file.name.substr(file.name.lastIndexOf(".")+1);
  let uploaded = await contract.methods.add(result[0].hash, file.name, type, timestamp).send({from: accounts[0], gas: 300000})
  console.log(uploaded);
  this.getFiles();
} catch (error) {
  console.log(error);
}

};

hextet · Accepted Answer · 2019-12-21T23:18:42.180

This is a CORS issue. The IPFS HTTP API can't be accessed directly from a browser like this, you will need to place it behind something like an NGINX server configured to handle CORS properly for it to work properly with browser based requests.

edit:

Additionally if you would prefer to not use NGINX, you can alter the ipfs node configuration directly to override the list of domains you can access from. See here for more information.

solidity drive app using the traffic react box

1 Answers1