|
|
本帖最后由 赤膊医数 于 2021-4-22 23:41 编辑 ) o1 y5 Z- J) {7 ~8 u9 ~
6 m4 r( e* v- |/ y3 C( a2018年,最火爆且值得期待的区块链项目莫过于EOS和IPFS。1、IPFS简介- IPFS是什么6 [8 E6 ?" X! Z9 D9 H! E
星际文件系统IPFS(InterPlanetary File System)是一个面向全球的、点对点的分布式版本文件系统,目标是为了补充(甚至是取代)目前统治互联网的超文本传输协议(HTTP),将所有具有相同文件系统的计算设备连接在一起。原理用基于内容的地址替代基于域名的地址,也就是用户寻找的不是某个地址而是储存在某个地方的内容,不需要验证发送者的身份,而只需要验证内容的哈希,通过这样可以让网页的速度更快、更安全、更健壮、更持久。* c0 g5 o$ U. J" x! X& B( O
以上内容来自巴比特官网介绍9 n5 q& L) s. q: U
IPFS是基于区块链技术的去中心化存储网络,实现了永久性存储。
* ]; g. f" H# Z1 P - IPFS的火热& Q2 ]- [ D3 T- l' t: y$ K7 I
Filecoin ICO是迄今为止涉及金额最大的ICO,仅一小时就募集了接近2亿美元,打破ICO记录,成为2017年最火爆的区块链项目。IPFS项目吸引了世界各地数字货币投资者和互联网从业者的密切关注,2018年比较值得期待的是IPFS主网的上线。然而就在前段时间,官方公布说上线时间延期到年底。
" u* [: [2 r$ q7 ^5 {注:Filecoin是IPFS激励层的加密数字货币(即代币),有点类似于以太坊平台上的以太币。+ |6 S- k- [8 b& b0 ]" T7 W2 B+ D
IPFS官网:https://ipfs.io/8 v+ I$ J7 ]) A H9 s# p* s
Filecoin官网:https://filecoin.io/. S) k1 [' W% G
- IPFS的应用案例" R2 a k, w: q- ^
GitHub有两款开源项目,且有对应网址,分别是音乐播放器和视频播放器。
9 G& G: o, U1 E s$ ~& T7 j2 y4 `9 ]
- IPFS音乐播放器) Y0 v8 M; ^+ N
% j, T( h6 J M! g! m* K
- |; `1 L/ o, w; {( T
- @& T8 k% O3 }
7 q, k: [/ U) X. N
IPFS音乐播放器
) G+ I" h5 z. q! i7 _/ S- K$ O5 T# J8 L7 l, z" t
IPFS音乐播放器网址:https://diffuse.sh/
7 y, f6 u$ L! V8 ~9 t _GitHub地址:https://github.com/icidasset/diffuse
7 L+ l- ^5 c- D8 v/ | - IPFS视频在线播放器7 T+ s Z& u0 f% q! X1 u: u
* e& U! {& P& t% h& t
# X7 K, K" W+ u" c
2 t: Q6 J( V3 z3 l$ S3 u. u
- E! o( |$ C: \0 B) A& }3 j
IPFS视频在线播放器首页0 U/ M! a8 N/ U" [' a6 V4 ^* [# x
5 e+ ^' f/ M" h' `" ?
6 s6 I4 k: N* ?* \1 T / l B+ F# \/ G7 q- ~& C+ ~
2 i# F2 T3 k* I, }
$ j8 [6 ~9 \) d8 V$ r1 f
IPFS视频在线播放器播放电影7 F2 u6 ]1 V3 m& |4 \0 r7 v |
/ d2 A8 A! A2 Y) H5 G& A号称是国内第一个IPFS应用
( S. W% t p( C% wIPFS视频在线播放器网址:http://www.ipfs.guide/) d4 L( o. d8 J9 X
GitHub地址:https://github.com/download13/ipfstube9 t, ?- j! t X2 {5 H* O9 U
可用于测试的电影视频Hash(这里只列举两部):0 |* p! H0 X% B# T2 |
神秘巨星:QmWBbKvLhVnkryKG6F5YdkcnoVahwD7Qi3CeJeZgM6Tq68" F+ ^4 v D, A$ t. l1 r, {+ N) i
盗梦空间:QmQATmpxXvSiQgt9c9idz9k3S3gQnh7wYj4DbdMQ9VGyLh
! {) F: J1 W, d9 x ?& D% G 2、IPFS的安装既然IPFS这么牛,有必要了解一下IPFS的开发,先从IPFS的安装开始。
/ L: v- j" Q4 [% \- IPFS Desktop: M/ ^: D( ?+ V0 V# D! A+ ?( a
当然,可以直接安装IPFS节点桌面管理软件来体验一下。该软件可以方便地运行和管理自己的节点,查看IPFS节点资源信息,支持二次开发。该项目是Node.js编写的,已开源。
5 N, s `9 `9 k a- m/ d; a# i3 m3 L8 b
# F. p+ L; ? [$ G2 c! F% C
3 r2 c% Q( Z1 V% w/ [7 x2 L
* G2 ]' Z' T; f5 [" G* a' W
IPFS节点桌面管理软件# X! ?0 N: b; N2 \
) O/ [: L# G. y. p, W# _GitHub地址:
7 I" n8 h0 w& D$ r, F5 m+ `https://github.com/ipfs-shipyard/ipfs-desktop
5 L6 }% m+ |' E @6 i3 W - Go-IPFS
0 i: o6 ^8 h) s% c6 O0 A进入IPFS的官网,找到并切换到"Install"页面,点击"Download IPFS for your platform",会跳转到如下网址(需要翻墙):: N( b* P' [" |' Z. Y6 a
https://dist.ipfs.io/#go-ipfs
( M/ H# e( P" ?
: I7 n0 x& E) u$ f# u# V+ E9 `1 N
6 t8 m4 Q: S1 r) w1 ~! z, M: l
c# a* W1 y4 w下载Go-IPFS8 z, v) N6 J! x1 ?) A
I/ q/ b' r' ]8 }/ z
如果打不开,可以试着去Github查看安装方法
& p: ^9 k2 h' s0 c* }$ HGitHub地址:https://github.com/ipfs/go-ipfs
# Y& ]7 b7 o2 d1 |将网页下载好的文件解压出来,下载的是"go-ipfs_v0.4.13_darwin-amd64.tar.gz",解压出来的是go-ipfs文件夹,- m' X8 q* F' W) m5 C; y) g
然后打开终端,进入到go-ipfs文件夹根目录,复制ipfs文件到系统的bin目录,然后可以通过"ipfs version"来检查,操作如下:
7 }/ J# _) d5 O* K; |% P, FwenzildeiMac: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" T4 [6 ^" a5 a! F2 q; m [
3、IPFS节点的创建、查看和启动以下是安装官网的Go-IPFS步骤下实验的' o. ~: `" W3 ]$ @/ {( H9 K2 c
- 创建节点) z/ P6 M8 I+ M* d* q1 S: V
进入到当前用户的根目录,并使用"ipfs init"命令创建节点,可以用"open ./"打开创建节点生成的".ipfs"目录。# g* s$ \* C( [9 [
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 ./
- ]. u5 U9 W. U Y! i 7 l6 i$ W/ l+ x
3 `/ X. ]. L9 z" O# L# S5 U3 j% {: b
IPFS节点的创建
- G" q" x! ?8 p8 Y1 {+ f( X: K3 G( m; N; g; l# [. g
- 查看节点id
! j8 I# J. N$ h/ iwenzildeiMac:.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默认存储空间
7 C$ [6 C C7 w1 A存储节点默认存储大小为10G,如果你想修改存储空间,可以修改config配置文件,找到StorageMax并修改. w" O" I' _: X9 r+ M
wenzildeiMac:~ wenzil$ export EDITOR=/usr/bin/vimwenzildeiMac:~ wenzil$ ipfs config edit
! K2 W1 m" l. W# _( L. e2 |
* D( W0 n8 w9 g9 c- \4 N% t. ^9 E( D
$ U+ K: I1 G$ ?' m& `/ p修改IPFS默认存储空间
, s6 p% }# Z: A' h. J. B# ~; _8 K+ ?9 H0 k0 b4 g
- 启动和同步节点服务器* o. a+ T$ ]" X5 a2 J5 s7 b
执行"ipfs daemon"命令,可以同步节点数据到IPFS网络。
c' m0 X7 D- CwenzildeiMac:.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
, t0 c- j! E( g+ L 4、IPFS运行体验- IPFS查看ReadMe& ^& p# x# K7 U( m
可以回去查看执行"ipfs init"命令的时候,返回的内容。打开一个新的终端,操作如下:6 J7 O0 X+ m6 K- `0 X; s* j
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管理界面$ w+ y. i' y% l C( y- \5 z6 O
IPFS节点服务器启动后,可以用浏览器访问:http://localhost:5001/webui
1 E) d" u4 L7 R( Y Z8 D4 |有本地配置、节点连接、本地节点文件等信息,如图:
8 ~$ `! u- T$ B. a8 @7 B4 @% P4 `. g3 G6 M( G$ J. ^) U! ?
1 B* V7 m5 `# y0 l. T) Q' Z5 a1 Y
1 h7 {5 _3 _6 S0 r6 p; T. t0 N) \8 i" L |" {
IPFS的Web管理界面
3 a1 |9 V; ?/ y
1 M3 Q- M& X7 `$ @4 h1 ~
+ P/ \6 N1 t/ I: b9 y# g2 v6 c( I0 X
5、设置跨域资源共享当我们在前端通过js接口操作ipfs时,会遇到跨域资源访问问题,可以在终端执行以下配置来解决:
2 T( [- c" s1 u) yipfs 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节点- 新建文件
% A9 m5 b& e& T/ C' h6 ewenzildeiMac:ifps_test wenzil$ vi test.txtwenzildeiMac:ifps_test wenzil$ cat test.txt IPFS测试文件 - 添加文件到IPFS节点( ]$ |3 W* D4 L6 Q$ J
wenzildeiMac:ifps_test wenzil$ ipfs add test.txt added QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab test.txt添加文件到IPFS节点后,返回了文件的哈希值
; Y& V. I% y% m' W: O - 查看IPFS节点的文件
* Z) n1 Y# E7 ]6 q. CwenzildeiMac:ifps_test wenzil$ ipfs cat QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2AbIPFS测试文件注意:此时的文件只是添加到了本地的IPFS节点,读取的是本地数据,可以通过如下网址查看。) i) V: e$ c' l: `+ t+ Y$ G
http://localhost:8080/ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab
5 m/ K9 d/ Y! u+ A5 x. T通过"ipfs daemon"命令启动节点服务器,会将本地节点文件同步到外网,同步成功后,这时就可以访问如下网址来查看(如果访问失败,试着翻墙看看)。7 Z# F, V6 E' C* H3 o7 b0 I: i
https://ipfs.io/ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab
! S8 U a o' Q4 D# |
9 r$ j: j# i8 u$ ]& J
: g9 J9 y- J% Q, K1 @/ W3 b) R6 w& M2 X4 x8 o4 I' @ g
查看IPFS文件内容
4 L! O% a5 P7 d0 y
& O7 g$ L3 C- k4 a6 N1 b' V+ r3 o如果访问成功的话,说明已经存储到IPFS网络中。目前IPFS网络暂未加入代币Filecoin机制,所以存储读取文件免费,速度也比较慢。, [/ q2 `! r1 l; z/ H5 _
- 下载IPFS节点的文件; d: E. K' S1 k' m3 ?: \
wenzildeiMac:ifps_test wenzil$ ipfs get QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2AbSaving file(s) to QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab 25 B / 25 B [========================================================] 100.00% 0s查看当前目录,发现多了一个"QmSV..."的文件"
( \2 e5 I, o) v% ^
9 u4 g- O& ~7 c5 u
! l: L( m# q2 t! ]( c S
: ?4 F+ T1 X j- O- n7 u* }( u- {. T- J3 N
下载IPFS节点的文件/ b; o" R7 |) C9 s
2 ]3 |- r2 `+ v/ X8 \$ C) R0 y" u s& y( B
6.2 创建文件夹存储文件- ipfs命令新建文件夹
# z7 v7 d; ?: A+ |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 /文件夹名"可以删除文件夹。( o0 d2 Z% h1 G$ Z
" C+ |- w" D# E c9 J
6.3 IPFS上传文件夹- ipfs命令添加文件夹
/ G; w8 o# r+ S8 p先在本地创建一个文件夹和对应文件,如图:! u7 q6 [: ?& x8 H9 ]& l; O# f/ H
y2 l7 y4 L: I5 h+ C4 t) s* P& N" f1 i8 ~4 R1 e" [* M4 Y9 Y
: s: b; S9 D) d: t8 E5 [
8 f9 @, v: o% v! U7 p& T本地创建文件夹及文件
' J8 E1 i J& ?: k2 x( m& ^* X! D6 ?! R0 F* g# ^
然后通过"ipfs add -r 文件夹"命令添加整个文件夹
# o6 T2 V9 a0 X( o2 i5 ]8 O6 p 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$ - 查看文件夹的文件内容) e$ P7 I3 G) n6 v
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对应文件夹
9 c, V8 v2 {( g& X. i+ c# C% n; ~6 \访问文件夹对应的IPFS地址:
2 u, _/ V9 q9 f. @2 p& Y8 Rhttps://ipfs.io/ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj
; P* S7 z/ `3 R" L. k" f6 l0 J第一次访问的时候,需要同步数据到IPFS网络,等待时间有点久,慢到让你以为同步失败了。! S5 A% _- t2 n& |; G" g
; ~# u) W% f+ O& ?1 Y% G$ Q4 p
0 L U( U. c6 r$ H8 m- K
! @/ `) h$ I, n/ y9 K& ?2 h查看IPFS对应文件夹) S, y& z1 l) }- Q+ O. x
/ u ~" a) i( @' k( N访问文件夹对应的文件,如看到图片文件,访问ipfs网关:# m+ r5 p6 O; D5 f6 G
https://ipfs.io/ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj/portrait.jpeg$ X$ J# t6 A$ A$ p9 K$ [% o6 Q
/ r4 x. f/ c8 D
$ b" t( V- q& T& `7 f3 Z
: k9 c; D' P. S
查看IPFS文件夹对应文件
1 E$ ]8 F& l [$ P2 C$ U
# b- E! S, o& [4 Y q或者通过文件的Hash来访问,如访问txt文件的地址:4 B( A1 u- A6 }7 Q) d. r
https://ipfs.io/ipfs/QmPEWgwQEHD6qxm5cUivTEZ252T123DvQ5L6HyUDgViQvT
. t0 h) }/ [& T, v2 A% e7 C* V! c/ J& H- h7 J
% G9 L) e2 E ~
/ w& q; f- m9 T; R. u9 e" B9 J
通过文件Hash访问查看
4 Q6 K/ A6 }1 Y( l( t8 _* k" d. |( V2 k5 e8 |! k/ J4 S# R
' m9 E; _! ^# t) d/ n* ~
6.4 添加简单网页到IPFS节点- 网页效果和项目结构3 [) r, I* _% {9 q
实现一个简单的实时显示系统当前时间的网页,效果如图:
- i7 t( o: e) d& H) u# j$ H, t
& x$ g9 E+ t# B: a
" _5 Q5 m% Y- H+ K, Z
( B) I+ j( i- C% y9 e
% |- t/ \7 l$ `IPFS添加简单网页
; L% Y' V) m. `! i: [2 [8 S& g) N0 Y4 E7 s* ]" W# M. Q6 s# `
工程结构如图:
5 q1 m% S" K0 C. R" Z
) q6 ?0 s5 j. R9 v3 H P) I9 m: a; B9 c) e
$ t2 ~& G2 b; A# T; K
7 Y$ U. d) m" y+ t" U9 M+ U* P0 c网页工程结构
) t6 o& f l- y' n9 M4 G2 L; [: B+ m' ?. ]
& m9 ~) {! r5 T; q 实现代码比较简单,这里就不贴代码了。' }5 I+ b H- h3 B6 _. y/ Y
- ipfs命令添加文件夹+ M4 R7 ^+ W! L: \
wenzildeiMac: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"命令在新的终端窗口打开运行。
8 u) G3 W+ c1 i1 J1 e. GwenzildeiMac:~ 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对应文件
- E8 k- B! k3 o9 I0 C3 q$ y浏览器访问ipfs网关:
$ E' p; G+ k8 S- |4 phttps://ipfs.io/ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD/
: ~7 |# G4 Q. r; Y! k6 ~; g2 O8 h6 m, R3 H$ W. H
3 e& S% k! t8 `
! I. g3 w7 @! |( D3 s9 e查看IPFS对应网页
' |" ]6 U6 d- @- Q& J! A( @) \: R% j" J5 M9 \
2 K) V! v7 N0 x4 T 6.5 IPNS绑定节点名- IPNS绑定节点操作
+ U8 \# x$ T1 l每次修改文件内容后,文件的哈希值就会发生变化。对于网站而言,发布后可能还需要做修改,这时需要IPNS绑定节点名。每次更新网站内容后,重新publish一次更新发布到IPNS即可。6 r. B' E* M1 W/ U) m
刚才的html根目录的哈希值是QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD,操作如下:5 C; Q) ?( X% a) a
wenzildeiMac:study wenzil$ ipfs name publish QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDDPublished to QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz: /ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD - 查看当前节点
/ Q U! m5 q' _ YwenzildeiMac: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"
. m" g7 Y" w: t- t/ _# F8 K - 验证节点4 v3 a% K0 C0 r8 Z. d" Q8 J
命令为:"ipfs name resolve 节点ID“
% N/ T4 q$ q2 }wenzildeiMac:study wenzil$ ipfs name resolve QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz/ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD - 访问IPNS对应文件
2 |* S: t* G2 \0 E$ N0 {/ V浏览器访问ipfs网关:
9 P* S) \, h# h. L% O9 z; Ohttps://ipfs.io/ipns/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz/
+ Y: G. M: X9 z# h/ x# f
9 Z p0 Q- Y; z1 Q 2 o& M5 v' b. ~; E) o
2 r6 _, b/ \: ?8 m; N- l/ z
4 k' t+ O# j7 J: }$ v7 b
查看IPNS对应网页
+ h1 f V& T# w! L% m5 m0 ]& \; ^
, y( X: Y& O) b2 T( y4 c% g" F7、IPFS与以太坊DApp开发实战- IPFS与以太坊DApp结合的好处
" ^' P* Z( m( p% f在以太坊平台上,往区块链写入数据需要花费以太币,调用智能合约执行每一行代码的时候,都需要一定量的gas交易费。区块链存储大数据成本很高,而且不合理。
6 R6 o; Y" x) \# h+ D, e, P* O' f* |可以先将文件存储到IPFS,然后得到文件的Hash存储到以太坊区块链中。读取文件的时候,从以太坊区块链中获取文件的Hash,再通过Hash来读取IPFS网络上的文件。% S: o' `6 A/ p5 |+ Z" M) A: ~
使用官方提供的ipfs-api,可以很方便地在代码中操作节点将数据上传到IPFS,或者通过Hash从IPFS读取数据。7 j9 |6 m, Z) g! E( l
Truffle框架提供了快速搭建包含以太坊智能合约的React项目,可以通过"truffle unbox react"创建工程,然后安装ipfs-api依赖库。于是,可以在前端方便地调用IPFS的接口来读取、上传文件。
3 t0 ~9 [ w& D& |! P7 t9 t$ K) L# utruffle unbox react官网:
5 L6 L6 u0 n1 k+ ]http://truffleframework.com/boxes/react# d* L, C f+ g. X
- IPFS与DApp开发实战7 X1 @ M; W+ ^# R& ?, l7 l
话不多说,开始进入实战开发。: z7 d$ H! R! |
7.1 安装Truffle unbox react新建一个空目录"ipfs_dapp",然后执行安装命令4 h2 C4 `7 G" K3 U
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",修改后完整代码:
: J; K8 J* i7 epragma 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"
* Z7 z. R; ~; o- w# Lfunction 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"进行智能合约的部署 w7 Q v8 i! r
# j1 r; J$ d' n4 @
9 n5 _0 t6 R- w7 Q9 I4 B% P) c
7 x7 ]5 X$ p- G6 I( o. ^8 [3 HRemix-IDE部署智能合约
$ ?3 s$ U1 L3 `
; `1 @" f- D' w& k+ ~0 F! O T7 Q
8 p7 ?; d4 _; J$ W0 N( M
0 r4 Y. F U( R
( p j1 S! d& M/ v' F8 WRemix-IDE部署智能合约-确认
; w' C6 l' ]/ S9 y, B0 h4 v
, W: g3 x0 Q5 n1 e+ x然后复制智能合约地址,App.js文件中会用到合约地址为:"0xb177d6cf6916f128c9931e610c63208d9c5a40f3". s9 g4 s1 X# {2 ]0 }& u0 G9 {
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"命令,结果如图:
5 ~( x- Z( P& t [
- F* H& p0 ^/ e1 q- K# L
# l) G0 F! k: c- ]# w& w" G, m6 fnpm_start
' _' N2 s; H1 P+ R/ V* V
8 P4 K$ P. k. k% D会自动打开网页,然后上传一张本地图片,之后点击"图片哈希写入区块链"按钮
& Y% r9 |8 D# n$ ^9 F0 _
2 a4 o) i! K" f: p" N/ u
4 H' j+ F, @9 T7 u: H! W& S; u/ Q c$ m8 q. a" N/ N x
运行结果1
8 ?2 i4 s; h' L+ R9 t! @4 Z
6 D0 D" ?; X3 U9 g2 c最终效果如图:. t. T0 _: z9 H& `$ V- Z4 v$ m' i& {
8 o. q$ S ]5 F
7 b4 v |' f% c) a s
5 s' ^# J$ f& Q9 T' h
& P' t1 F% ?, B& T; j
运行结果) Z2 o; G) q5 U' g
3 a, V% l7 v: r* j
访问IPFS网关:
5 }8 o6 J& ?# v7 Zhttps://ipfs.io/ipfs/QmbHptfJfyuGAZxstFYgAVfz33cytR1seTD3ZabBSDd899
$ P' R+ z& r' b3 H发现图片已经成功写入IPFS,如图:
, u0 K5 T- H) J: G( t! t. }. |2 b5 \* m
: `* u# f e# O+ S$ ~; S4 k0 X( @ ?) c2 i) O _5 _, a; {
1 L. B3 M+ F! n2 h9 P4 s
. |, o7 N9 e* X; e
运行结果3
& p( f2 A; ]) k) m3 B
9 E0 i& p& U+ r3 A2 p备注:本地IPFS网关端口默认为8080,我的电脑上端口冲突了,系统自动修改为8082。
* V1 a+ l" O q! O, g4 A9 D搞定,收工。4 }4 ~4 {% x3 e0 C, g6 Z9 f% l
PS:刚入坑的小白,很多不懂,还请各位大佬多赐教,谢谢!
! ~' P& z6 t i* V& r8 E* G3 M& M
/ Q1 Q0 S4 l" Y0 ~6 M$ k% t
|
|