|
|
本帖最后由 赤膊医数 于 2021-4-22 23:41 编辑
% |( M, U1 k2 R c* p' I' U2 z" j+ Y/ w. ^. q& h1 [
2018年,最火爆且值得期待的区块链项目莫过于EOS和IPFS。1、IPFS简介- IPFS是什么
, q7 T0 @$ P3 q" Z3 p9 |8 N' M星际文件系统IPFS(InterPlanetary File System)是一个面向全球的、点对点的分布式版本文件系统,目标是为了补充(甚至是取代)目前统治互联网的超文本传输协议(HTTP),将所有具有相同文件系统的计算设备连接在一起。原理用基于内容的地址替代基于域名的地址,也就是用户寻找的不是某个地址而是储存在某个地方的内容,不需要验证发送者的身份,而只需要验证内容的哈希,通过这样可以让网页的速度更快、更安全、更健壮、更持久。
' O& R& r% r6 ~) H- Q b$ l以上内容来自巴比特官网介绍
7 @, P$ B( S' q p gIPFS是基于区块链技术的去中心化存储网络,实现了永久性存储。+ S# o W7 C) j0 P3 ]3 N6 q
- IPFS的火热( s% N# E$ ]2 ]5 b
Filecoin ICO是迄今为止涉及金额最大的ICO,仅一小时就募集了接近2亿美元,打破ICO记录,成为2017年最火爆的区块链项目。IPFS项目吸引了世界各地数字货币投资者和互联网从业者的密切关注,2018年比较值得期待的是IPFS主网的上线。然而就在前段时间,官方公布说上线时间延期到年底。$ d) S# _( t) w' X6 w- F7 m+ E
注:Filecoin是IPFS激励层的加密数字货币(即代币),有点类似于以太坊平台上的以太币。+ R5 C: ?$ l$ U; Y
IPFS官网:https://ipfs.io/
" _' @1 M1 O% k7 ? l$ N% s; SFilecoin官网:https://filecoin.io/
# w q+ f& U( ^ - IPFS的应用案例
# ^+ }3 a" g: u' \$ S2 E& H: uGitHub有两款开源项目,且有对应网址,分别是音乐播放器和视频播放器。5 M: G; ~+ s- s" n
, k6 D6 N3 g' T6 b; l5 i" _
- IPFS音乐播放器
9 S1 W( T7 K2 p2 Z- V
7 ~/ }0 l! G% z1 F& ~& H& _
. { f+ n% ^! r! X0 M# Q0 [
' a5 }; [4 A0 }- d
* E& F6 z& z- o' I- l1 jIPFS音乐播放器5 Z, j" K$ R4 N7 W& ^4 Z# z9 F
1 I& M; U/ Q2 v( E( l6 {IPFS音乐播放器网址:https://diffuse.sh/
, K. Z4 L! g/ V3 sGitHub地址:https://github.com/icidasset/diffuse. ~/ l- `5 D3 A+ g
- IPFS视频在线播放器
+ a5 u9 S; T9 N7 u( z5 P7 Z1 B
* \) ?! ?4 u; h: X8 K1 J& f1 s0 B6 T& b9 g. I+ F
5 e- E' Q- _2 P/ o* f- G) D7 N- ]) W. L( E" D/ A% B2 R
IPFS视频在线播放器首页
4 X3 ^* N# F# w9 ?$ g5 Y7 Y l0 N6 h) P. t
7 c' j6 i5 T4 _ ^8 m/ S
. P2 B/ y& {( e$ }
7 F) f; Z* v m: v/ o# k# P8 F: M4 y {) t1 m6 ^5 h0 E1 ~
IPFS视频在线播放器播放电影* D) h ] Q2 [7 p \! j( a% ~
- W7 a L# {. {: g. G! t号称是国内第一个IPFS应用( g8 S9 L. t2 |! p6 `, B! |9 S
IPFS视频在线播放器网址:http://www.ipfs.guide/( j6 _4 S; Y/ p+ O$ U
GitHub地址:https://github.com/download13/ipfstube
1 L+ A6 ~+ `3 u+ q可用于测试的电影视频Hash(这里只列举两部):
$ s. a3 O, l! f% S1 w( V神秘巨星:QmWBbKvLhVnkryKG6F5YdkcnoVahwD7Qi3CeJeZgM6Tq68
# X/ P- e: d" x7 k, d2 |3 Y盗梦空间:QmQATmpxXvSiQgt9c9idz9k3S3gQnh7wYj4DbdMQ9VGyLh
7 l% F" f9 m* j! T 2、IPFS的安装既然IPFS这么牛,有必要了解一下IPFS的开发,先从IPFS的安装开始。* a; a% Y- A+ |) Z* S
- IPFS Desktop
* c' x/ x( D. f" u4 [1 H当然,可以直接安装IPFS节点桌面管理软件来体验一下。该软件可以方便地运行和管理自己的节点,查看IPFS节点资源信息,支持二次开发。该项目是Node.js编写的,已开源。
/ u' _: n( K% M: R! y a+ a8 l) X0 e$ `8 o' V( y& L
5 C3 @+ t$ Z9 _1 K! I) Q3 `2 |/ ~
6 @4 _! b }; `8 F5 I; S4 Y+ g' c& K: X* f
IPFS节点桌面管理软件2 Q @9 b# a, b+ D' @0 j/ \+ E3 @+ U
6 e. M' M5 V# R8 |$ u4 @$ I' sGitHub地址:
^. e. A! J C: Ahttps://github.com/ipfs-shipyard/ipfs-desktop# i; B% j$ ^" o2 ^3 }
- Go-IPFS
) {* v7 m( Y( Y8 z8 N8 v+ ?进入IPFS的官网,找到并切换到"Install"页面,点击"Download IPFS for your platform",会跳转到如下网址(需要翻墙):2 q l2 u7 W* E, a- [" W
https://dist.ipfs.io/#go-ipfs. I4 ` S. q# A$ q; p
" P4 P- h' G" Z9 R5 s2 }
; t; L) B0 V% q& t$ e f
8 T5 F% f9 [+ M: o下载Go-IPFS
! b. C5 C2 |( L4 d% k+ m) `, a" P, d; p9 ^, Z7 f% {1 o
如果打不开,可以试着去Github查看安装方法
& h6 t1 I6 B; q% dGitHub地址:https://github.com/ipfs/go-ipfs( z4 e. `1 l# W
将网页下载好的文件解压出来,下载的是"go-ipfs_v0.4.13_darwin-amd64.tar.gz",解压出来的是go-ipfs文件夹,
+ `$ J/ K) [/ S0 t9 B$ _然后打开终端,进入到go-ipfs文件夹根目录,复制ipfs文件到系统的bin目录,然后可以通过"ipfs version"来检查,操作如下:
+ G+ m% T' _: ]/ o& p- h5 c* {5 KwenzildeiMac:go-ipfs wenzil$ pwd/Users/wenzil/Desktop/study/go-ipfswenzildeiMac:go-ipfs wenzil$ lsLICENSE README.md build-log install.sh ipfswenzildeiMac:go-ipfs wenzil$ cp ipfs /usr/local/bin/ipfswenzildeiMac:go-ipfs wenzil$ ipfs versionipfs version 0.4.13
$ P3 U0 N5 a/ w( h' f4 N+ v _) p 3、IPFS节点的创建、查看和启动以下是安装官网的Go-IPFS步骤下实验的
& x E2 X2 a$ e( w \- 创建节点
2 f! [# o8 h1 G! x. u进入到当前用户的根目录,并使用"ipfs init"命令创建节点,可以用"open ./"打开创建节点生成的".ipfs"目录。& l5 z' @7 @) e" y' F
wenzildeiMac:go-ipfs wenzil$ cd ~/wenzildeiMac:~ wenzil$ pwd/Users/wenzilwenzildeiMac:~ wenzil$ ipfs initinitializing IPFS node at /Users/wenzil/.ipfsgenerating 2048-bit RSA keypair...donepeer identity: QmWH4xmGBznY9CJ4SjxpxWqGwMwrFtPdjgeweLCfJxW8j9to get started, enter: ipfs cat /ipfs/QmS4ustL54uo8FzR9455qaxZwuMiUhyvMcX9Ba8nUH4uVv/readmewenzildeiMac:~ wenzil$ cd .ipfswenzildeiMac:.ipfs wenzil$ open ./
% B7 l. o& ^ K% k5 [$ {0 K . T x( l Y: V$ Y% R
" _& \) {: a) ^( _# o) D2 B' k
' [. o! ^; Z2 | w% WIPFS节点的创建
* _. e4 z6 I- S
% t- R" X7 p9 D. `+ g- 查看节点id
1 Q0 N2 I8 X+ i0 ]9 N5 @wenzildeiMac:.ipfs wenzil$ ipfs id{ "ID": "QmWH4xmGBznY9CJ4SjxpxWqGwMwrFtPdjgeweLCfJxW8j9", "PublicKey": "CAASpgIwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEKAoIBAQCt98O5zNptBtmSF6xYdOHAMunQsXE9rAmgqBXVPLJk+AoaBjNiAipB+sTXKwaj8stp9c3iuSzz10+dyYI38bq4TPDCsHnQ3PjKSgZwEaT0M6pJhGqJcSbLY57CjQOEwgFe+tw3b4hcoDvvNJMG0dZZg1r9xnfevBz0DNewlj2vtviSTQL6r/ZXlD04GsytxTSQ2pzMJTG3QmYyokeZ37DT7Vwa+IJjDCiDJC5BlZ204zunZBx3tqWUn2Hr2NtEX+4YDdX4SBHa0ZDNqZmzLRe5YlAXjVI0ONHs+BVsC1v1L5we52iSYCSgVHoxRP/pa9EZdHMvgs9QeAa5jO90yxgTAgMBAAE=", "Addresses": null, "AgentVersion": "go-ipfs/0.4.13/", "ProtocolVersion": "ipfs/0.1.0"} - 修改IPFS默认存储空间
) }' `! x2 p+ n6 ]存储节点默认存储大小为10G,如果你想修改存储空间,可以修改config配置文件,找到StorageMax并修改/ x+ W' X( {8 P% L
wenzildeiMac:~ wenzil$ export EDITOR=/usr/bin/vimwenzildeiMac:~ wenzil$ ipfs config edit - V9 P& E+ Q9 `4 Y2 Q' N
! }8 r7 E9 |7 z) N( m
( O4 _) h0 N+ g5 l+ d) p% q' e* v修改IPFS默认存储空间. A5 q' c+ A( s/ C, [
+ z' K4 k* V. [& w0 _) Q. v - 启动和同步节点服务器
2 t2 o* a. X1 ]1 ~- D执行"ipfs daemon"命令,可以同步节点数据到IPFS网络。
4 k' x% x/ t6 }. D, ]3 f6 z/ i' owenzildeiMac:.ipfs wenzil$ ipfs daemonInitializing daemon...Adjusting current ulimit to 2048...Successfully raised file descriptor limit to 2048.Swarm listening on /ip4/127.0.0.1/tcp/4001Swarm listening on /ip4/192.168.1.100/tcp/4001Swarm listening on /ip6/::1/tcp/4001Swarm listening on /p2p-circuit/ipfs/QmWH4xmGBznY9CJ4SjxpxWqGwMwrFtPdjgeweLCfJxW8j9Swarm announcing /ip4/100.64.9.179/tcp/55898Swarm announcing /ip4/127.0.0.1/tcp/4001Swarm announcing /ip4/192.168.1.100/tcp/4001Swarm announcing /ip6/::1/tcp/4001API server listening on /ip4/127.0.0.1/tcp/5001Gateway (readonly) server listening on /ip4/127.0.0.1/tcp/8082Daemon is ready \5 ^) G' M4 l: H% V3 \
4、IPFS运行体验- IPFS查看ReadMe6 g v+ f# `) y. X9 d
可以回去查看执行"ipfs init"命令的时候,返回的内容。打开一个新的终端,操作如下:
5 N# D2 Q! }8 l) n% QwenzildeiMac:~ wenzil$ ipfs cat /ipfs/QmYwAPJzv5CZsnA625s3Xf2nemtYgPpHdWEz79ojWnPbdG/readmeHello and Welcome to IPFS!██╗██████╗ ███████╗███████╗██║██╔══██╗██╔════╝██╔════╝██║██████╔╝█████╗ ███████╗██║██╔═══╝ ██╔══╝ ╚════██║██║██║ ██║ ███████║╚═╝╚═╝ ╚═╝ ╚══════╝If you're seeing this, you have successfully installedIPFS and are now interfacing with the ipfs merkledag! -------------------------------------------------------| Warning: || This is alpha software. Use at your own discretion! || Much is missing or lacking polish. There are bugs. || Not yet secure. Read the security notes for more. | -------------------------------------------------------Check out some of the other files in this directory: ./about ./help ./quick-start <-- usage examples ./readme <-- this file ./security-notes - Web管理界面& O- p! ~+ ? l [0 J, M8 E( L1 N. o1 j
IPFS节点服务器启动后,可以用浏览器访问:http://localhost:5001/webui
' u5 W8 Y1 T. F) G& ]' a有本地配置、节点连接、本地节点文件等信息,如图:" l2 F5 A+ o# i+ x* i
H. T9 Y0 }) r: g0 a) T9 [* E$ N# N: u. r) f4 X/ d7 `
, O& f; ]2 |; ^6 z5 \
" T0 U7 R' ^4 P% ~1 d
IPFS的Web管理界面) `3 H8 U: x* Y) _! g2 w( }% x1 Z
9 I$ _( {- ^. t6 o0 ~$ F0 Q& o; O( K
; a2 L5 |; A6 }2 T; N) ^- j) Z4 }" I) F" W; q8 h3 Q* E1 \
5、设置跨域资源共享当我们在前端通过js接口操作ipfs时,会遇到跨域资源访问问题,可以在终端执行以下配置来解决:
) |; z$ j+ u# j5 l/ x5 h6 lipfs config --json API.HTTPHeaders.Access-Control-Allow-Methods '["PUT","GET", "POST", "OPTIONS"]'ipfs config --json API.HTTPHeaders.Access-Control-Allow-Origin '["*"]'ipfs config --json API.HTTPHeaders.Access-Control-Allow-Credentials '["true"]'ipfs config --json API.HTTPHeaders.Access-Control-Allow-Headers '["Authorization"]'ipfs config --json API.HTTPHeaders.Access-Control-Expose-Headers '["Location"]'6、IPFS的基本操作6.1 添加单个文件到IPFS节点- 新建文件
1 a7 W5 ]5 F5 @# j: [wenzildeiMac:ifps_test wenzil$ vi test.txtwenzildeiMac:ifps_test wenzil$ cat test.txt IPFS测试文件 - 添加文件到IPFS节点8 }& l8 L7 `7 l0 `' F+ c, R
wenzildeiMac:ifps_test wenzil$ ipfs add test.txt added QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab test.txt添加文件到IPFS节点后,返回了文件的哈希值; c/ r( t D1 c$ u% k! \
- 查看IPFS节点的文件$ s Y9 R8 m& S! t- w2 g
wenzildeiMac:ifps_test wenzil$ ipfs cat QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2AbIPFS测试文件注意:此时的文件只是添加到了本地的IPFS节点,读取的是本地数据,可以通过如下网址查看。
4 W1 w! e( ?+ V6 A4 j0 Uhttp://localhost:8080/ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab
/ ?. S* j, g0 n; O. q6 i5 n5 l通过"ipfs daemon"命令启动节点服务器,会将本地节点文件同步到外网,同步成功后,这时就可以访问如下网址来查看(如果访问失败,试着翻墙看看)。5 y) D3 D! P7 h7 E3 O# [
https://ipfs.io/ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab
- ^5 x! Z- _3 h- \* k4 o3 _" q* Z. F$ W
. N; D( \ D+ n! i4 \8 j6 U* P: j- W/ C& \3 k9 D" v8 E, m
查看IPFS文件内容
9 \ r/ p* B- }8 t) h+ b+ k
$ b# B. P" z% C0 F- x" ^7 M; V8 v; I如果访问成功的话,说明已经存储到IPFS网络中。目前IPFS网络暂未加入代币Filecoin机制,所以存储读取文件免费,速度也比较慢。
. E% D8 U. P# K$ e/ [2 s, y - 下载IPFS节点的文件; r5 A1 b! A9 `0 Y2 t8 a
wenzildeiMac:ifps_test wenzil$ ipfs get QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2AbSaving file(s) to QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab 25 B / 25 B [========================================================] 100.00% 0s查看当前目录,发现多了一个"QmSV..."的文件"
$ k- L$ d6 x- `* g3 S6 M W! N! W/ u
2 i9 Z' a5 U [ h1 F
' d, B# v7 }- ^/ R2 B
3 {4 a: I) i4 }7 P0 Q- b- w下载IPFS节点的文件2 N) o4 {+ j$ C+ @# [+ S
! b' k# z0 H z- s9 F/ ]$ g; Z7 S* C, U1 R
6.2 创建文件夹存储文件- ipfs命令新建文件夹7 d' m0 \! `) }+ m
wenzildeiMac:ipfs_test wenzil$ pwd/Users/wenzil/Desktop/study/ipfs_testwenzildeiMac:ipfs_test wenzil$ ipfs files mkdir /wenzilwenzildeiMac:ipfs_test wenzil$ ipfs files cp /ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab /wenzil/test.txtwenzildeiMac:ipfs_test wenzil$ ipfs files lstestwenzilwenzildeiMac:ipfs_test wenzil$ ipfs files ls /testwenzilwenzildeiMac:ipfs_test wenzil$ ipfs files rm -rf /testwenzildeiMac:ipfs_test wenzil$ ipfs files lswenzilwenzildeiMac:ipfs_test wenzil$ ipfs files ls /wenziltest.txtwenzildeiMac:ipfs_test wenzil$ ipfs files read /wenzil/test.txtIPFS测试文件注:"ipfs files rm -rf /文件夹名"可以删除文件夹。- [3 V. B. ^9 w l h4 L
# w7 g' T1 I0 t" V9 a+ E 6.3 IPFS上传文件夹- ipfs命令添加文件夹1 y- m$ G9 i1 o4 w5 R
先在本地创建一个文件夹和对应文件,如图:
7 `5 g$ k/ L* l! i4 E
( P2 E$ {+ ]6 C# k4 I! S. ]& u- z# y u; h
1 P4 a3 d1 B, G8 j! d9 a s& I- k2 v; ~( [
本地创建文件夹及文件- q; i M; ?/ V2 q
% j% D# A' }1 b/ y* |, n% g8 U" ~然后通过"ipfs add -r 文件夹"命令添加整个文件夹
& w& X8 Z$ v: P% u9 d' k( s wenzildeiMac:ipfs_folder wenzil$ pwd /Users/wenzil/Desktop/study/ipfs_folder wenzildeiMac:ipfs_folder wenzil$ ls portrait.jpeg readme.txt wenzildeiMac:ipfs_folder wenzil$ cd .. wenzildeiMac:study wenzil$ pwd /Users/wenzil/Desktop/study wenzildeiMac:study wenzil$ ipfs add -r ipfs_folder/ added QmbHptfJfyuGAZxstFYgAVfz33cytR1seTD3ZabBSDd899 ipfs_folder/portrait.jpeg added QmPEWgwQEHD6qxm5cUivTEZ252T123DvQ5L6HyUDgViQv T ipfs_folder/readme.txt added QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj ipfs_folder wenzildeiMac:study wenzil$ - 查看文件夹的文件内容
4 K) l$ \- p6 l1 K" }! ?wenzildeiMac:study wenzil$ ipfs cat QmPEWgwQEHD6qxm5cUivTEZ252T123DvQ5L6HyUDgViQvT 我是区块链开发小白,请大家多多赐教,谢谢。欢迎阅读我的区块链系列文章,简书地址:https://www.jianshu.com/u/5f809ab3698cwenzildeiMac:study wenzil$ ipfs cat /ipfs/QmPEWgwQEHD6qxm5cUivTEZ252T123DvQ5L6HyUDgViQvT我是区块链开发小白,请大家多多赐教,谢谢。欢迎阅读我的区块链系列文章,简书地址:https://www.jianshu.com/u/5f809ab3698cwenzildeiMac:study wenzil$ ipfs cat /ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj/readme.txt我是区块链开发小白,请大家多多赐教,谢谢。欢迎阅读我的区块链系列文章,简书地址:https://www.jianshu.com/u/5f809ab3698c - 查看IPFS对应文件夹
, w3 D! R8 Q5 k9 |* }访问文件夹对应的IPFS地址:
- y/ F' p R4 j& K* d4 m' |+ Shttps://ipfs.io/ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj1 T; P2 o: x- P# {1 C& ^+ p
第一次访问的时候,需要同步数据到IPFS网络,等待时间有点久,慢到让你以为同步失败了。2 m0 o- J9 e5 b2 k, ?. _" q
( r$ p2 P7 _' |* l
: }( E5 e7 b7 y+ g
! u* S* |5 e$ Q# C
查看IPFS对应文件夹$ Q) g- ~- ^( w
7 z, H1 m% y3 ~2 J访问文件夹对应的文件,如看到图片文件,访问ipfs网关:
/ Q0 V+ x! x1 t* j9 J4 B, ]2 v" l( R" ^https://ipfs.io/ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj/portrait.jpeg
! [& t5 s6 |9 p- c) a
0 n' B& v7 U) N1 p0 Y& ?
' A2 o6 G6 V9 w: k7 v0 o% L
# _, j E/ E$ b, o: R( H/ t查看IPFS文件夹对应文件 r3 V, c$ S: F( ` K* m
- h3 H/ g: I# C# \% B4 y或者通过文件的Hash来访问,如访问txt文件的地址:
- w) B: S1 s/ ~* M# u/ ohttps://ipfs.io/ipfs/QmPEWgwQEHD6qxm5cUivTEZ252T123DvQ5L6HyUDgViQvT# l" r" H5 |7 t1 B" h$ o
$ y1 {; H9 O4 e8 d/ j
6 l# C: O. A0 u: x/ a
( }. m$ O* Y2 o
通过文件Hash访问查看/ y x* a8 T0 N
! ` B( P3 u8 O
- j- }) p$ h1 k 6.4 添加简单网页到IPFS节点- 网页效果和项目结构: R2 t; n: S& ?- u
实现一个简单的实时显示系统当前时间的网页,效果如图:" q/ A/ V3 E: V/ u+ k; s
1 h' m, u6 Z! z9 F- ^% f/ P% {$ M% S% t7 }1 C z
3 Z ^1 }$ P; r; @
, |. e/ Y2 _( p
IPFS添加简单网页1 l+ w7 ^0 I8 R/ C8 b n
Z6 |& g6 Y a& s工程结构如图:
3 m, V$ J* A# f+ g A2 k% D0 n) C! S( g# M0 i
4 `3 r) G( x. m8 K, N
- D5 z% a# z6 k. x9 ?2 v+ N" J
3 Q8 y7 W! b0 t9 |) @网页工程结构% I0 T% I* r2 g2 k6 ]- p' z9 ]
& Q) w8 h4 D* \
- M" Q5 `* W5 `- x" S 实现代码比较简单,这里就不贴代码了。
" p1 P' N. h4 k2 T- ipfs命令添加文件夹
. i @5 M7 H( b( [6 M& bwenzildeiMac:study wenzil$ ipfs add -r ipfs_htmladded QmTj49dgFgFhfNRTUYyUSzk3puj7vvDoVsAynFrL7GAj1d ipfs_html/index.htmladded QmeHFBSyN9KqeZWKyKTWKYzDRU192YWDRjf6sLWFWhwk2z ipfs_html/styles.cssadded QmWkEfgL2pjo7n8b9YBCv4qwE77YWePkSscxiHQfPpwpkp ipfs_html/time.jsadded QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD ipfs_html记得要开启IPFS节点服务器进行数据的同步,可以使用"ipfs daemon"命令在新的终端窗口打开运行。7 Z2 h9 X* n: t2 P1 N5 I
wenzildeiMac:~ wenzil$ ipfs daemonInitializing daemon...Adjusting current ulimit to 2048...Successfully raised file descriptor limit to 2048.Swarm listening on /ip4/127.0.0.1/tcp/4001Swarm listening on /ip4/192.168.6.31/tcp/4001Swarm listening on /ip6/::1/tcp/4001Swarm listening on /p2p-circuit/ipfs/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrzSwarm announcing /ip4/127.0.0.1/tcp/4001Swarm announcing /ip4/192.168.6.31/tcp/4001Swarm announcing /ip6/::1/tcp/4001API server listening on /ip4/127.0.0.1/tcp/5001Gateway (readonly) server listening on /ip4/127.0.0.1/tcp/8082Daemon is ready - 访问ipfs对应文件
3 ~8 ]; x1 h& ]; Q浏览器访问ipfs网关:
# B7 `8 Q/ ~: f, ?# ]; V4 o* {: r7 qhttps://ipfs.io/ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD/
4 e9 @( {$ a* j4 q! b3 V
; ?2 ^; u) ?1 y
4 G! E* f: n4 k* d* Z
3 H- M+ ^+ G+ ?0 B查看IPFS对应网页
4 l9 }$ d2 u- I7 m' A# j6 X
! U# r+ [. Q9 z* O3 w
( y& I/ }( M) E4 r" ?; Q+ j' d 6.5 IPNS绑定节点名- IPNS绑定节点操作- `/ v2 g* C& c+ M$ `4 o
每次修改文件内容后,文件的哈希值就会发生变化。对于网站而言,发布后可能还需要做修改,这时需要IPNS绑定节点名。每次更新网站内容后,重新publish一次更新发布到IPNS即可。4 o- C _4 I6 A( N7 P2 E5 `3 @
刚才的html根目录的哈希值是QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD,操作如下:7 @/ w: u! [0 i1 J$ ]6 D, `3 @
wenzildeiMac:study wenzil$ ipfs name publish QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDDPublished to QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz: /ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD - 查看当前节点# `. T! m( d7 ]0 ^$ N( a
wenzildeiMac:study wenzil$ ipfs id{ "ID": "QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz", "PublicKey": "CAASpg......", "Addresses": [ "/ip4/127.0.0.1/tcp/4001/ipfs/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz", "/ip4/192.168.6.31/tcp/4001/ipfs/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz", "/ip6/::1/tcp/4001/ipfs/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz", "/ip4/14.xxx.xxx.xxx/tcp/4001/ipfs/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz", "/ip4/61.xxx.xxx.xxx/tcp/20472/ipfs/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz" ], "AgentVersion": "go-ipfs/0.4.13/", "ProtocolVersion": "ipfs/0.1.0"} 发现"ID"和上面"Published to"返回的节点一致,都是"QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz"
/ P+ P! z9 t! J; J - 验证节点3 o5 Q4 Z! }5 L J
命令为:"ipfs name resolve 节点ID“
+ y" a" I+ ?4 _7 C {, z4 G" D4 t' @wenzildeiMac:study wenzil$ ipfs name resolve QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz/ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD - 访问IPNS对应文件. v7 L2 ~, r2 b5 `- j- j2 K
浏览器访问ipfs网关:
0 X s- j1 t' Y0 F5 _% Q2 t. Vhttps://ipfs.io/ipns/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz/6 y6 J+ D5 z V: K( `( {: @7 o
8 i& m( i+ M; [: m3 n" W / B! x, V( g! ~5 R: y
( U: `% c. U, H/ @5 b) J- @
+ S' D9 q* U+ L3 Y" q% R查看IPNS对应网页1 d" A& g& m( m2 _" k
# J, Z' h0 g/ C
7、IPFS与以太坊DApp开发实战- IPFS与以太坊DApp结合的好处
& E# t4 b- \9 ^在以太坊平台上,往区块链写入数据需要花费以太币,调用智能合约执行每一行代码的时候,都需要一定量的gas交易费。区块链存储大数据成本很高,而且不合理。
. ?7 }7 b. C5 p+ O" \0 h! V* b可以先将文件存储到IPFS,然后得到文件的Hash存储到以太坊区块链中。读取文件的时候,从以太坊区块链中获取文件的Hash,再通过Hash来读取IPFS网络上的文件。# D" W! H0 m2 O5 G6 U
使用官方提供的ipfs-api,可以很方便地在代码中操作节点将数据上传到IPFS,或者通过Hash从IPFS读取数据。7 w$ q0 r. V$ f7 e! U
Truffle框架提供了快速搭建包含以太坊智能合约的React项目,可以通过"truffle unbox react"创建工程,然后安装ipfs-api依赖库。于是,可以在前端方便地调用IPFS的接口来读取、上传文件。
1 ^% M9 h1 h8 v% o8 vtruffle unbox react官网:
* [# M5 _3 ]0 ~# q- e ghttp://truffleframework.com/boxes/react
# b+ a+ `3 Z* {- f% k - IPFS与DApp开发实战
\$ m( o' Q$ [; n" S/ p V+ W话不多说,开始进入实战开发。
0 w5 Y2 b) b2 C5 C3 t' T5 l7.1 安装Truffle unbox react新建一个空目录"ipfs_dapp",然后执行安装命令7 M% `3 N+ B( X! C3 V
truffle unbox reactwenzildeiMac:ipfs_dapp wenzil$ pwd/Users/wenzil/Desktop/study/ipfs_dappwenzildeiMac:ipfs_dapp wenzil$ truffle unbox reactDownloading...Unpacking...Setting up...Unbox successful. Sweet! Commands: Compile: truffle compile Migrate: truffle migrate Test contracts: truffle test Test dapp: npm test Run dev server: npm run start Build for production: npm run build7.2 安装ipfs-apinpm install --save ipfs-apiwenzildeiMac:ipfs_dapp wenzil$ npm install --save ipfs-apinpm WARN deprecated bignumber.js@6.0.0: Custom ALPHABET bug fixed in v7.0.2react-box@0.1.0 /Users/wenzil/Desktop/study/ipfs_dapp├—┬ ipfs-api@22.0.0 │ ├—— async@2.6.1 │ ├—— big.js@5.1.1 │ ├—┬ bs58@4.0.1 │ │ └—— base-x@3.0.4 # ...... 省略N多行输出7.3 修改智能合约代码修改contracts目录中的"SimpleStorage.sol",修改后完整代码:
4 j% W' P5 q7 t2 D& O+ f' D0 c/ ypragma solidity ^0.4.18;contract SimpleStorage { // 用于存储图片的哈希值 string storedData; function set(string x) public { storedData = x; } function get() public view returns (string) { return storedData; }} 修改"Migrations.sol"7 }9 k0 O6 N% ^) F, x# a ]
function Migrations() public { owner = msg.sender;}修改为:constructor() public { owner = msg.sender;}7.4 编译智能合约truffle compilewenzildeiMac:ipfs_dapp wenzil$ truffle compileCompiling ./contracts/Migrations.sol...Compiling ./contracts/SimpleStorage.sol...Writing artifacts to ./build/contracts7.5 部署智能合约进入remix-ide,复制SimpleStorage.sol代码,然后切换到"Run"菜单,选择"Injected Web3"进行智能合约的部署3 T' I9 F( Y Y5 f4 u2 O
) U3 U- @$ g: f- v8 k
0 ]$ f M- c4 B8 _' ~* A6 f# k# I: O+ N. I1 |1 v
Remix-IDE部署智能合约
' P6 q5 p4 B, Z e G2 }7 E) e# v9 D7 s: [! ?# X. s& r U
# c8 V# F/ a* v
' w9 P! R' D7 a& W- P
9 h# g s: A3 {Remix-IDE部署智能合约-确认
- m" X; v" v* j! l1 m$ J0 r0 D/ j. a
然后复制智能合约地址,App.js文件中会用到合约地址为:"0xb177d6cf6916f128c9931e610c63208d9c5a40f3"2 z0 [2 d" {* }$ L r3 f) h
7.5 修改App.js文件import React, {Component} from 'react'import SimpleStorageContract from '../build/contracts/SimpleStorage.json'import getWeb3 from './utils/getWeb3'import './css/oswald.css'import './css/open-sans.css'import './css/pure-min.css'import './App.css'const ipfsAPI = require('ipfs-api');const ipfs = ipfsAPI({ host: 'localhost', port: '5001', protocol: 'http'});const contract = require('truffle-contract')const simpleStorage = contract(SimpleStorageContract)let account;// Declaring this for later so we can chain functions on SimpleStorage.let contractInstance;let saveImageToIPFS = (reader) => { return new Promise(function(resolve, reject) { const buffer = Buffer.from(reader.result); ipfs.add(buffer).then((response) => { console.log(response) resolve(response[0].hash); }).catch((err) => { console.error(err) reject(err); }) })}class App extends Component { constructor(props) { super(props) this.state = { blockChainHash: null, web3: null, address: null, imageHash: null, isSuccess: false }}componentWillMount() { ipfs.swarm.peers(function(err, res) { if (err) { console.error(err); } else { // var numPeers = res.Peers === null ? 0 : res.Peers.length; // console.log("IPFS - connected to " + numPeers + " peers"); console.log(res); }});getWeb3.then(results => { this.setState({web3: results.web3}) // Instantiate contract once web3 provided. this.instantiateContract() }).catch(() => { console.log('Error finding web3.') })}instantiateContract = () => { simpleStorage.setProvider(this.state.web3.currentProvider); this.state.web3.eth.getAccounts((error, accounts) => { account = accounts[0]; simpleStorage.at('0xb177d6cf6916f128c9931e610c63208d9c5a40f3').then((contract) => { console.log(contract.address); contractInstance = contract; this.setState({address: contractInstance.address}); return; });})}render() { return ( <div className="App"> <div style={{marginTop:10}}>智能合约地址:</div> <div>{this.state.address}</div> <div style={{marginTop:10}}>上传图片到IPFS:</div> <div> <label id="file">选择图片</label> <input type="file" ref="file" id="file" name="file" multiple="multiple"/> </div> <button style={{marginTop:10}} onClick={() => { var file = this.refs.file.files[0]; var reader = new FileReader(); reader.readAsArrayBuffer(file) reader.onloadend = function(e) { console.log(reader); saveImageToIPFS(reader).then((hash) => { console.log(hash); this.setState({imageHash: hash}) }); }.bind(this); }}>开始上传</button> <div style={{marginTop:10}}>图片哈希值:{this.state.imageHash}</div> <button onClick={() => { contractInstance.set(this.state.imageHash, {from: account}).then(() => { console.log('图片的hash已经写入到区块链!'); this.setState({isSuccess: true}); }) }}>图片哈希写入区块链</button> { this.state.isSuccess ? <div style={{marginTop:10}}> <div>图片哈希成功写入区块链!</div> <button onClick={() => { contractInstance.get({from: account}).then((data) => { console.log(data); this.setState({blockChainHash: data}); }) }}>从区块链读取图片哈希</button> </div> : <div/> } { this.state.blockChainHash ? <div style={{marginTop:10}}> <div>从区块链读取到的哈希值:{this.state.blockChainHash}</div> </div> : <div/> } { this.state.blockChainHash ? <div style={{marginTop:10}}> <div>访问本地文件:</div> <div>{"http://localhost:8082/ipfs/" + this.state.imageHash}</div> <div>访问IPFS网关:</div> <div>{"https://ipfs.io/ipfs/" + this.state.imageHash}</div> <img alt="" style={{width: 100, height: 100 }} src={"https://ipfs.io/ipfs/" + this.state.imageHash}/> </div> : <img alt=""/> } </div>); }}export default App7.6 新建终端,执行"npm start"命令,结果如图:/ p4 M0 J; ~" Q$ _3 [
0 Y# |/ s0 G, F) Q: |' F( q% g" S' `9 U% v' N# o* L) K; K. ?
npm_start6 \: M/ H" h* i$ c$ }
$ z% J! V, ~( Z" A会自动打开网页,然后上传一张本地图片,之后点击"图片哈希写入区块链"按钮
: d- @" `% A& @/ ]7 Y( g, X2 @( g6 ?! c" L i S, [ j
^2 A( k# f5 h$ `6 I3 T* p
: N- Z( ?9 `% s/ X% \# _" V运行结果16 j. t6 k" a8 M' Z& f0 h
* G. B& |8 ?9 l4 F
最终效果如图:0 D7 v9 l7 s/ [$ ~ K) B
/ N7 F' ?! X6 A% Q7 Y
' [/ v" ^ r$ E! K, o+ T; A
; y& C6 g4 H& n( C9 g% ?! R; f6 j/ Q; @, @
运行结果* z7 ~9 f3 G8 K+ V8 W3 E
Q% t/ A) w2 }3 x8 ~访问IPFS网关:
f" o& Q( l5 J H% z, d, x/ Khttps://ipfs.io/ipfs/QmbHptfJfyuGAZxstFYgAVfz33cytR1seTD3ZabBSDd899
$ w9 F$ ^3 |3 r4 {4 Y9 f8 m发现图片已经成功写入IPFS,如图:
) |& G/ y: c6 g: v& K4 u T6 { m2 r9 }* D3 h
2 r; m+ m& O+ j/ v" a
3 c0 J2 D8 h( n& g
0 e' N! V8 R7 d+ ?运行结果3) B: F; N9 S# T) L. Y7 T. q
( \- d1 r& {! a
备注:本地IPFS网关端口默认为8080,我的电脑上端口冲突了,系统自动修改为8082。
7 U9 I% {3 U* w9 t3 W2 v! X4 K u' Y搞定,收工。% r, C9 N1 q+ f4 c1 d" F
PS:刚入坑的小白,很多不懂,还请各位大佬多赐教,谢谢!) |% b+ d" P7 E+ h8 R0 X
]) Z. @0 Q" h$ N% G
|
|