使用React Native创建以太坊钱包，实现转账等功能

之前想用React Native开发一版以太坊钱包app，但在生成账户那块遇见了问题，没有crypto等nodejs包，react native是运行在JavaScriptCore环境里面，是没有buffer, crypto 跟 stream这些库的，所以为了解决，就跟同事开发了基于golang的web3go，然后使用gomoble工具编译成ios需要的framework以及android需要的jar aar，完美解决问题

• 演示

dapp-demo-1.png dapp-demo-2.png

• 安装web3go

git clone https://github.com/bcl-chain/web3.go.git

• 使用gomobile编译成framework，jar，aar

// generate framework
gomobile bind -target=ios ./github.com/bcl-chain/web3.go/mobile

// generate arr jar
gomobile bind -target=android ./github.com/bcl-chain/web3.go/mobile

• 把生成的包link到原生app里面

link-web3go.png
andoir-getbalence.png

• 下载ETH本地测试工具ganache-cli

gan-cli.png

• 安装依赖

yarn
react-native run-android
react-native run-ios

• getBalance代码分析

// IOS
RCT_EXPORT_METHOD(getBalance:
                  (NSString*) address:
                  (RCTPromiseResolveBlock)resolve
                  rejecter:(RCTPromiseRejectBlock)reject){
  // ip地址
  Web3goEthereumClient* client = Web3goNewEthereumClient(nodeIP, nil);
  Web3goContext* ctx = Web3goNewContext();
  // 账户地址
  Web3goAddress* address1 = Web3goNewAddressFromHex(address, nil);
  @try {
    Web3goBigInt* a = [client getBalanceAt:ctx account:address1 number:-1 error:nil];
    NSString* ammount = [a getString:10];
    NSLog(@"%@", ammount);
    resolve(ammount);
  } @catch (NSError *exception) {
    NSLog(@"NSError: %@", exception);
    reject(@"NSError: %@", @"There were no events", exception);
  } @finally {
    NSLog(@"finally");
  }
  
}

// android
@ReactMethod
public void getBalance(String address, Promise promise) {
    try {
      web3go.EthereumClient client = Web3go.newEthereumClient(nodeIP);
      web3go.Context ctx = Web3go.newContext();
      web3go.Address address1 = Web3go.newAddressFromHex(address);
      web3go.BigInt a = client.getBalanceAt(ctx, address1, -1);
      String ammout = a.getString(10);
      promise.resolve(ammout);
    } catch (Exception e) {
      promise.reject(e.getMessage());
    }
}

// react-native
async getBalance() {
    try {
      var ammount = await NativeModules.Web3go.getBalance(this.state.defGaAddress);
      this.setState({
        gaAmmount: ammount
      })
    } catch (e) {
      console.error(e);
    }
}
 

如果有用，给个start

web3go

React-Native-Dapp