在Mac上搭建区块链浏览器Microscope

栏目: Ruby · 发布时间: 6年前

0.引子
上一篇（见 https://ethfans.org/lawup/articles/33401 ）讲CITA链在本地跑起来了，于是，就想把Microscope区块链浏览器搭建起来，以便让它完美！（没有区块链浏览器的链，就像单身狗一样，是不完美的～虽然我早已不是单身狗，但刚刚过七夕，难免想到这句话～）。
按照官方文档的原话：Microscope类似于以太坊的etherscan，是支持多链协议的区块链数据浏览器，开发者可以使用 Microscope 浏览多条CITA链的区块链数据和交易信息。这句话，简单来说，就是可以把区块链浏览器的数据源在web前端进行任意切换。
具体怎么做，待我们把Microscope搭建起来，就明白了。
1.官方DEMO
Microscope的最新源代码地址：
https://github.com/cryptape/microscope
官方提供了一个DEMO：
http://47.96.231.19/ （旧版）
https://microscope.cryptape.com/ （新版。因为官方在快速迭代，所以我在写这篇心得的过程中，他们进行了升级。虽然新旧版本有差异，但主体功能并无太大差异，都可以，我们以下按照新版的来介绍。）
打开后，默认展现的是官方TEST-CHAIN的信息，包括【首页】【区块】【交易】【统计】【配置】等页面，以及【搜索】【语言切换】等功能，这些都在最上面的顶部导航。
如果想切换数据源，点击显示当前链名称（TEST-CHAIN）的地方，会弹出右边层，上半部分显示的是当前链的基本信息，下半部分是【其他链】，在输入框输入ip:port，然后点【Switch】按钮，即可切换到显示其他链的信息了，这就是官方文档中介绍的，“可以浏览多条CITA链的区块链数据和交易信息”。
注意的是，输入框虽然是输入ip:port，但是倘若输入 47.99.17.50:8888 是不行的，会报错的；于是我又试了 http://47.99.17.50:8888 ，也不行；必须是 https://47.99.17.50:8888 才正常。同理，microscope.cryptape.com:8888 和 http://microscope.cryptape.com:8888 都不行，必须输入 https://microscope.cryptape.com:8888 才可以。几天前的旧版的数据源（47.96.231.19:4000）没这么严格，当然，现在旧版数据源已经关闭了。我们一会儿在本地的源也不搞那么复杂的，我们按照MVP（最小化可行产品，Minimum Viable Product）的思路来学习实践。
如果你在切换数据源的时候错误，会显示INVALIDCHAIN，错误的类型也会以弹出上边层的形式提示。严重的错误会导致首页空白，无法打开。此时，我们要从二级页面进入，如 http://127.0.0.1:8080/#/graphs （ http://127.0.0.1:8080microscope的访问网址），再来切换成正确的数据源。是我们即将搭建的本地
一般把正确的数据源地址输入进去后，下面会自动加载该链的基本信息，看一眼确认信息无误，再点【Switch】按钮就好。当然，有时候【Switch】按钮可能会点不动，此时，把焦点移动到ip:port输入框，再按键盘回车就好。
2.安装Microscope
废话说太多了，开工吧！
git clone https://github.com/cryptape/Microscope/
cd Microscope
yarn install
呃，yarn是什么？都说了我是文科生了，请不要嘲笑一个求知者！
经过在网上搜索和向身边的大神们请教，可以这样做：
（1）安装nodejs及包管理工具
从官网下载
http://nodejs.cn/download/
下载后安装，会装上nodejs及npm
再用npm安装yarn：
npm install yarn -g
呃，npm好慢，没关系，换国内的taobao源，一条命令：
npm config set registry https://registry.npm.taobao.org/ -g （-g表示全局）
执行下面的命令，确认是否切换成功：
npm config get registry
切换为国内源后，npm就飞快了！
大神告诉我，其实yarn跟npm一样，都是node的包管理工具，好吧！贵圈好乱～
大神还告诉我，其实yarn跟npm一样，都可以切换为taobao源，两句话：
yarn config set registry https://registry.npm.taobao.org -g
yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g
在重新运行 yarn install 之前，记得先删掉之前的package-lock.json文件，否则会出错。
（2）安装anaconda的 python 2.7版
安装依赖：
yarn install
构建dll包：
yarn run dll
呃，出错了，一看原来是还牵扯到python（这个我懂，暗自窃喜），说是python的版本不能大于3.0，哦，就是只能用python2嘛，真落后，差评！
差评之后，发现还是绕不过，没办法，老老实实装anaconda的python2.7版本吧，从这里下载：
https://www.anaconda.com/download/
（3）继续安装
安装完anaconda的python2.7版之后，再运行yarn run dll 就没报错了，又往前推了一步。
接着，从例子创建环境配置文件：
cp ./.env.example ./.env
想打开这个.env文件，呃，怎么没看到这个文件呀？哦，原来以“.”开头的文件是默认隐藏的。如果我们在“达访”中，就得同时按shift+comman+.（注意最后是“点”），就能看到以“.”开头的文件和其它隐藏状态的文件了；如果是在命令行终端里，则是ls -la来查看所有文件。
这个 .env文件可以定义一些东西，我一开始没仔细看文档，还以为“PUBLIC=localhost:8082”是指的最终microscope跑起来的访问地址，然而并非如此，它是指icon和banner图像等静态资源存放的位置，那我们就按照官方文档的提示把网址修改一下PUBLIC= https://cdn.cryptape.com/ 。
其它都用默认的，让它跑起来：
yarn start
开始启动后，感觉到电脑明显发热了（因为我把它放在腿上操作），反馈提示：
404s will fallback to /index.html
一目十行的我，被吓了一跳，以为是404，仔细看，才发现是404秒，这个数字是谁写的？太坏了～为啥是这么诡秘的数字？
经过了漫长的404s，看到webpack: Compiled successfully. ，运行起来了，访问：
http://127.0.0.1:8080/#/
页面是显示了，但提示错误Network Error 。
我们点【INVALIDCHAIN】打开右侧层，在ip:port这里填入官方测试链的网络服务网址：
https://microscope.cryptape.com:8888
然后点【Switch】按钮，就可以看到非常酷的Microscope区块链浏览器正常运行啦！跟 https://microscope.cryptape.com 的效果是一样样的。
3.安装re-birth
然而，我们是希望在Microscope区块链浏览器中显示本地CITA链的信息。很长一段时间，我都为这个“链信息的网络服务”究竟从哪里来在各种尝试，一开始以为是1337端口，后来看官方网络服务是4000端口（曾经有一个 http://47.96.231.19:4000 ，现已迁移关闭了），再又猜测是不是 docker 里面的4337端口，各种尝试无果后，在王博大神的引荐下去了官方的开发电报群，才终于弄明白。
那么，究竟要什么呢？要re-birth，曾用名ReBirth。
（1）运行刚更新的CITA链
因为一直找不到所谓的“网络服务”是哪个，又同时发现github上的CITA代码在几个小时前有更新，怀疑是不是一个什么新的feature，所以决定将最新的CITA链跑起来。虽然事后证明并不是这个问题，但既然尝试过，记录下来也无妨。想快速进展的读者可跳过本小节。
依然还是按照官方文档来 https://docs.nervos.org/cita/#/chain/getting_started
参考我之前写的 https://ethfans.org/lawup/articles/33401
无障碍上网环境中执行：
git clone https://github.com/cryptape/cita.git
cd cita
git submodule init
git submodule update
然后汲取我们之前的教训，把docker的内存调大点儿，以便编译的时候不要那么吃力。在【Preference】-【Advanced】中调整RAM为8G、调整swap为4G，保存会重启docker。
我们先关掉之前跑的容器，以免有冲突，这个脚本：
docker kill $(docker ps -a -q)
很显然，直接运行编译脚本 ./env.sh make release ，是不行的，因为版本不匹配。
准备进env.sh看一下，果然是新版本的docker镜像：
DOCKER_IMAGE="cita/cita-build:ubuntu-18.04-20180813"
然而，从国内加速器上还找不到（当时是8月15日，现在应该有了吧～），我们去docker官网上找找，看看这个网址 https://hub.docker.com/r/cita/cita-build/builds/ 果然有20180813的版本，好吧，先暂时把国内加速器给删掉，重启docker让其生效，然后挂无障碍上网，到外网去pull ：
docker pull cita/cita-build:ubuntu-18.04-20180813
最新镜像下载完成
Digest:
sha256:48e4f030f9f47b88fbe0f8798c6f3c1873260d97cb69dc5289ad931fd1e62aab
Status: Downloaded newer image for cita/cita-build:ubuntu-18.04-20180813
现在我们开始编译
./env.sh make release
需要提醒的是，编译的过程中，不要挂无障碍上网，速度反而更快。
电脑风扇又转起来了，声音好大～
这次内存大，果然快了很多：
Finished release [optimized] target(s) in 16m 50s
编译成功后，我们把CITA链跑起来：
./env.sh tests/integrate_test/cita_start.sh
跑之前记得把1337端口映射出去，修改env.sh的内容：
docker run -d 之后加上 -p 1337:1337
然而，CITA链虽然跑起来了，用postman做测试，却POST不到。难道是端口没有映射转发出去，堵住了吗？
lsof -i tcp:1337
记下返回结果的PID编号，结束相应的PID就好：
kill -9 PID编号
然后再跑起来CITA链，对127.0.0.1:1337的POST就能成功啦！
（如果还是不行，就用万能重启大法吧！哈哈～）
（2）安装和配置postgresql数据库
在microscope的文档中，若干地方都提醒：
NOTICE: This page only works with ReBirth, the server caching appchain.
好吧，看起来安装ReBirth（现改名为re-birth了）很有必要！
参见 https://github.com/cryptape/re-birth
它是一个 A blockchain explorer cache server for Nervos Appchain.
原来，re-birth构建的是一个缓存服务器，因为让区块链浏览器直接从区块链网络中搜取数据会延时和给网络造成压力，所以需要有个缓存服务器作为中间层。
OK，那么rebirth肯定是会用到数据库的。
果不其然，官方文档一开头就是需安装postgresql，要求9.4 and above 。
这个简单，到官网去下载：
https://www.enterprisedb.com/downloads/postgres-postgresql-downloads
选择版本和操作系统（我选的最新的9.5.14版），下载dmg文件，然后安装，用默认设置，下一步，下一步，到了要输入超级用户postgres输入密码的地方，就输入两遍postgres（这样把账号密码都设置成postgres，到后面运行re-birth的时候就不用改配置了），再接着下一步，到了最后问需要安装“额外的工具”吗？我不需要，不勾选，然后点finish就好了！
（当然，你也可以用命令 brew install postgresql 来安装，只是这样装，后面还有很多初始化的配置也要用命令行，我表示有点小困难，所以没走那条路～）
（3）安装secp256k1和rails
先git下来：
git clone https://github.com/cryptape/re-birth.git
接着根据官方文档运行：
cd re-birth/tmp && git clone https://github.com/bitcoin-core/secp256k1.git && cd secp256k1 && ./autogen.sh && ./configure --enable-module-recovery --enable-experimental --enable-module-ecdh && make && sudo make install && cd ../..
这一长串，官方文档说是安装secp256k1（ https://github.com/bitcoin-core/secp256k1 ，是bitcoin-core下的一个项目，说实话我是不明觉厉，但是先不去深究，免得被带偏，先把眼前的任务打过去）。
继续按照官方文档指引初始化项目：
bundle
呃，出错了，其实我连这是啥都不清楚，搜了一下，发现与 ruby 相关，于是运行：
sudo gem install rails （加上sudo是因为一开始提醒我没权限）
再运行bundle，又被提示：
Your Ruby version is 2.3.7, but your Gemfile specified 2.5.1
好嘛，我再运行 brew install ruby@2.5.1 ，呃，不行，后来发现，应该运行 brew install ruby@2.5 ，即便是为了装2.5.1 ，但是不能那么写。
再次运行 bundle ，又提示版本低了，我晕哦～
gem install bundler （我不明白，为啥要install bundler，明明运行的命令是bundle啊，不纠结，能往前走一步，就走一步。）
发现gem的速度太慢了，崩溃呀！于是一搜，发现gem也可以换taobao源，果真是“万能的淘宝”呀！
bundle config mirror. https://rubygems.org https://gems.ruby-china.org
gem sources --add https://gems.ruby-china.org/ --remove https://rubygems.org/
参考 https://ruby.taobao.org/
之后再运行 bundle ，又遇到权限问题，好吧，好事多磨：
sudo bundle
然而，之后又遇到一个报错，幸好有提示，按照要求执行就好：
yard config --gem-install-yri
虽然，我也不明白这是啥意思～
再次sudo bundle
嗯嗯，这次真就完美啦！
（4）配置和运行re-birth
按照re-birth的文档继续：
touch .env.local （这一句不要偷懒看都不看就把文档里的内容拷贝粘贴了，因为后面一句是解释，原话是overwrite .env config if you need in .env.local , such as DB_USERNAME, DB_PASSWORD and CITA_URL... 这句话的意思是，“touch .env.local”命令是创建一个叫.env.local的文件，如果要自己定义数据的用户名、密码、CITA链的URL等信息，就写到.env文件中，待它（之后）写入.env.local文件中。
打开.env文件，可以看到这些内容：
# override items in .env.local(.env.{env}.local) if you need
# database config
DB_HOST="localhost"
DB_PORT=5432
DB_USERNAME="postgres"
DB_PASSWORD="postgres"
DB_NAME_DEV="re-birth_development"
DB_NAME_TEST="re-birth_test"
DB_NAME_PRO="re-birth_production"
# cita config
CITA_URL=" http://127.0.0.1:1337/ "
我只想说，记得我们之前安装postgreSQL的过程中要输入密码吗？那时如果我们输入的是postgres，这个配置文件就不用改了。
按照默认的继续下去：
rails db:setup
这一句也是，后面有解释，原话是“or rails db:create db:migrate db:seed”。就不改了，按照默认的配置继续，先用最短平快的路径跑通re-birth。
跑一下测试，看怎么样：
touch .env.test.local
这一句后面也有解释，原话“test env will not read .env.local file, overwrite in .env.test.lcoal ”。测试用的是.env.test.lcoal文件，但我打开它却是空文件。
我完全不懂rails，所以一脸懵逼，但还是继续运行下去：
rails spec
貌似测试没啥错误啊～
于是，我运行：
rails s
哇哦～这个re-birth跑起来啦！在终端上显示的是：
=> Booting Puma
=> Rails 5.2.0 application starting in development
=> Run rails server -h for more startup options
Puma starting in single mode...
* Version 3.11.4 (ruby 2.5.1-p57), codename: Love Song
* Min threads: 0, max threads: 16
* Environment: development
* Listening on tcp://localhost:3000
Use Ctrl-C to stop
其实，我很不明白，这个tcp://localhost:3000 是个啥，后来去电报群，才被告知，这个就是为区块链浏览器microscope准备的网络服务。
4.把整个microscope项目结合起来
那么，我们现在把整套项目结合起来吧！
（1）整套项目跑起来
先把CITA链跑起来，获得 127.0.0.1:1337 的JSON-RPC服务；
还记得之前我们跑起microscope之后，在 http://127.0.0.1:8080 的页面吗？当时是显示Network Error ，现在我们把re-birth跑起来后，在右侧层中输入 127.0.0.1:3000 ，当当当，见证奇迹的时刻！
呃，等等，为啥没数据出来呢？为啥列表还是空空呢？
哦，原来是还没有sync同步，也就是把区块链上的数据采集到数据库里来，那么，在rails s运行起来后，要另开一个命令行终端，到re-birth的主目录下运行：
rails daemons:sync:start
然后我们就在看到 http://127.0.0.1:8080 页面上有数据啦（也证明数据库里有数据了）！
艰难折腾了几乎一个星期，成果上个图：
（2）如何重新开始不出错
每次运行cita_start.sh这个脚本让CITA链跑起来的时候，都会先cleanup，然后重新从创始区块开始跑CITA链，如果别的信息都不改的话，这对于区块链浏览器的缓存数据库来说，是个灾难，因为它并没有update机制，从而导致必须新链生成区块的数量超越了老链，才有可能超过的部分区块信息被缓存数据库记录，进而在microscope浏览器上正常显示新产生的区块数据。
为了避免上述状况，一种方法，我们可以在测试之前，都先将re-birth_development数据库清空（或者干脆删除，然后用rails db:setup命令重建数据库。管理postgreSQL数据库可以用Navicat for PostgreSQL进行可视化管理，不过是收费软件，下载后试用期15天），但是，这样做有点麻烦。
另一种方法，到CITA的文件夹里将tests/integrate_test/cita_start.sh文件修改一下，把cleanup之前加个#，注释掉，这样就不清除旧链数据，而是继续生成链上区块，不会生成新链，不需要update机制，自然在数据库层面就不会有逻辑冲突了。
（3）还有很多没研究清楚的
这篇文章只是跟大家一起把最基本的开发模式的microscope跑起来了，若真正用于产品打造，还有很多有待探索的地方，比如microscope的building、re-birth的deploy和build doc（特别是我运行尝试运行re-birth的deploy时，遇到一个新命令mina，然后提示SSL相关的配置，这对我来说，又是一个未知的新领域）。
我还有太多的知识空白，需要向社区里的大神们请教，才能不断地提升自己！欢迎有兴趣的朋友加我微信 Lawup2 ，一起探讨！

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。

码农书籍

More Eric Meyer on CSS (Voices That Matter)

Eric A. Meyer / New Riders Press / 2004-04-08 / USD 45.00

Ready to commit to using more CSS on your sites? If you are a hands-on learner who has been toying with CSS and want to experiment with real-world projects that will enable you to see how CSS......一起来看看《More Eric Meyer on CSS (Voices That Matter)》这本书的介绍吧!

码农工具

MD5 加密

MD5 加密工具

SHA 加密

SHA 加密工具

HEX CMYK 转换工具

HEX CMYK 互转工具