在最初学习以太坊的时候，很多人都是自己创建以太坊节点后，使用geth与之交互。这种使用命令行交互的方法虽然让很多程序员感到兴奋（黑客帝国的既视感？），但不可能指望普通用户通过命令行使用Dapp。因此，我们需要一种友好的方式（比如一个web页面）来与智能合约交互，于是问题的答案就是web3.js。
Web3.js
Web3.js是以太坊官方的Javascript API，可以帮助智能合约开发者使用HTTP或者IPC与本地的或者远程的以太坊节点交互。实际上就是一个库的集合，主要包括下面几个库：( w! f, [; K i+ z4 X9 H
web3-eth用来与以太坊区块链和智能合约交互8 X' |, S) v# ^/ s8 y
web3-shh用来控制whisper协议与p2p通信以及广播
web3-bzz用来与swarm协议交互0 `, o4 J- b# u8 ]. o$ J
web3-utils包含了一些Dapp开发有用的功能% b8 Q" I$ A t+ k) x. k' N2 T
Web3与geth通信使用的是 JSON-RPC ，这是一种轻量级的RPC（Remote Procedure Call）协议，整个通信的模型可以抽象为下图。& K6 B% o& p' H! ~8 u. j; w2 J
, {$ X4 E, b- L" g) x
搭建测试链: R# D- e6 T3 X
在开发初期，我们并没有必要使用真实的公链，为了开发效率，一般选择在本地搭建测试链。在本文我们选择的Ganache（在此之前使用的是testrpc，Ganache属于它的升级版），一个图形化测试软件（也有命令行版本），可以一键在本地搭建以太坊区块链测试环境，并且将区块链的状态通过图形界面显示出来，Ganache的运行界面如下图所示。
从图中可以看到Ganache会默认创建10个账户，监听地址是http://127.0.0.1:7545，可以实时看到Current Block、Gas Price、Gas Limit等信息。$ m% O K1 k" W& C E
创建智能合约
目前以太坊官方全力支持的智能合约开发环境是Remix IDE，我们在合约编辑页面编写如下代码：' ?9 }2 J$ h! a6 h: D5 N0 |5 a g6 n
- pragma solidity ^0.4.21;/ I* B" P6 Y' w \
- contract InfoContract { * ?, \( {. U2 v% m$ F
- string fName;. K% J( e3 Q! c9 N. {* }0 o0 i; L5 P
- uint age; ; P1 l. ]8 ~/ q, @( X! |. N
- function setInfo(string _fName, uint _age) public {
- fName = _fName;
- age = _age;' {9 X4 p! T" f* ~, A$ W) W
- }
- function getInfo() public constant returns (string, uint) {# f- p9 y, X6 L# D6 N: r1 f: g
- return (fName, age);) [9 h3 c; m7 y- p0 L5 W6 R* R
- } 6 n; J9 h1 ^8 M% [ r$ f. _6 G
- }
代码很简单，就是简单的给name和age变量赋值与读取，接下来切换到 run 的 tab 下，将Environment切换成Web3 Provider，并输入我们的测试链的地址http://127.0.0.1:7545，这里对这三个选项做一简单说明：
Javascript VM：简单的Javascript虚拟机环境，纯粹练习智能合约编写的时候可以选择% x0 Q4 _* p0 U8 R7 I7 f) Q9 Y
Injected Web3：连接到嵌入到页面的Web3，比如连接到MetaMask
Web3 Provider：连接到自定义的节点，如私有的测试网络。0 E3 d' W" w( j. m# v% d
如果连接成功，那么在下面的Account的选项会默认选择 Ganache 创建的第一个账户地址。接下来我们点击Create就会将我们的智能合约部署到我们的测试网中。接下来 Remix 的页面不要关闭，在后面编写前端代码时还要用到合约的地址以及ABI信息。
, I0 u0 w- E( g' h, H9 \0 L
安装Web3
在这之前，先在终端创建我们的项目：
> mkdir info: p9 ?( x7 b# e3 }) o0 U$ t
> cd info# b+ o3 a# s! P6 e7 Q+ p/ k
接下来使用 node.js 的包管理工具 npm 初始化项目，创建package.json 文件，其中保存了项目需要的相关依赖环境。( B/ n9 e& C' x4 z8 V0 T" g
> npm init
一路按回车直到项目创建完成。最后，运行下面命令安装web.js：" a' m) {& p! W; I+ w1 X
> npm install web3' m- C- p0 J; t
注意： 在实际安装过程中我发现web3在安装完成后并没有 /node_modules/web3/dist/we3.min.js 文件，这个问题在issue#1041中有体现，但官方好像一直没解决。不过可以在这里下载所需的文件，解压后将dist文件夹的内容拷贝到 /node_modules/web3路径下。( h* E- _8 m j% d/ C' k+ K
. C# P8 N y/ K" O
