web-dev-qa-db-ja.com

React NativeでデバイスIDを取得しますか？

react NativeでデバイスIDを取得する方法。 Android studioではなく、create react nativeを使用しています。これは初めてです。

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

constructor(props) {
 super(props);
   this.state = { id: '' }
   this.onNavigateTo = this.onNavigateTo.bind(this);   
}
componentDidMount() {
   this.setState({id: DeviceInfo.getUniqueID()}, () =>      
   alert(this.state.id));
}
render() {
  return (
       <Text>{this.state.id}</Text>
  );
}

エラー：undefinedはオブジェクトではありません（「RNDevice.uniqueId」を評価）

注：-run-Androidまたはrun-iosを使用していません

Create-react-nativeアプリとyarn startを使用しています。出力はExpoアプリを介してデバイス上にあります

androidiosreact-nativedeviceid
7
user1731387

expoでネイティブコードを使用するライブラリを使用することはできません 警告 を参照してくださいネイティブコードを使用する場合は、開始時にネイティブコードでプロジェクトを作成する必要があります doc 基本的に

  1. 事前要求アプリのインストール（ノード-Java Development Kit-Android studio-xcode-react native cli）
  2. コマンドreact-native init MyProjectNameを実行します
  3. プロジェクトフォルダーcd MyProjectNameをcdします
  4. react-native run-Androidまたはreact-native run-iosを実行します

expoプロジェクトをネイティブコードプロジェクトに変換する場合は、 ejecting-from-create-react-native-app を実行できます。

  1. 上記のネイティブコード要件をインストールします
  2. npm run ejectを実行します

その後、ネイティブコードを使用してreact-native linkを実行するサードパーティライブラリを使用できます

5
Mohamed Khalil

Expoの代わりに、react-native CLIを使用してプロジェクトを作成できます。

コマンドを使用して新しいプロジェクトを作成します。

react-native init Myproject

cd Myproject

次のコマンドを使用してプロジェクトを実行します。

react-native run-Android

その後、react-native-device-infoパッケージを使用できます。

次のバージョンで試してみましたが、うまくいきました。

  "react": "16.0.0",
  "react-native": "0.50.4",
  "react-native-device-info": "^0.12.1",

コマンドでインストールしました：

npm install --save react-native-device-info

次に、コマンドでリンクします：

react-native link react-native-device-info

パッケージのリンク中に問題が発生した場合は、手動リンクを行うか、パッケージが正常にリンクされているかどうかをクロスチェックできます。

  1. android/app/build.gradle：
 dependencies {
        ...
        compile "com.facebook.react:react-native:+"  // From node_modules
    +   compile project(':react-native-device-info')
    }
  1. android/settings.gradle：

...

「：app」を含める

「：react-native-device-info」を含める

project（ '：react-native-device-info'）。projectDir = new File（rootProject.projectDir、 '../node_modules/react-native-device-info/Android'）

  1. mainApplication.Javaで：
+ import com.learnium.RNDeviceInfo.RNDeviceInfo;

  public class MainApplication extends Application implements ReactApplication {
    //......

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
+         new RNDeviceInfo(),
          new MainReactPackage()
      );
    }

    ......
  }

許可

AndroidManifest.xmlに適切なオプションのアクセス許可を追加します。

...
<uses-permission Android:name="Android.permission.BLUETOOTH"/>         <!-- for Device Name -->
<uses-permission Android:name="Android.permission.READ_PHONE_STATE"/>  <!-- for Phone Number -->

例

var DeviceInfo = require('react-native-device-info');
// or import DeviceInfo from 'react-native-device-info';

var deviceId = DeviceInfo.getUniqueID();

上記のdeviceIdを使用できます。

11
rahul.sapkal23

Expoを使用している場合は、これを試してください。

import Constants from 'expo-constants';
this.clientId = Constants.deviceId;
0
user1047504

クライアントの一意のIDを取得することが目的の場合は、NativeModulesを使用できます。

_Import { NativeModules } from 'react-native'_

コンポーネントに...

iOSの場合：console.log(NativeModules.SettingsManager.clientUniqueId) Androidの場合：console.log(NativeModules.PlatformConstants.fingerprint);（または_NativeModules.PlatformConstants.serial_）

0
Matheus Barradas