web-dev-qa-db-fra.com

React Native: Comment puis-je détecter si mon code s'exécute dans le simulateur?

Dans une application iOS Obj-C, je peux utiliser #if (TARGET_IPHONE_SIMULATOR) pour écrire du code uniquement sur simulateur.

Dans React Native, je peux utiliser:

if (__DEV__) {
 .. do something special
}

.. pour détecter le mode de développement.

On peut utiliser Platform.OS === 'ios' pour détecter la plateforme (Android/iOS). Voir ici pour plus d'informations Platform Docs

Mais comment détecter si l'application fonctionne dans le simulateur?

La raison pour laquelle je pose la question est que mon application utilise la caméra pour scanner les codes-barres, ce qui n'est pas pris en charge dans le simulateur iOS.

androidiosreact-native
32
Ben Clayton

Vous pouvez le faire assez facilement avec react-native-device-info , comme ceci:

import DeviceInfo from 'react-native-device-info'

isSimulator() {
  return DeviceInfo.isEmulator();
},
56
Lane Rettig

La solution la plus simple à laquelle je peux penser, qui ne nécessite pas la création d'un module natif (ou la modification d'un module existant), serait de passer ce paramètre en tant que propriété de composant React.

Dans votre AppDelegate où le RCTRootView est initialisé, vous vérifiez s'il s'agit du simulateur comme vous le feriez dans une application iOS classique; vous passez ensuite ces informations à la vue racine de React en tant que initialProperties:

  BOOL isSimulator = NO;
#if TARGET_IPHONE_SIMULATOR
  isSimulator = YES;
#endif

  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"ReactDemo"
                                               initialProperties:@{@"isSimulator": @(isSimulator)}
                                                   launchOptions:launchOptions];

Maintenant, vous pouvez y accéder dans le JavaScript via les accessoires de votre composant React:

this.props.isSimulator

Sur Android, en vous MainActivity qui étend ReactActivity vous pouvez utiliser une approche similaire:

public boolean isEmulator() {
        return Build.FINGERPRINT.startsWith("generic")
                || Build.FINGERPRINT.startsWith("unknown")
                || Build.MODEL.contains("google_sdk")
                || Build.MODEL.contains("Emulator")
                || Build.MODEL.contains("Android SDK built for x86")
                || Build.MANUFACTURER.contains("Genymotion")
                || (Build.BRAND.startsWith("generic") && Build.DEVICE.startsWith("generic"))
                || "google_sdk".equals(Build.PRODUCT);
    }

@Override
protected Bundle getLaunchOptions() {
    Bundle opts = new Bundle();
    opts.putBoolean("isEmulator", isEmulator());
    return opts;
}
21
Artal

Si vous créez une application CRNA/Expo, vous pouvez utiliser Expo.Constants.isDevicehttps://docs.expo.io/versions/latest/sdk/constants/#constantsisdevice

import { Constants } from 'expo'
//....

console.log(Constants.isDevice) // => false if simulator
11
sguha

En utilisant react-native-device-info vous pouvez obtenir les données suivantes (exécutées sur un simulateur):

getUniqueID: DB71DCB5-6BB0-497B-BE9E-A02BCC1235B7
getInstanceID: undefined
getDeviceId: x86_64
getManufacturer: Apple
getModel: Simulator
getBrand: Apple
getSystemName: iOS
getSystemVersion: 10.1
getBundleId: org.reactjs.native.example.project
getBuildNumber: 1
getVersion: 1.0
getReadableVersion: 1.0.1
getDeviceName:MacBook Pro
getUserAgent: Mozilla/5.0 (iPhone; CPU iPhone OS 10_1 like Mac OS X) AppleWebKit/602.2.14 (KHTML, like Gecko) Mobile/14B72
getDeviceLocale: en
getDeviceCountry: US
getTimezone: America/Panama
isEmulator: true
isTablet: false
6
chachan

Actuellement, il n'y a aucun moyen de voir si vous utilisez un simulateur dans JS.

Je suggère d'ajouter la conditionnelle TARGET_IPHONE_SIMULATOR pour vérifier votre code natif (si vous avez écrit votre propre module). Ou peut-être utiliser un module tiers qui ne rend pas la caméra si dans un simulateur ... c'est-à-dire: react-native-camera: https://github.com/lwansbrough/react-native-camera/search ? utf8 =% E2% 9C% 93 & q = TARGET_IPHONE_SIMULATOR

1
Dave Sibiski