React Native中Web3调用遇atob未定义及AppRegistry注册异常求助

数据老陈

2026-8-2

解决React Native中Web3查询区块链余额的两个错误

1. 修复ReferenceError: 找不到变量：atob

你添加的base64 polyfill无效，大概率是加载顺序问题——Web3模块在全局变量atob/btoa被定义前就已经加载了。按以下步骤调整：

把base64 polyfill代码移到App.js的最开头，在所有其他import语句之前：

import { decode, encode } from 'base-64';
global.btoa = encode;
global.atob = decode;

// 之后再导入React、AppRegistry等模块
import React from 'react';
import { AppRegistry, View } from 'react-native';
// ...你的其他代码

如果还是报错，安装全局polyfill包：

npm install react-native-polyfill-globals

然后在App.js最顶部导入：

import 'react-native-polyfill-globals/auto';

这个包会自动补全React Native缺失的浏览器全局API，包括atob、btoa以及Web3依赖的crypto相关接口。

2. 修复Invariant Violation: AppRegistry.runApplication()模块未注册

这个错误通常是未处理的异步异常导致JS线程崩溃，或者缓存引发的模块加载异常。按以下步骤处理：

（1）正确处理异步函数

你的getBalance是异步函数，直接在useEffect中调用会返回Promise，且未捕获异常会导致App崩溃。修改调用代码：

import { getBalance } from "@app/utils/getBalance";

useEffect(() => {
  // 用异步立即执行函数包裹，添加错误捕获
  const fetchBalance = async () => {
    try {
      const myBalance = await getBalance("0x...");
      console.log('余额:', myBalance);
    } catch (err) {
      console.error('获取余额失败:', err);
    }
  };
  fetchBalance();
}, []);