图片传输到ipfs节点然后将生成的ipfs访问链接存到区块链
生活随笔
收集整理的這篇文章主要介紹了
图片传输到ipfs节点然后将生成的ipfs访问链接存到区块链
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
在區塊鏈上直接存儲圖片不僅時間很長，而且需要進行分片和拼接，比較麻煩，我們直接使用ipfs存儲圖片
流程描述：
首先在本地搭建ipfs節點，使用go-ipfs版本進行搭建，搭建完之后，使用 ipfs daemon指令啟動ipfs服務監聽，同時占用8080端口。
使用時我們需要先打開ipfs服務，再啟動項目，避免端口沖突。正確啟動之后的命令行應該如下圖所示。
服務啟動成功后，我們首先在我們的前端綁定一個input，這個input的type是file類型，同時指定一個id，我們通過這個id獲取到這個文件(1)。然后將這個文件賦值(2)
1.<input type="file" class="form-control add_img" id="co_img" placeholder="Ex: 請選擇圖片">2.const file = document.getElementById("co_img").files[0];實現這兩步之后，我們相當于把文件取出來了，取出來之后，我們再把這個文件當成參數傳到saveImageOnIpfs方法里，saveImageOnIpfs方法里有一個ipfs.add()方法，此方法就是將圖片傳輸到ipfs上，同時返回傳輸回的結果，會有一個hash值返回，resolve函數可以將hash值作為返回值再傳到.then里的函數的參數，然后拼接成一個
類似這種的鏈接，即href，然后我們再在這個this函數里面調用App.addcollectionsUp方法把鏈接和相關數據上傳到區塊鏈上。
addcollectionsUp函數定義如下：
addcollectionsUp: async function() {let _conum = $("#co_num").val();// console.log(img_href);let _coprice = $("#co_price").val();let _coname = $("#co_name").val();let _cointro = $("#co_intro").val();const { addCollectionUp } = this.meta.methods;let result = await addCollectionUp(_conum, _coprice, _coname,_cointro,img_href).send({ from: this.account });console.log(result);window.location.reload(); },我們只需要把生成的href賦值給img_href就可以直接傳到區塊鏈上了。然后再取出來在前端渲染即可。
總結
以上是生活随笔為你收集整理的图片传输到ipfs节点然后将生成的ipfs访问链接存到区块链的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Rust更适合经验较少的程序员？
- 下一篇： 微信云开发技术架构