49
使用React Native创建以太坊钱包,实现转账等功能
source link: https://www.tuicool.com/articles/jqiIZzz
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
之前想用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
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK