构建 EOS 区块链浏览器

in #eos • 6 years ago (edited)

文/温国兵

这是「区块链技术指北」的第 35 篇文章。

如果对我感兴趣，想和我交流，我的微信号：Wentasy，加我时简单介绍下自己，并注明来自「区块链技术指北」。同时我会把你拉入微信群「区块链技术指北」。BTW，李笑来老师也加入了我的知识星球，文末有加入方式。

题图来自: © ChainONE / Original / chainone.xyz

0x00 背景

前面的文章讲解了如何让 nodeos 支持将链上数据实时异构到 MySQL 以及如何部署开源的区块链浏览器 API，但问题来了，没有前端展示，对于用户而言不够直观。

0x01 部署

EOS 链上数据有了，API 也有了，剩下的就是前端了。EOSTracker 是较早开源的区块链浏览器，后端使用 PHP，前端使用 AngularJS，接下来我们讲解如何部署前端。

首先我们需要安装 nodejs，命令如下：

$ apt-get install curl python-software-properties
$ curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
$ apt-get install nodejs
$ node -v
$ npm -v

接着 clone 代码，安装相关依赖。

$ git clone https://github.com/EOSEssentials/EOSTracker.git
$ cd EOSTracker
$ npm install
$ npm install -g @angular/cli

0x02 测试

接着我们执行如下命令访问 EOSTracker。

$ ng serve --host 0.0.0.0

此步可能会遇到如下错误：

ERROR in ./node_modules/cipher-base/index.js
Module not found: Error: Can't resolve 'stream' in '/data/EOSTracker/node_modules/cipher-base'
ERROR in ./node_modules/hash-base/index.js
Module not found: Error: Can't resolve 'stream' in '/data/EOSTracker/node_modules/hash-base'
ℹ ｢wdm｣: Failed to compile.

我们可以执行如下命令解决上述问题，详情参考 此处。

node patch.js

再次执行 ng serve --host 0.0.0.0，浏览器访问 http://xxx.xxx.xxx.xxx:4200 即可访问浏览器。

问题来了，我们没有配置 API，这个数据是怎么读取的呢？原来默认读取的是 EOSTracker 提供的 API。假如我们要修改成自己的 API，怎么处理？很简单，两行代码解决。

$ vim src/environments/environment.ts
$ vim src/environments/environment.prod.ts

将 apiUrl: 'https://api.eostracker.io' 修改成自己的 API 即可。

当然，我们同样可以给区块链添加域名以及配置 HTTPS，参考如下：

0x03 小结

连续更新 3 篇文章，可以让读者从 0 到 1 构建区块链浏览器。区块链的强大魅力之处在于所有数据公开透明，任何人都可以同步全节点数据，任何人都可以追溯链上数据。希望能给读者带来帮助。

「区块链技术指北」同名 知识星球，二维码如下，欢迎加入。BTW，李笑来老师也加入了。

区块链技术指北

「区块链技术指北」相关资讯渠道：

同时，本系列文章会在以下渠道同步更新，欢迎关注：

原创不易，读者可以通过如下途径打赏，虚拟货币、美元、法币均支持。

  • BTC: 3QboL2k5HfKjKDrEYtQAKubWCjx9CX7i8f
  • ERC20 Token: 0x8907B2ed72A1E2D283c04613536Fac4270C9F0b3
  • PayPal: https://www.paypal.me/robinwen
  • 微信打赏二维码

Wechat

–EOF–

版权声明：自由转载-非商用-非衍生-保持署名（创意共享4.0许可证）

#blockchain #browser
6 years ago in #eos by
$0.04
  • Past Payouts $0.04
  • - Author $0.03
  • - Curators $0.01
2 votes
Reply 2
Sort:  
  • Trending
    • [-]
     6 years ago  

    你有好多平台！

    $0.00
      Reply
      [-]
       6 years ago  

      Hi there! I just upvoted you, I am a semibot that sometimes vote on great content or sometimes just Create useful content. I am helping @cheetah , @FollowForUpvotes , @minnowSupport , @steemgigs , @dropahead #bots and other users right now for making the steem more helpful to new users. Contact me if you want me to follow on your content or comments. If you have any query then please contact me. You can always send me SP or SBD so i can keep helping you indirectly by helping these awesome bots.


      Do not forget to Follow @jeevanot, I actually create content as HUMAN. />

      $0.00
        Reply