How to upload a file from local storage to IPFS by using CDN link

js-ipfs
#1

I tried to upload a file from local system to IPFS using Script CDN link but can’t, can anyone solve this.

#2

Can you share more specific details about what you tried and what you expected to happen?

Do you control the IPFS node you were attempting to add a file from the local filesystem to?

#3

Thanks for your response @leerspace

I just did that by uploading image from file system and convert to buffer,uploaded to Ipfs.No problem with that but retrieving image back using hash takes long time even its size is less than 10MB.
Is there any way to speed up retrieving media back fast.
What if i tried to upload a video?

#4

This is non-descript. There are multiple different things that could be described as “upload to IPFS”, so this doesn’t help explain what you did.

It depends on whose IPFS node you uploaded the file to. If it’s yours, then there might be some things you can change. It also depends on how you’re attempting to retrieve the file from IPFS.

  • Whose node did you upload the file to?
  • How are you trying to retrieve the file?
  • Do you have a locally running go-ipfs node you’re trying to retrieve it through?
  • Are you trying to retrieve it through js-ipfs running in a browser? Something else?

Depending on how you’re doing it, the video should upload as with any other kind of file.

#5

@leerspace
I am trying to upload and retrieve file through js-ipfs using Ipfs api cdn link in script tag (running in browser).
Not starting any daemon in local ,uploading media through ipfs.add .I dont know in which node its gonna add.
And then retrieving the uploaded file using the hash acquired while uploading.It takes more long time to retrieve the file through https://gateway.ipfs.io/ipfs/(myhash).

Is there any way to retrieve quickly.

Note : Im using js-ipfs and not starting any local node.

#6

I haven’t been following js-ipfs nearly as much as go-ipfs, so take all of this with a big grain of salt.

My understanding is that peer connectivity and content discovery is currently a bit limited in js-ipfs. I’d expect this to affect the ability of any given gateway node to discover and retrieve content added to your local js-ipfs node.

Perhaps someone else can weigh in on whether this is still accurate or if I’m wrong.

Reference:

Please read this: The DHT, a fundamental piece for automatic content and peer discovery is not yet complete. There are multiple applications that can be built without this service but nevertheless it is fundamental to getting that magic IPFS experience. The current status is that implementation is done and merged and we’re working on performance issues. Expect the DHT to be available in a release very soon.

Having said that, adding some additional nodes to be used for bootstrapping and preloading might be worth trying.

I’m pretty sure that js-ipfs is starting a local node in the browser, but I haven’t seen your code to know for sure if you’re doing the same thing as the published examples.

#7

@leerspace Thanks your valuable response.

I have attached my code for your reference!

    <script src="https://wzrd.in/standalone/buffer"></script>
    <script src="https://unpkg.com/ipfs-api@9.0.0/dist/index.js"></script>
    <script src="https://unpkg.com/ipfs/dist/index.min.js"></script>


const ipfs = new Ipfs({ repo: 'ipfs-' + Math.random() })
const { Buffer } = Ipfs
ipfs.once('ready', () => {
  console.log('Status: ', ipfs.isOnline() ? 'online' : 'offline')
})
function upload() {
  const reader = new FileReader();
  reader.onloadend = function () {
    const buf = buffer.Buffer(reader.result) // Convert data into buffer
    ipfs.add(buf, (err, result) => { // Upload buffer to IPFS
      if (err) {
        console.error(err)
        return
      }
      let url = `https://ipfs.io/ipfs/${result[0].hash}`
      console.log(`Url --> ${url}`)
    })
  }
  const photo = document.getElementById("photo");
  reader.readAsArrayBuffer(photo.files[0]); 
}

<---HTML--->
<input type="file" name="photo" id="photo">
<button type="button" onclick="upload()">Upload</button>

This is the logic of the code, sorry for the non-structured code.

OutPut:

URL-- --> https://ipfs.io/ipfs/[myhash]

Upload takes place in seconds and returns an URL as above.
But retrieving the content back from URL takes long. This is my query. Is there any remedy?

#8

Thanks for the example code. I played around with it a bit, but wasn’t able to improve the time to retrieve content uploaded into js-ipfs from the browser through a public gateway. Perhaps someone else who knows more about js-ipfs will come across this and have better input.

#9

@alanshaw for js-ipfs expertise who maybe has ideas as to where things are getting stuck.

#10

If the concern is related to the speed of retrieval from the gateway, then this is not specific to JS.

For example, after adding a file to local node, and use the generated hash, such as https://ipfs.io/ipfs/< HASH >, the file magically comes back in the browser (though after considerable delay). The question is: how did the file added to a local node come back from remote URL (https://ipfs.io/ipfs/)

This is the content discovery part of the stack, IMO. For example,

  • Does the public gateway (https://ipfs.io/ipfs/) use DHT to index and retrieve the content? or
  • Does it flood the query to all connected nodes?

Answer to this can possibly point to if this retrieval time can be improved. For example:

  • Is there a way one can make the public gateway (https://ipfs.io/ipfs/) become aware before hand that some content is available (before some one actually asks it and query starts) ?
  • is there a way the flood query mechanism be improved?