|
|
本帖最后由 赤膊医数 于 2021-4-22 23:41 编辑 , b3 O% z2 S& ?* J0 _1 S# k
- Y5 d2 y1 A5 w2018年,最火爆且值得期待的区块链项目莫过于EOS和IPFS。1、IPFS简介- IPFS是什么
4 A% i' f; K" d; S9 t* P/ ~星际文件系统IPFS(InterPlanetary File System)是一个面向全球的、点对点的分布式版本文件系统,目标是为了补充(甚至是取代)目前统治互联网的超文本传输协议(HTTP),将所有具有相同文件系统的计算设备连接在一起。原理用基于内容的地址替代基于域名的地址,也就是用户寻找的不是某个地址而是储存在某个地方的内容,不需要验证发送者的身份,而只需要验证内容的哈希,通过这样可以让网页的速度更快、更安全、更健壮、更持久。
# Q) s2 m9 K; y) x: c6 V, n以上内容来自巴比特官网介绍7 y) b' K: {- v) A
IPFS是基于区块链技术的去中心化存储网络,实现了永久性存储。; `* [* X1 w4 m9 v9 w& o. A
- IPFS的火热
o9 L* C( \5 Z1 yFilecoin ICO是迄今为止涉及金额最大的ICO,仅一小时就募集了接近2亿美元,打破ICO记录,成为2017年最火爆的区块链项目。IPFS项目吸引了世界各地数字货币投资者和互联网从业者的密切关注,2018年比较值得期待的是IPFS主网的上线。然而就在前段时间,官方公布说上线时间延期到年底。
" `5 ^+ _8 }. F7 D3 D2 f* n注:Filecoin是IPFS激励层的加密数字货币(即代币),有点类似于以太坊平台上的以太币。' B; v- t% s0 D
IPFS官网:https://ipfs.io/
% i. O: ~1 A9 D! HFilecoin官网:https://filecoin.io/8 J4 _7 B" _3 t: K9 V* r! f0 A
- IPFS的应用案例
2 ~+ d% ~- `+ r+ C: l5 ^GitHub有两款开源项目,且有对应网址,分别是音乐播放器和视频播放器。
2 y5 U- k" \- p7 X1 f- B1 [, M
- IPFS音乐播放器9 w" H) p' r9 U
1 p" y9 z+ A' G m9 c. P, C0 r) J& g7 M
! D- x! E. n8 i% y b I' Q. P
! |6 k7 h- Q. C; g+ HIPFS音乐播放器; F: p0 g% M3 C1 T6 M; k
: m9 t* }9 {* w/ T( {' z# I
IPFS音乐播放器网址:https://diffuse.sh/
$ ^* u+ h: C5 F5 i I k& l6 [6 p) GGitHub地址:https://github.com/icidasset/diffuse
. Y4 u, U4 r- S/ P6 \! p- A* b - IPFS视频在线播放器
% E# s- p% `6 _4 q
W8 k3 E4 [$ o# J3 x) p( `6 B: r% q( b% K& j: f e
6 X: B+ n( r R" a' f
9 N8 q" n9 T$ a' v) g$ Q1 ?% ZIPFS视频在线播放器首页
- E+ F# O% J4 w+ G
E, w: P/ o2 o+ i. t2 f
" @2 f5 Q! b! i# g J2 D1 K 0 a7 W, G0 U6 n5 d: n: c8 e6 t
* C L6 R% T0 r8 f5 x
3 z. a# |) X% S
IPFS视频在线播放器播放电影% O1 ?% q9 Y# X7 f
) I! X$ d) L0 u+ B% S; V6 _号称是国内第一个IPFS应用3 c) e' D [) k8 k. ?
IPFS视频在线播放器网址:http://www.ipfs.guide/
/ ~: n4 b: D1 qGitHub地址:https://github.com/download13/ipfstube
! h2 ` q z( D/ T可用于测试的电影视频Hash(这里只列举两部):
9 t& r% R) l! v6 v7 v神秘巨星:QmWBbKvLhVnkryKG6F5YdkcnoVahwD7Qi3CeJeZgM6Tq68
$ j+ l6 i( j" u! P盗梦空间:QmQATmpxXvSiQgt9c9idz9k3S3gQnh7wYj4DbdMQ9VGyLh5 E9 F1 e6 M$ I
2、IPFS的安装既然IPFS这么牛,有必要了解一下IPFS的开发,先从IPFS的安装开始。8 y0 g- }, {5 }# N! r$ k
- IPFS Desktop9 s& a, o2 ?5 p+ g' r; D' j; R
当然,可以直接安装IPFS节点桌面管理软件来体验一下。该软件可以方便地运行和管理自己的节点,查看IPFS节点资源信息,支持二次开发。该项目是Node.js编写的,已开源。
' y- ^4 |7 n5 x. s# h e- v8 F+ x9 U z/ x7 L6 I# q4 t" E
: q" V; C% N; H: H+ `1 g2 R9 b
( v4 @7 G$ H2 }5 C4 G7 q
7 a6 O( A; v. X" k, y% qIPFS节点桌面管理软件( Q7 w6 g% U- d( ?5 m9 Y7 `
d" t4 ?) d G6 g- K
GitHub地址:
$ i3 s% ^/ x* m: F |* t/ v! i, Rhttps://github.com/ipfs-shipyard/ipfs-desktop4 C: I) E/ O$ Q# }+ B' D+ j
- Go-IPFS
/ I, h) N2 M* [# C0 S进入IPFS的官网,找到并切换到"Install"页面,点击"Download IPFS for your platform",会跳转到如下网址(需要翻墙):3 d% ?5 ~& D, A' j) L5 u1 Z
https://dist.ipfs.io/#go-ipfs, g7 ~! r5 i* U5 D- t
, q$ V2 M+ G# p) B; T
/ P) O: F X! i( O$ n* Y
% \. |1 O( m! c+ E+ O- ~下载Go-IPFS" b- p/ } \. g i2 z2 U! J
$ I2 M( T$ ^7 u7 z+ u% B) |如果打不开,可以试着去Github查看安装方法
% O' H, F. C) TGitHub地址:https://github.com/ipfs/go-ipfs0 N( C# D" M6 R/ F d$ B( P
将网页下载好的文件解压出来,下载的是"go-ipfs_v0.4.13_darwin-amd64.tar.gz",解压出来的是go-ipfs文件夹,, P$ ]; W$ m6 a/ c! O
然后打开终端,进入到go-ipfs文件夹根目录,复制ipfs文件到系统的bin目录,然后可以通过"ipfs version"来检查,操作如下:' E6 T6 \# {' W- C
wenzildeiMac: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
1 v, B1 _: _: V, K 3、IPFS节点的创建、查看和启动以下是安装官网的Go-IPFS步骤下实验的
; S: C) @7 |" z; S! \- 创建节点$ e; N# E" m, S/ x
进入到当前用户的根目录,并使用"ipfs init"命令创建节点,可以用"open ./"打开创建节点生成的".ipfs"目录。. C( s! [- X% a8 j/ M4 J8 g! D
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 ./
: M' U0 g X2 V/ J + ?, \( V1 n$ F. v, A' ]) ] w
: E) F3 z9 t/ K1 r$ q/ a% t: z! Z2 F7 h2 o3 T
IPFS节点的创建
- V" o, c/ P7 Y* e- |3 Q, C" o( ?, }" H
0 @/ {* w J! q M3 N" O3 F- 查看节点id
" d& V# B" x- ` |+ y% I; h, twenzildeiMac:.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默认存储空间4 v# D0 n) T& ~9 S/ ~% d
存储节点默认存储大小为10G,如果你想修改存储空间,可以修改config配置文件,找到StorageMax并修改 s/ {% C+ B9 w W5 @
wenzildeiMac:~ wenzil$ export EDITOR=/usr/bin/vimwenzildeiMac:~ wenzil$ ipfs config edit
* V0 K: A2 _7 N3 _% Z
$ Z% p: t# r5 c7 V* S
$ z: C% Y# c6 _9 @
修改IPFS默认存储空间2 k5 H: V9 Z f6 e7 |. R
$ @* ]# ]: I8 N - 启动和同步节点服务器# @0 c A: R9 ~* x* f- U& Z
执行"ipfs daemon"命令,可以同步节点数据到IPFS网络。
0 M, E/ X. \# QwenzildeiMac:.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- G D5 k) k* @! @: l2 M
4、IPFS运行体验- IPFS查看ReadMe* p# }# }$ W+ E5 v. Z; c
可以回去查看执行"ipfs init"命令的时候,返回的内容。打开一个新的终端,操作如下:
9 ?1 s" b* M8 S; _1 O `wenzildeiMac:~ 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管理界面
. c' z; |5 b0 T& {4 \! l! f5 d& DIPFS节点服务器启动后,可以用浏览器访问:http://localhost:5001/webui2 p& N4 k Q6 k. H: `$ B: k2 S9 W# _+ \
有本地配置、节点连接、本地节点文件等信息,如图:$ ~8 F5 P8 q+ y( c
" n% V' d5 {$ ~& Q: z- T5 [; F" H4 y$ b- L, z( E3 K
$ q: s, P4 W+ M |$ G" ~5 y9 c
) R+ H% @/ `2 uIPFS的Web管理界面) G- v& ?, N" _7 J8 @
7 }$ o. B+ ]2 |
$ \# B }# H5 G: L; Z% _3 H2 Z- z! }; Y2 f# {
5、设置跨域资源共享当我们在前端通过js接口操作ipfs时,会遇到跨域资源访问问题,可以在终端执行以下配置来解决:
$ z' H5 G9 _% y9 B% t; 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节点- 新建文件' E W3 O, q: ^* i' P- S2 |7 Z
wenzildeiMac:ifps_test wenzil$ vi test.txtwenzildeiMac:ifps_test wenzil$ cat test.txt IPFS测试文件 - 添加文件到IPFS节点
+ A/ ?# J5 v$ ~! VwenzildeiMac:ifps_test wenzil$ ipfs add test.txt added QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab test.txt添加文件到IPFS节点后,返回了文件的哈希值
$ t; G$ A1 S* m1 D L+ \9 X0 } - 查看IPFS节点的文件, s0 V( Y" l! s
wenzildeiMac:ifps_test wenzil$ ipfs cat QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2AbIPFS测试文件注意:此时的文件只是添加到了本地的IPFS节点,读取的是本地数据,可以通过如下网址查看。
: p- \% d; Z \/ Q9 hhttp://localhost:8080/ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab
, H4 J0 _2 D2 E通过"ipfs daemon"命令启动节点服务器,会将本地节点文件同步到外网,同步成功后,这时就可以访问如下网址来查看(如果访问失败,试着翻墙看看)。- ^ W# e/ b; e; ? ~) t- m8 p
https://ipfs.io/ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab( L9 W! U; \* f/ E# L
8 g+ z# p, r0 X" }0 n: K; \
* f- ~+ K# b# d, T2 q. G
. Q/ h. Y3 u0 S K: z/ U+ W查看IPFS文件内容5 |% p! P3 y8 k
, }+ [/ Z1 C! R* {3 z5 U如果访问成功的话,说明已经存储到IPFS网络中。目前IPFS网络暂未加入代币Filecoin机制,所以存储读取文件免费,速度也比较慢。
5 I w* Q9 N- W8 k d& X" l - 下载IPFS节点的文件! u8 s8 F* v: F0 p. Y2 \8 M0 o7 |6 k
wenzildeiMac:ifps_test wenzil$ ipfs get QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2AbSaving file(s) to QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab 25 B / 25 B [========================================================] 100.00% 0s查看当前目录,发现多了一个"QmSV..."的文件"& v1 ?0 }# d$ X% j! z
& T5 [' S0 o5 R8 r: a; W! \
% Z: I& E6 }8 p f
6 r# ^; ?: E- a2 L- W" q
& K+ W9 q! J, Z, n- i* o5 J下载IPFS节点的文件
) J1 ?) O; a; q- V; b7 Z+ H3 t. x( y0 B5 m0 O
( Y: W% b! H) v: r0 ] 6.2 创建文件夹存储文件- ipfs命令新建文件夹
4 A% B3 D) N; o0 D2 [3 ]! HwenzildeiMac: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 /文件夹名"可以删除文件夹。6 S& ?# p/ @ b7 D. E7 ]( ^7 N2 u
& }( S7 W+ m$ a. n3 K
6.3 IPFS上传文件夹- ipfs命令添加文件夹
! K5 F( S& b. j3 ?先在本地创建一个文件夹和对应文件,如图:
3 |+ g5 H( x! X8 c# i
' `5 C/ q" s' t6 \' m& \
) ]" [% q% r; ^! U
2 J! i- P5 v. J0 ^- n! V
3 L. v h" o0 P本地创建文件夹及文件
8 U7 d! v6 m# F$ E' ~; y4 u' z2 A) Z3 L' E0 p8 t
然后通过"ipfs add -r 文件夹"命令添加整个文件夹
. ~: O4 h$ I9 u, I 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$ - 查看文件夹的文件内容3 w6 v: ^3 D* H* G- Q% M
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对应文件夹0 Y% o/ ?. p# ~7 o) K
访问文件夹对应的IPFS地址:
: v5 V8 L! z* S+ h9 r& g7 w1 Q1 ^https://ipfs.io/ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj
& I- B7 A) h0 f$ ^& l; v/ [第一次访问的时候,需要同步数据到IPFS网络,等待时间有点久,慢到让你以为同步失败了。% f& `: ? d( _% j4 r( C
# a) z) F) w% O# X+ ^4 `2 ?
* H: \, z z* k2 o% r5 R1 d* E' k( h) u/ l5 C0 C
查看IPFS对应文件夹
7 a* S: p7 r1 g
4 {- Z7 n9 [+ ?: E访问文件夹对应的文件,如看到图片文件,访问ipfs网关:
3 ^3 Y% K- h: \1 t1 u# Hhttps://ipfs.io/ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj/portrait.jpeg0 ?/ r, a1 X5 P2 A, }
5 k- \; S7 H- {5 d4 n
- A/ h7 ^& m# A' C1 M% J* R" h. J+ t
7 n2 A" J) t$ w# J/ S& N7 S, _查看IPFS文件夹对应文件
H" j6 \9 F5 v2 X
' Z" a! Y; Y8 u, k2 B, g或者通过文件的Hash来访问,如访问txt文件的地址:/ a) x F! G q" c& ~
https://ipfs.io/ipfs/QmPEWgwQEHD6qxm5cUivTEZ252T123DvQ5L6HyUDgViQvT
- @" X ~% w- d9 K! R! ?) ?
' B1 R4 [" ?/ p! A7 u5 n
1 e! b/ \4 |+ b& C7 u: D5 b, K
, K( s& w; F* T6 X- S
通过文件Hash访问查看
i, w4 |3 G6 |$ i) M4 @/ c a# x/ f. J5 ?6 S; J
2 s' h6 G. ^' O+ W1 @% l/ L
6.4 添加简单网页到IPFS节点- 网页效果和项目结构
( I. b' \( [" b- S) Q/ m& x0 S: g6 J实现一个简单的实时显示系统当前时间的网页,效果如图:
0 [. G5 G+ x- \$ c
8 l3 h& H; H7 |
! a. ^6 F/ V0 C2 Q& x Y1 y
, _" }7 `# y5 b" K
7 Y; o% ?& M. A+ v) N& fIPFS添加简单网页5 r; ?! U$ L4 B1 f: e$ ~6 `
1 h& e: D `! U+ g7 Q工程结构如图:
$ P, ?) C$ V5 V, j/ q+ _; E
6 \! w- r3 h( e: L& u6 j0 R! Y
: I; w0 R5 \; x" g! J2 r& H4 J
- ?, Y& E- `& D" ^# x* m+ E
( I+ D6 _3 M- j3 w. S" Q+ @8 J网页工程结构
' [ o7 g' _! ]+ j
9 O& Q1 T) W$ I- B: B- ^* w+ K- k' j
$ |% H8 a3 C4 M7 U0 T( B5 K 实现代码比较简单,这里就不贴代码了。
) W' {" E8 p7 x. U- ipfs命令添加文件夹
! j2 g# H4 K( V# L' u7 M; y0 lwenzildeiMac: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"命令在新的终端窗口打开运行。
* Z H! U& ^7 K1 ?7 l G- CwenzildeiMac:~ 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对应文件
( Y" W/ Q% [! j6 G4 V, @浏览器访问ipfs网关:5 X8 P* x3 H; p* ]) {- I
https://ipfs.io/ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD/. r+ w( [1 S4 d, L; ^
' t- A. r9 n8 x5 R
9 A1 G/ A5 O" l/ j( \3 T
, l/ S: F: Q, y! a k查看IPFS对应网页
# g' C! V9 a2 S' l
7 u- l! h. `2 N8 W* Z
, \0 t4 p! p, y' u' w \; Q. [1 p; @ 6.5 IPNS绑定节点名- IPNS绑定节点操作" `2 L7 T1 l+ p, L" Z% ]- i# [; L
每次修改文件内容后,文件的哈希值就会发生变化。对于网站而言,发布后可能还需要做修改,这时需要IPNS绑定节点名。每次更新网站内容后,重新publish一次更新发布到IPNS即可。
) w& |% G, E6 U0 K9 t. C刚才的html根目录的哈希值是QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD,操作如下:
# V7 A' Y) C9 w% ^& dwenzildeiMac:study wenzil$ ipfs name publish QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDDPublished to QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz: /ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD - 查看当前节点4 ]; N* O% A8 U! U' q
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"
' c/ c$ ]: F& T7 h - 验证节点# J0 r i6 G2 L8 B4 A5 ?& o N
命令为:"ipfs name resolve 节点ID“
9 c; A# T) ~& Y2 l! Q( UwenzildeiMac:study wenzil$ ipfs name resolve QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz/ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD - 访问IPNS对应文件
1 F* n: U" m7 k+ Z" h3 ^浏览器访问ipfs网关:+ p' ]( R: |5 I! u
https://ipfs.io/ipns/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz/( F& h( T# K3 G. g
; n' }+ k7 C) ~5 N" I! R1 K
8 ^7 }7 T' c9 F1 j& K
7 d) P( ^$ g7 c- i( x* ^( c( s1 s
查看IPNS对应网页. p' G, r" |2 A( M
. }1 t& o/ L4 }3 v* M7、IPFS与以太坊DApp开发实战- IPFS与以太坊DApp结合的好处
4 U' s3 n) n) N* H7 [在以太坊平台上,往区块链写入数据需要花费以太币,调用智能合约执行每一行代码的时候,都需要一定量的gas交易费。区块链存储大数据成本很高,而且不合理。
* n) ]8 m M: b1 y9 B# @1 V可以先将文件存储到IPFS,然后得到文件的Hash存储到以太坊区块链中。读取文件的时候,从以太坊区块链中获取文件的Hash,再通过Hash来读取IPFS网络上的文件。9 U4 N7 @9 P) x! h# H' I O
使用官方提供的ipfs-api,可以很方便地在代码中操作节点将数据上传到IPFS,或者通过Hash从IPFS读取数据。
4 r# e. I! n+ M( }7 S: J# bTruffle框架提供了快速搭建包含以太坊智能合约的React项目,可以通过"truffle unbox react"创建工程,然后安装ipfs-api依赖库。于是,可以在前端方便地调用IPFS的接口来读取、上传文件。- ^: a- w- m2 c6 E# i7 ]
truffle unbox react官网:/ \% D5 N* `# w' u2 v @# O
http://truffleframework.com/boxes/react5 F6 f, I. Y4 ~, H( _; s0 B' ~* [; _# e
- IPFS与DApp开发实战6 f/ C+ P1 L2 V% P8 [
话不多说,开始进入实战开发。0 d2 u C( ~4 f, o9 j$ K5 q7 M; R
7.1 安装Truffle unbox react新建一个空目录"ipfs_dapp",然后执行安装命令
# Z3 g9 w& M& V1 ntruffle 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",修改后完整代码:, _2 ^4 z$ Z8 K& u# p7 }8 d6 ?
pragma 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"+ i$ |7 f: C4 a$ j8 @
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"进行智能合约的部署2 u) B! c7 |# K
; f, c5 q$ l+ ^8 x
2 N# V% b0 h+ A) a7 h+ x9 k/ ?
$ o: o# t$ G* A3 S# t& k
Remix-IDE部署智能合约
& F( _2 E7 ^0 f+ J$ I; n: _2 K7 V* m2 j
9 c; d9 K: k5 j3 s$ A0 j9 Y- a( J. f$ W3 Q# K; q# E9 @. `
. T* z& e6 f2 V1 p- S
; L# z. G( @8 G$ l
Remix-IDE部署智能合约-确认 \7 L3 |; p( z+ E" [
( I: z0 |- I% w3 w/ `6 [, k
然后复制智能合约地址,App.js文件中会用到合约地址为:"0xb177d6cf6916f128c9931e610c63208d9c5a40f3"
, }# a: {! s% T& G! U; K5 G7.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"命令,结果如图:$ \! o4 N4 t3 I' ~5 Q3 ~% ~
: ]$ z+ F _; F9 Q/ a1 r+ ^0 V: @1 X6 @ H1 Y8 w6 l
npm_start# G! J, f3 \+ ^& e$ e
9 ?) u5 B2 f6 A
会自动打开网页,然后上传一张本地图片,之后点击"图片哈希写入区块链"按钮) J' H. q, ~7 {4 V; \* k
m8 n2 _, q! F
$ i) c/ N1 f5 d6 W) x
3 \9 [8 P7 t: s$ l/ t5 M
运行结果1
/ d7 T8 T" Q ]! a( [% G9 m
- ^6 p* A! F, v0 U' z& \, i8 v最终效果如图:
0 d6 B9 v/ p; v
/ L9 E# Z: X5 W, @2 C0 `- a7 ?, T9 C. p6 u) }$ K, `+ e( @. G
7 z; E3 w, x+ a C: \' Y4 w* ?
. h0 m; R2 j/ v# y' }; I. A7 O运行结果
0 D2 {8 m' \, k2 T2 Y# J: y: \; d
访问IPFS网关:4 U+ N/ A3 q5 b; e* e
https://ipfs.io/ipfs/QmbHptfJfyuGAZxstFYgAVfz33cytR1seTD3ZabBSDd899
0 V0 s- B" ]& u7 Q/ q/ @; e" r发现图片已经成功写入IPFS,如图:
0 l% K- m* \( R$ e/ r+ C- r) f$ Q! o- l) }# k/ d
9 e: q* F+ d' N) t8 o
" f7 `" Z* d+ {- V. t. f$ j
$ K$ |' F5 z* C% V) k' ^运行结果34 [5 p }, i+ m! o( q3 V
# m+ ?1 L* K; |: Q: y* E0 h ^备注:本地IPFS网关端口默认为8080,我的电脑上端口冲突了,系统自动修改为8082。7 Y& F, C5 b- V' {! ^. B6 b7 f
搞定,收工。' c; q( h& j8 A2 V" i; X9 _
PS:刚入坑的小白,很多不懂,还请各位大佬多赐教,谢谢!. c" H0 g# ?* Z' X& H5 p; W4 ?
) Y" v2 T- R# W2 P
|
|