|
|
本帖最后由 赤膊医数 于 2021-4-22 23:41 编辑 1 M* E& Y3 M* L# k7 _ P! \2 `
8 ^, G0 U0 J' F3 r7 c2018年,最火爆且值得期待的区块链项目莫过于EOS和IPFS。1、IPFS简介- IPFS是什么
1 g0 `9 G1 X; b9 ]星际文件系统IPFS(InterPlanetary File System)是一个面向全球的、点对点的分布式版本文件系统,目标是为了补充(甚至是取代)目前统治互联网的超文本传输协议(HTTP),将所有具有相同文件系统的计算设备连接在一起。原理用基于内容的地址替代基于域名的地址,也就是用户寻找的不是某个地址而是储存在某个地方的内容,不需要验证发送者的身份,而只需要验证内容的哈希,通过这样可以让网页的速度更快、更安全、更健壮、更持久。
$ P. e0 I" ~& }以上内容来自巴比特官网介绍
; |$ L, d+ `. J7 G& y) n2 y7 ]IPFS是基于区块链技术的去中心化存储网络,实现了永久性存储。
+ c3 @, i5 m; l9 q' p/ A - IPFS的火热
+ m% v3 }- b, E6 M3 s2 RFilecoin ICO是迄今为止涉及金额最大的ICO,仅一小时就募集了接近2亿美元,打破ICO记录,成为2017年最火爆的区块链项目。IPFS项目吸引了世界各地数字货币投资者和互联网从业者的密切关注,2018年比较值得期待的是IPFS主网的上线。然而就在前段时间,官方公布说上线时间延期到年底。
2 C6 r+ T6 Z% i9 @/ K; g( X注:Filecoin是IPFS激励层的加密数字货币(即代币),有点类似于以太坊平台上的以太币。
3 u2 ?3 }4 N4 x0 b& o2 P' rIPFS官网:https://ipfs.io/, V( `) b2 Q/ C" q6 q6 K! X% p
Filecoin官网:https://filecoin.io/
7 \ J+ S6 ^$ {, Z5 | - IPFS的应用案例# L2 {0 `" l2 V& S
GitHub有两款开源项目,且有对应网址,分别是音乐播放器和视频播放器。/ T' M* q# w( g& }- a' t
$ G1 }7 d& G3 [; F% w/ P
- IPFS音乐播放器: P8 q" ^ o) L1 S8 ?' K1 k
# l/ [, v4 b% ~' H1 h; @
X# Z3 j; U; o- O% C+ |
9 b `7 K% C$ S* y |/ i9 W3 S: j6 w
5 Z+ I5 n b' z- E" e( A' O+ T# p
IPFS音乐播放器; B1 o3 ?3 c8 {- G/ J, ~6 R0 p
4 Y& o6 A Q+ ^. j- |
IPFS音乐播放器网址:https://diffuse.sh/ R; i0 f$ R0 I$ D4 L
GitHub地址:https://github.com/icidasset/diffuse
' y3 j' u/ [2 P3 B - IPFS视频在线播放器
: r% u6 f. N2 V2 x4 V# P; Q
* S% N* h; Q/ c; [8 D7 X" v! y& `$ q$ V$ s" N
' y# S2 ?- Z! y1 P7 p m3 J! C0 w/ }& }) @$ d' C
IPFS视频在线播放器首页
; {: y0 T; f2 ?" A, F% r2 v+ O2 t! g3 B4 j5 a/ Y5 W2 {; d, Z
3 o" I' ^0 `6 y
1 A* n7 r7 `( r6 S4 Q) m |
3 W. V$ o) b1 i- s' {
# b9 N9 B8 C3 |. Y8 j( _IPFS视频在线播放器播放电影0 W6 ~! y9 }* D6 k Q
6 w7 _! n& t( Z% F- M s* `1 R% k号称是国内第一个IPFS应用
: P: b, O. t/ D# Y4 [/ fIPFS视频在线播放器网址:http://www.ipfs.guide/* Q7 d: V( T8 p5 F2 g5 _
GitHub地址:https://github.com/download13/ipfstube
2 p. `7 _$ U$ z* e0 b可用于测试的电影视频Hash(这里只列举两部):
) r1 ]0 I A0 O9 d' V神秘巨星:QmWBbKvLhVnkryKG6F5YdkcnoVahwD7Qi3CeJeZgM6Tq68, t: C5 j' l% ~
盗梦空间:QmQATmpxXvSiQgt9c9idz9k3S3gQnh7wYj4DbdMQ9VGyLh/ g+ _4 m' s- t
2、IPFS的安装既然IPFS这么牛,有必要了解一下IPFS的开发,先从IPFS的安装开始。) Y; p6 z6 r ]# {; _9 Y! G5 g$ k
- IPFS Desktop' ~# l7 |$ O) _+ S3 y! X+ p8 T
当然,可以直接安装IPFS节点桌面管理软件来体验一下。该软件可以方便地运行和管理自己的节点,查看IPFS节点资源信息,支持二次开发。该项目是Node.js编写的,已开源。
) d' i1 u7 R- E, U# U7 [
& S! i; D# p# E
* j2 s* J6 u. I
: `8 p" D7 _- l! g0 ]/ Q; `7 e6 V7 R; s6 [
IPFS节点桌面管理软件
! b5 X$ i6 z2 H# ~2 w9 p" M& |; A: C" J- H
GitHub地址:
& e- n$ ~6 r* p1 R- s, ~( C, ]- uhttps://github.com/ipfs-shipyard/ipfs-desktop2 H9 x, @6 P0 X* W" t) O0 r, Q" \
- Go-IPFS
+ Z# n2 o' v6 n0 C进入IPFS的官网,找到并切换到"Install"页面,点击"Download IPFS for your platform",会跳转到如下网址(需要翻墙):
7 n, X o+ W; p6 Vhttps://dist.ipfs.io/#go-ipfs9 V6 }2 ~+ _" g' }* Q
! E' P* |7 d9 d8 @1 D
' ]) O2 }, |" [$ J$ h; C
% p7 l3 m0 ~+ ~# K5 |下载Go-IPFS7 X. F2 ]; u+ P1 I. e8 k
4 O1 D, R4 h# a b3 G4 o8 K! Y如果打不开,可以试着去Github查看安装方法
! I4 w' i' s2 l# K$ F$ r$ o! cGitHub地址:https://github.com/ipfs/go-ipfs
: \/ e3 ?9 @' D( R将网页下载好的文件解压出来,下载的是"go-ipfs_v0.4.13_darwin-amd64.tar.gz",解压出来的是go-ipfs文件夹,% x, s1 w# F _2 T! L H
然后打开终端,进入到go-ipfs文件夹根目录,复制ipfs文件到系统的bin目录,然后可以通过"ipfs version"来检查,操作如下:' S9 H" q) U0 R5 G$ T" B( R! U
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
6 \# p& P+ j k* J, B w! [ 3、IPFS节点的创建、查看和启动以下是安装官网的Go-IPFS步骤下实验的
, `% u' J9 ^" K; F- 创建节点* L$ q2 k4 b. L1 h
进入到当前用户的根目录,并使用"ipfs init"命令创建节点,可以用"open ./"打开创建节点生成的".ipfs"目录。2 `. ~& r8 u) ^- N: s/ c c
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 ./* P0 r# N; k8 h7 N
9 E2 i$ [6 |* P1 _0 \0 c) B
( q' M3 v; E3 k" ?8 {& N
) l$ O' P2 N. w5 A7 bIPFS节点的创建
% \2 I5 `* Y! e$ s' W! F2 U2 p
; R/ q( {6 N' r; ^. k+ Q- 查看节点id- |) {: G5 R. B6 }# e
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默认存储空间
& x$ g) ]) w8 G, h存储节点默认存储大小为10G,如果你想修改存储空间,可以修改config配置文件,找到StorageMax并修改
% \. O2 U! T0 } gwenzildeiMac:~ wenzil$ export EDITOR=/usr/bin/vimwenzildeiMac:~ wenzil$ ipfs config edit $ m9 s( `2 n4 |6 F8 Q- s ^
) S7 x5 i- X$ N* z. m& p8 q: i8 G# p
修改IPFS默认存储空间 P# Y# X) w9 m' o' h* ?
7 C; a% e9 b: d: D! ^" f( m: G8 U4 Y/ E
- 启动和同步节点服务器2 L, s) n! r+ e' w) O2 F
执行"ipfs daemon"命令,可以同步节点数据到IPFS网络。: x, J$ Q& [6 @, ]2 y7 i& t" M1 ~
wenzildeiMac:.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
: x1 T" a- k' ~5 l* t7 U3 E 4、IPFS运行体验- IPFS查看ReadMe
5 f/ H8 S( v- x% U可以回去查看执行"ipfs init"命令的时候,返回的内容。打开一个新的终端,操作如下:
. L5 u1 p& B# HwenzildeiMac:~ 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管理界面9 @* b+ u5 d0 T# a. L" g8 \
IPFS节点服务器启动后,可以用浏览器访问:http://localhost:5001/webui
* W- ?8 z- P) _" a% x/ ^! Y有本地配置、节点连接、本地节点文件等信息,如图:- {$ d: Q- g/ c! P
5 C% b/ z2 F; L; f
4 F# q+ G& O7 y( l
7 O! ]* `4 w( Z2 t( U) G( K4 {+ T3 @% J
IPFS的Web管理界面
" q5 n1 N& M, M) H; }7 v7 z) ?
. I; H$ Q4 `/ z Y7 C/ }" S" u' i" H1 X/ x' l/ O! \0 k6 k
6 H% C8 \0 E4 C
5、设置跨域资源共享当我们在前端通过js接口操作ipfs时,会遇到跨域资源访问问题,可以在终端执行以下配置来解决: C+ F8 O: F! J+ E
ipfs 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节点- 新建文件
! I& V( P& h# f: u8 uwenzildeiMac:ifps_test wenzil$ vi test.txtwenzildeiMac:ifps_test wenzil$ cat test.txt IPFS测试文件 - 添加文件到IPFS节点
' y5 j, i2 P% E0 ~! b5 s6 twenzildeiMac:ifps_test wenzil$ ipfs add test.txt added QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab test.txt添加文件到IPFS节点后,返回了文件的哈希值
* m9 r8 _# _/ T) v - 查看IPFS节点的文件' E1 `, H6 |% `- A! j
wenzildeiMac:ifps_test wenzil$ ipfs cat QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2AbIPFS测试文件注意:此时的文件只是添加到了本地的IPFS节点,读取的是本地数据,可以通过如下网址查看。. d7 k& K8 D, b' B
http://localhost:8080/ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab+ p7 I) d+ w1 X
通过"ipfs daemon"命令启动节点服务器,会将本地节点文件同步到外网,同步成功后,这时就可以访问如下网址来查看(如果访问失败,试着翻墙看看)。* v4 O# d8 F+ }# n' {
https://ipfs.io/ipfs/QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab
5 @! w- ^0 ]; P4 A" I E6 s
1 L6 y' T( a) w( M+ Y
2 `3 ?, Z$ k% a: P! f$ Y1 x$ ~3 k+ v/ q- ^" j. l( y( Z
查看IPFS文件内容
! g- B1 F8 X- S8 V/ K8 B6 f3 Y1 ?, v% U
如果访问成功的话,说明已经存储到IPFS网络中。目前IPFS网络暂未加入代币Filecoin机制,所以存储读取文件免费,速度也比较慢。
+ v2 |0 c+ z. L+ |% G! e - 下载IPFS节点的文件
$ ~+ }6 a4 E1 g8 D/ R. cwenzildeiMac:ifps_test wenzil$ ipfs get QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2AbSaving file(s) to QmSVKEwPBTzw5QLzGUE8oN8J1r4cadMeieSw4Co1ozm2Ab 25 B / 25 B [========================================================] 100.00% 0s查看当前目录,发现多了一个"QmSV..."的文件"
{0 U, u" Z: z. I5 S M; g# q3 y+ u/ B* p; v/ |1 [
7 }6 ~ Z' }- ^" l: @1 a, E! a
* [2 c9 p# ^& v: E" n, p e3 R0 n
! A7 `% S) O) }1 F* |下载IPFS节点的文件
# S( l0 |3 b' M! K/ [) e0 Y' ~7 Q8 a1 U. s
. u z* |) R7 {, ~; P9 L0 }; h5 n& v 6.2 创建文件夹存储文件- ipfs命令新建文件夹
6 ~" {* w# u) u5 U' W% n+ rwenzildeiMac: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 /文件夹名"可以删除文件夹。
, a' c" c' S, e% W
( a8 P |# \3 Z9 h) N 6.3 IPFS上传文件夹- ipfs命令添加文件夹; }3 f. X0 Q5 V- D
先在本地创建一个文件夹和对应文件,如图:
+ p; ~# C6 U- ~6 D
9 P5 _5 c$ w/ y3 e1 ]# [' l1 ?9 ]* @+ o8 S: K
' {/ S; u- d7 n* M7 S; x4 ^
) ]0 ?* [' h: D6 y
本地创建文件夹及文件- y9 ]- ?* e% D- H: p5 v
' c& K) M3 r( V) n. N3 L l然后通过"ipfs add -r 文件夹"命令添加整个文件夹
7 w1 N: r4 A. L( s/ p/ o3 J# y 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$ - 查看文件夹的文件内容
( p2 X+ B7 `! d6 \9 wwenzildeiMac: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对应文件夹
4 e, N |& R+ S# y0 Z6 E访问文件夹对应的IPFS地址:
- B5 m( k9 E u# }& E8 }https://ipfs.io/ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj
/ D9 a' F5 |5 R4 ?4 k L; R第一次访问的时候,需要同步数据到IPFS网络,等待时间有点久,慢到让你以为同步失败了。+ `% O2 ?; I' M
( T- q& V5 I6 Q! c+ D; i3 I. f
$ ~, z( g+ k0 y& g D' X
0 n, S3 j5 Z v+ x! \
查看IPFS对应文件夹
- F+ }8 B w3 M: Q0 ~$ ]1 \& ?5 ^, D# A- F9 M% k( f# g" Y
访问文件夹对应的文件,如看到图片文件,访问ipfs网关:) r- K$ r$ y& X& D
https://ipfs.io/ipfs/QmdSd3xxKcwuMugyLCiLWzaeZKDkuM39R2tzyF3kBFDoaj/portrait.jpeg
/ P& O. ]' F/ J1 i/ p2 n' c: d
+ B% m) r s7 a
2 t# H# z7 p! p( W4 P
0 _$ M! _8 r* F# e查看IPFS文件夹对应文件% R! L. A6 K$ L
( ^% N) I( u; \; ^或者通过文件的Hash来访问,如访问txt文件的地址:
- V/ L$ _ X! J: {# N7 Z+ Whttps://ipfs.io/ipfs/QmPEWgwQEHD6qxm5cUivTEZ252T123DvQ5L6HyUDgViQvT
. `' g( L, ^6 T5 ?! |: w: T* ^% y4 |$ I, A. P& r
( r1 F, P8 [+ Y3 U! {! W: B- k
* e. J* b+ _. T" z6 a9 B) P, p通过文件Hash访问查看
, V" P3 E$ E9 N+ y+ y$ T( [5 b4 ~5 A7 N- l. F
9 w" x1 x$ G6 [ ]. c2 E, O
6.4 添加简单网页到IPFS节点- 网页效果和项目结构
) _8 ]4 m) K# g7 f& ?实现一个简单的实时显示系统当前时间的网页,效果如图:3 ^ O$ z1 k- v
4 H2 k# d6 j; R) P' n) J1 v
) T6 Z. [' ]- t2 `! {1 V
8 o* u7 i8 a( ` g: }+ q/ j0 N' D0 Z0 T2 U! G
IPFS添加简单网页
3 b' r2 K# k8 [
7 A4 Q2 z3 @5 G8 r. `3 ~工程结构如图:5 x8 ~& |- L6 ? s* ]" B
1 J2 l' E% i" a A) Z: d$ h% D" [( Y5 `9 w$ d; _
% Y7 a" C6 r; h+ S- y' {/ S: i* j" f. ]4 _: b2 r/ f0 b+ B. u
网页工程结构3 m3 j1 L, K; k0 W8 C7 _
( x; D0 p# }& D+ @% K) y
; c! z' y/ S9 D0 L
实现代码比较简单,这里就不贴代码了。
" X v. }7 m* B- ipfs命令添加文件夹
' e( B: d6 X5 c" F+ S) zwenzildeiMac: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"命令在新的终端窗口打开运行。
* s0 z0 b2 t+ a- }& R2 n8 R. qwenzildeiMac:~ 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对应文件
( s6 ^: y% h+ S; ]2 f浏览器访问ipfs网关:$ l0 l8 G8 l6 u& V$ k0 L, _3 o
https://ipfs.io/ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD/
. } M* j1 K, H! w3 ^; c! i4 q( r" K B# S4 n0 O6 x, w* S- o
5 Q) u ~! u2 q
5 U' f2 I6 j" l查看IPFS对应网页
/ b) j! ^2 N6 B- k4 r* Y
1 l" T( r# H2 ~/ w5 l: g+ ~$ R2 x7 E, U; d) K
6.5 IPNS绑定节点名- IPNS绑定节点操作
: O" ?! n0 C9 `9 p7 I! {+ O) x每次修改文件内容后,文件的哈希值就会发生变化。对于网站而言,发布后可能还需要做修改,这时需要IPNS绑定节点名。每次更新网站内容后,重新publish一次更新发布到IPNS即可。
# ^; V/ K# r/ z' M/ ~) W3 x刚才的html根目录的哈希值是QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD,操作如下:! T0 {( v2 }2 T1 }9 d$ F
wenzildeiMac:study wenzil$ ipfs name publish QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDDPublished to QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz: /ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD - 查看当前节点
$ s1 r* c. W9 Z$ qwenzildeiMac: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" x. }. J; ~
- 验证节点
+ @( b. L5 @! }' z命令为:"ipfs name resolve 节点ID“1 u3 `; g/ T+ D' o! K
wenzildeiMac:study wenzil$ ipfs name resolve QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz/ipfs/QmeG6LKmEfF5s62cySE9ZnU8EifmU46CQTixipfzsZspDD - 访问IPNS对应文件
: F; z3 M+ {8 C7 P3 P. V4 o浏览器访问ipfs网关:
4 R2 U& M$ x* U8 E9 khttps://ipfs.io/ipns/QmcXWJqPjCgr1wrReWu2zUT41E5FrrXp2uyyNZRr7jXXrz/8 X- W6 l5 z5 \ A0 a
: e, d' c5 k! z9 C
! `1 k8 A* P, W
6 O; E* ~- b! l% ~4 X/ ]
' M: ]1 `% L, R- e
查看IPNS对应网页) M3 U: w" [$ L# x) @& b' F
) D9 k& \: ^/ Z7 o1 ~& D4 E7、IPFS与以太坊DApp开发实战- IPFS与以太坊DApp结合的好处4 s5 u+ m0 p4 _1 j; }
在以太坊平台上,往区块链写入数据需要花费以太币,调用智能合约执行每一行代码的时候,都需要一定量的gas交易费。区块链存储大数据成本很高,而且不合理。
3 o+ i9 ^& I2 Z" ]. ?' l, J$ c可以先将文件存储到IPFS,然后得到文件的Hash存储到以太坊区块链中。读取文件的时候,从以太坊区块链中获取文件的Hash,再通过Hash来读取IPFS网络上的文件。
w' _8 k$ }, ^+ W0 Q$ d. |使用官方提供的ipfs-api,可以很方便地在代码中操作节点将数据上传到IPFS,或者通过Hash从IPFS读取数据。
9 r# R, t6 N+ s5 {! z# pTruffle框架提供了快速搭建包含以太坊智能合约的React项目,可以通过"truffle unbox react"创建工程,然后安装ipfs-api依赖库。于是,可以在前端方便地调用IPFS的接口来读取、上传文件。
5 N4 _# Z6 ]' l$ W- Jtruffle unbox react官网:
" S# J: R# W$ C2 t0 |http://truffleframework.com/boxes/react" l, N8 ]2 `% }5 z$ p! j
- IPFS与DApp开发实战6 Y& z9 K! ~/ j- R: e0 n P
话不多说,开始进入实战开发。
4 n1 {+ }2 e3 ]1 M7.1 安装Truffle unbox react新建一个空目录"ipfs_dapp",然后执行安装命令$ M& |2 Y6 E3 W3 g5 ] E" 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",修改后完整代码:
8 N/ c- T* F6 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"1 m/ p7 ^% S( T3 b. M
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"进行智能合约的部署; p5 v) s6 L( K, H9 X
0 U9 ~: e" }+ n' `3 M: _; q# T
0 u9 u v! [ Z4 U& f4 D! X" M- O9 b1 Q
Remix-IDE部署智能合约% H+ a6 R* ?, T6 E% y' C
- j9 u( r* H7 u; e) {! @" U) _& g1 e. b7 R5 }5 m$ p
+ ?5 Q: v( V' ^. G6 c
% i5 z" I& S7 U0 J! @2 n! p: `Remix-IDE部署智能合约-确认6 `9 h9 J6 a2 }: m1 Y, ^' I
6 v2 p' o, x% O然后复制智能合约地址,App.js文件中会用到合约地址为:"0xb177d6cf6916f128c9931e610c63208d9c5a40f3"1 v* L5 V( k4 k* s7 U) c
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"命令,结果如图:
7 ?0 b& k+ Z9 P0 r/ |
( H+ R w, Y/ x* e: H: r" @, c
! ^- K. u. ^: E* V- Q
npm_start
' I. _7 ^* w! x- V! {
q$ O* t2 Y7 I$ ~$ W会自动打开网页,然后上传一张本地图片,之后点击"图片哈希写入区块链"按钮% T. S6 _7 ~5 ?' U x: C
- w. Y9 ?, j1 W" M% D; {" s# h
9 v" w/ a) _& o$ e& m% A# h
+ b; ?2 w0 J! Q运行结果15 {& i7 n: y8 K) y. [$ i. ?0 Y* T
4 I: S+ ]1 r1 c9 |最终效果如图:( o. g7 x3 z6 @+ X
( Z- @) j) r) R7 @
6 D4 |* N! n% y( E! q
& O- |; _& ?: l5 H) N" U$ u& `7 o( p' V
运行结果* d6 F$ {: t; I3 i0 @* ~; f; f
. B: V# Y$ K$ J6 a4 p0 i+ e访问IPFS网关:; `0 a' Y! Y, @! c4 U& l
https://ipfs.io/ipfs/QmbHptfJfyuGAZxstFYgAVfz33cytR1seTD3ZabBSDd899
3 Q; a5 e1 f3 M( g( I. Z发现图片已经成功写入IPFS,如图:
* ^( l% {+ `6 Z6 B! J6 E7 I+ m5 f! G& A X9 `) p
5 ?. O5 C, T# T8 x( q; R
! E1 p L6 `! g% ~0 |8 \2 ?% E" ]
+ Y5 } }( h+ @& s6 f0 c5 F$ d运行结果3$ X8 [0 l7 ]! e: ]# `7 F
! @" r4 {- W1 z' b5 L5 f% C6 h9 a% Z
备注:本地IPFS网关端口默认为8080,我的电脑上端口冲突了,系统自动修改为8082。; R) m B& J- z
搞定,收工。
t3 }1 ]" o& z2 W6 `PS:刚入坑的小白,很多不懂,还请各位大佬多赐教,谢谢!
[( c) \, h6 T: n
+ ~ M6 D4 U! j* C, r: L! [; T" g
|
|