基于Vue开发的以太坊开源HD钱包Vuethwallet源码分析

前言

随着区块链越来越火热，数字货币钱包也随之被人重视。数字钱包的发展历程是从最初比特币的非确定性钱包，到确定性钱包，一直到我们现在最广为使用HD分层确定性钱包，而今天要分析的钱包就是现在最为流行的HD分层确定性钱包。

HD钱包的英文全称是：Hierarchical Deterministic 之所以叫分层确定性钱包是因为私钥的衍生结构是树状结构，父密钥可以衍生一系列子密钥，每个子密钥又可以衍生出一系列孙密钥，以此类推，无限衍生。在创建钱包或者备份钱包的时候都会看到一堆英文单词（或者中文汉字），这些词就是助记词。

一、钱包介绍

1.1 功能

（1）Vuethwallet => 普通钱包,随机生成助记

（2）Seed Wallet => 自定义助记词钱包Import

（3）Wallet => 导入钱包(导入Keysotre) Value

（4）Transaction => 导入钱包并进行交易

这里是一个Keystore例子：

交易使用 web3.jsAPI 进行交易

web3.js是以太坊提供的一个Javascript库，它封装了以太坊的JSON RPC API，提供了一系列与区块链交互的Javascript对象和函数，包括查看网络状态，查看本地账户、查看交易和区块、发送交易、编译/部署智能合约、调用智能合约等，该钱包交易功能比较简单，没有一些完备钱包所具有的功能比如余额查询，Gas价格查询等,但足以学习所用

二、钱包的代码架构

主要文件

本文主要对钱包创建以及交易处理部分进行详细分析，其他代码有兴趣可自行深入：

（1）index.html ==> 主页,只有一个大框架,并无实际内容,靠js进行填充

（2）/src/views/main.js ==> 入口主程序,将App.vue插入到index.html

（3）/src/views/App.vue ==> 主要组件,响应用户点击并路由到相应的页面

（4）/src/view/Wallet.vue ==> 创建普通钱包

（5）/src/view/WalletSeed.vue ==> 创建带seed钱包

（6）/src/view/ImportKeystore.vue ==> 导入钱包(Keystore)

（7）/src/view/ValueTransaction.vue ==> 交易处理

（8）/util/confirmedTransaction.js ==> 交易确认逻辑

（9）/node_modlues/zxcvb ==> 密码强度校验(分数计算)

三、代码分析

3.1 /src/view/Wallet.vue ==> 创建普通钱包(随机助记词)

3.1.3 newAddress(password,callback) ==> 页面展示 + keystore文件生成

Keystore文件生成步骤：

用户传入password,使用密钥生成函数(:kdf => “scrypt”)计算加密密钥 => encryption key

利用加密密钥对私钥进行加密(:cipher => “aes-128-ctr”)得到私钥加密后密文 => ciphertext

通过加密密钥(左第二个字节起的16个字节)和ciphertext连接在一起进行哈希散列(SHA3-256)计算得出校验值 => mac

3.2 /src/view/WalletSeed.vue ==> 创建钱包(自定义助记词)

3.4.2 发送交易到网络函数分析

3.4.3 确认交易函数分析