Cannot get image from ipfs in vuejs

Question

I want to get an image from IPFS into my Vue/Nuxt project. I already import ipfs by 'npm i ipfs'. But when i run "cont node = Ipfs.create()". it show error but this error doesn't always happen, many times it works and I can get the image normally. Has anyone ever encountered this situation and have a solution?

async downloadImg () {
  const node = await Ipfs.create()
  const { agentVersion, id } = await node.id()
  this.agentVersion = agentVersion
  this.id = id
  const cid = '/ipfs/QmY2dod6X7GFmqnQ6qCBiaeNxJWa3CYQaxEjGUfL5CqMAj'
  // load the raw data from js-ipfs (>=0.40.0)
  const bufs = []
  const a = node.cat(cid)
  for await (const buf of node.cat(cid)) {
    bufs.push(buf)
  }
  const data = Buffer.concat(bufs)
  const blob = new Blob([data], { type: 'image/jpg' })
  this.imageSrc = window.URL.createObjectURL(blob)
},

score 0 · Answer 1 · answered Oct 25 '20 at 01:11

0

If am I true it can depends on the web protocol which you use, if you use https its work and in other protocol not !

answered Oct 25 '20 at 01:11

soroush

742
6
10

it is IPFS. But sometimes it works, sometimes not. I am very confused – xXSteroidsXx Oct 25 '20 at 03:21

score 0 · Answer 2 · answered Oct 26 '20 at 14:24

0

The web crypto API is only available on pages accessed via https. If you're seeing that message, you are probably accessing the page via plain http.

Follow the github link at the top of the stack trace for more explanation and solutions.

answered Oct 26 '20 at 14:24

achingbrain

191
2

Cannot get image from ipfs in vuejs

2 Answers2