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

EAST东_059c · · 1099 次点击 · · 开始浏览    
这是一个创建于 的文章,其中的信息可能已经有所发展或是发生改变。

之前想用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


有疑问加站长微信联系(非本文作者)

本文来自:简书

感谢作者:EAST东_059c

查看原文:使用React Native创建以太坊钱包,实现转账等功能

入群交流(和以上内容无关):加入Go大咖交流群,或添加微信:liuxiaoyan-s 备注:入群;或加QQ群:692541889

1099 次点击  
加入收藏 微博
暂无回复
添加一条新回复 (您需要 登录 后才能回复 没有账号 ?)
  • 请尽量让自己的回复能够对别人有帮助
  • 支持 Markdown 格式, **粗体**、~~删除线~~、`单行代码`
  • 支持 @ 本站用户;支持表情(输入 : 提示),见 Emoji cheat sheet
  • 图片支持拖拽、截图粘贴等方式上传