链客,专为开发者而生,有问必答!
此文章来自区块链技术社区,未经允许拒绝转载。
当然,读者若要实践,那么电脑上必须已经搭建好了geth,并且命令“geth version”能显示版本信息;针对以太坊各个链(私链,公链,测试链)都可以用该篇文章来搭建区块链浏览器,且步骤几乎一模一样,若有疑惑,或者遇到问题,请看文末笔者给出的邮箱地址,欢迎一起探讨学习。
笔者搭建环境:ubuntu16 + npm、nodejs(安装系统自带版本)
一、下载eth区块链浏览器源码
git clone https://github.com/etherparty/explorer
二、下载bower
cd 下载explorer的目录(一般就是 cd explorer)
npm install -g bower -y
三、初始化bower
bower init
在命令行一直回车,下一步即可。
四、bower 安装
bower install --allow-root
bower install angular --save-dev --allow-root
上述两句命令笔者未遇到任何错误。
选择1,继续完成安装
到这里,bower工具就已经安装成功了。
五、启动geth节点
笔者是在私链上搭建,所以与各位读者在命令上存在一些微小的差别,命令有差异的地方,笔者会标红
geth --networkid 19303 --nodiscover --datadir “/root/eth_sync/private-chain/” --rpc --rpcapi “db,net,eth,web3,personal” --port 61916 --rpcport 8545 --rpccorsdomain ‘’ console
geth --networkid 19303 --nodiscover --datadir “/root/eth_sync/private-chain/” --rpc --rpcapi “db,net,eth,web3,personal” --port 61916 --rpcport 8545 --rpccorsdomain '’ console
这里读者能正常启动geth节点就行,不需要其他任何操作。
六、启动npm
npm start
启动的开始会有很多的 WARN 和 ERR,这个不用管,让他自己跑
过不了一会儿就会恢复正常,
目前为止,基本上就已经搭建完成了,在浏览器输入“localhost:8000”即可访问你搭建的区块链浏览器,如下图
七、区块数据不显示的处理方式
笔者可能会感到迷惑,为什么不显示区块数据呢,难道是节点没连接上?并不是,事实是该源码需要的js库文件是访问的ajax.googleapis.com,如果你没有和(fan)谐(qiang)软件,就不能显示区块数据。
笔者给出以下解决方案:
在项目中查找使用“ajax.googleapis.com”的地方,利用sublime提供的搜索功能,如下图
和(fan)谐(qiang)下载这两个文件的源码
注:若没有fq资源,亦可以在网上找这两个文件的源码,应该都大同小异
把下载的文件放到 explorer-master\app 目录下
修改 script 引用的 src 路径
此刻读者只需要刷新一下浏览器页面,大功告成。
1-7步,只能在本地访问。
八、让局域网内的其它主机也能访问
修改连接以太网节点地址为远程节点地址
root@cc-virtual-machine:~# cd explorer
root@cc-virtual-machine:~/explorer# vim app/app.js
将var eth_node_url = ‘http://localhost:8545’; 修改为 var eth_node_url = ‘http://远程或本地以太坊节点ip:8545’;
修改浏览器地址为本地IP地址
root@cc-virtual-machine:~# cd explorer
root@cc-virtual-machine:~/explorer# vim ./package.json
把"start": “http-server ./app -a localhost -p 8000 -c-1”, 改为"start": “http-server ./app -a 本地ip -p 8000 -c-1”,
BTC地址:1MHAPXoydTMTXi9r5mHYp3kGFYkKGcpXf
ETH地址:0x8d345c08805c1e0d21f518bb301640e937b8c2c6
ADA地址:DdzFFzCqrhsqmBCy6zTcdy1bshH3p5LtfmssqvL8AUcPjf55q7LteaJtx7eztaayftSj3aKWS4qWqUPJVt3ZiPVmtoKHdRYrfMHDzwGn
EOS地址:0x8d345c08805c1e0d21f518bb301640e937b8c2c6