React Native通讯录应用仅真机调用Contacts.getAll时崩溃

Hey there, let's break down why your contact fetch is crashing on real devices but working fine on simulators—this is almost always related to permissions or missing native config, since simulators are way more lenient with these checks. Here's how to fix it step by step:

1. Add Required Permission Declarations #

First, you need to explicitly tell the operating system why your app needs access to contacts. This is non-negotiable for real devices.

For iOS: #

Open ios/[YourAppName]/Info.plist and add these lines inside the <dict> tag:

<key>NSContactsUsageDescription</key>
<string>We need access to your contacts to display and manage your address book</string>

Replace the string with a clear, user-friendly reason—Apple rejects apps that don’t provide a meaningful explanation here.

For Android: #

Open android/app/src/main/AndroidManifest.xml and add these permissions above the <application> tag:

<uses-permission android:name="android.permission.READ_CONTACTS" />
<!-- Add WRITE_CONTACTS only if you need to modify contacts -->
<uses-permission android:name="android.permission.WRITE_CONTACTS" />

2. Request Runtime Permissions Before Fetching Contacts #

Real devices require users to explicitly grant permissions at runtime—you can’t just rely on the plist/manifest config. Update your componentDidMount to request permissions first:

async componentDidMount() {
  console.log("Hello", Contacts);
  
  try {
    // Request contacts permission
    const permissionStatus = await Contacts.requestPermissions();
    
    if (permissionStatus === 'authorized') {
      // Only fetch contacts if permission is granted
      Contacts.getAll((err, contacts) => {
        if (err) {
          console.error('Error fetching contacts:', err);
          return;
        }
        console.log("Fetched contacts:", contacts);
      });
    } else {
      console.log('Contacts permission denied—can\'t fetch contacts');
    }
  } catch (permErr) {
    console.error('Permission request failed:', permErr);
  }
}

3. Add Error Handling to the getAll Callback #

Your original code didn’t handle errors from getAll—if there’s a permission issue or other failure, this could trigger a crash. Always check the err parameter first, like in the code above.

4. Verify Native Module Linking #

Even with auto-linking (React Native 0.60+), modules sometimes fail to link properly. Try these quick fixes:

• For iOS: Run cd ios && pod install to ensure the contacts pod is installed correctly.
• For Android: Clean your build with cd android && ./gradlew clean, then rebuild the app.

Quick Test #

After making these changes:

1. Uninstall the app from your real device completely.
2. Rebuild and reinstall it.
3. When the app launches, you’ll see a permission prompt—grant it, and your contacts should load without crashing.

内容的提问来源于stack exchange，提问作者varad