使用@walletconnect/react-native-dapp无法连接MetaMask等钱包问题求助

I’ve looked over your code and the typical pain points with WalletConnect 1.0 in React Native—here are the most likely fixes to get your wallet connection flowing:

1. Missing Deep Link Configuration #

WalletConnect depends on deep links to bridge your app and the wallet, and many wallets won’t trigger without proper deep link setup for your app.

• iOS: Add your app’s deep link scheme to Info.plist under CFBundleURLTypes:

  <key>CFBundleURLTypes</key>
  <array>
    <dict>
      <key>CFBundleURLSchemes</key>
      <array>
        <string>your-app-unique-scheme</string>
      </array>
    </dict>
  </array>
  

• Android: Add this intent filter inside your main activity in AndroidManifest.xml:

  <intent-filter>
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="your-app-unique-scheme" />
  </intent-filter>
  

• Pass this scheme to your WalletConnect provider (critical for wallet recognition):

  <WalletConnectProvider
    options={{
      bridge: "https://bridge.walletconnect.org",
      clientMeta: {
        name: "Your App Name",
        description: "Your App Description",
        url: "https://yourapp.com",
        icons: ["https://yourapp.com/icon.png"],
        scheme: "your-app-unique-scheme" // Don't skip this!
      }
    }}
  >
    <WalletConnectExperience />
  </WalletConnectProvider>
  

2. WalletConnect 1.0 Deprecation #

A big heads-up: WalletConnect 1.0 is officially deprecated, and many major wallets (including MetaMask) have scaled back or removed support for it. This could be the core reason wallets aren’t being invoked. If possible, migrate to WalletConnect 2.0—it’s actively maintained and fully supported by all modern wallets.

If you stick with 1.0, verify your target wallet still supports it (some older versions of MetaMask mobile might let you enable 1.0 manually in settings, but this isn’t guaranteed in newer builds).

3. Unhandled Connection URI #

Your connectWallet function calls connector.connect() but doesn’t handle the URI it returns. WalletConnect 1.0 requires you to open this URI to trigger the wallet app. Update your function to use React Native’s Linking API:

import { Linking } from 'react-native';

// ...

const connectWallet = React.useCallback(async () => {
  try {
    const connectionUri = await connector.connect();
    // Open the URI to launch the wallet
    await Linking.openURL(connectionUri);
  } catch (error) {
    console.error("Connection failed:", error);
  }
}, [connector]);

4. Missing WalletConnect Provider Wrap #

Double-check that your WalletConnectExperience component is wrapped inside the WalletConnectProvider from @walletconnect/react-native-dapp. Without this provider, the useWalletConnect hook won’t initialize correctly, leading to silent failures.

Your app root should look like this:

import { WalletConnectProvider } from "@walletconnect/react-native-dapp";

export default function App() {
  return (
    <WalletConnectProvider
      options={{
        bridge: "https://bridge.walletconnect.org",
        clientMeta: {
          name: "Your App",
          description: "React Native Dapp",
          url: "https://your-app-url.com",
          icons: ["https://your-app-icon.com/icon.png"],
          scheme: "your-app-unique-scheme"
        }
      }}
    >
      <WalletConnectExperience />
    </WalletConnectProvider>
  );
}

5. Test on a Physical Device #

Simulators/emulators often have issues with deep links and wallet app integration. Test your app on a real iOS or Android device—this is a common oversight that can cause connection failures.

Start with the deep link setup and URI handling fixes first, as those are the most frequent culprits. If you still run into issues, migrating to WalletConnect 2.0 will eliminate most compatibility headaches.

内容的提问来源于stack exchange，提问作者Gia Hạo