Home » Android » android – Get device id in react native?

android – Get device id in react native?

Posted by: admin June 15, 2020 Leave a comment

Questions:

how to get device id in react native. I am using create react native not android studio. I am new to this.

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>
  );
}

Error: undefined is not an object (evaluating ‘RNDevice.uniqueId’)

Note:- I am not using run-android or run-ios

I am using Create-react-native app and yarn start. The output will be on device through Expo app

How to&Answers:

you cannot use library that use native code with expo see caveats if you want to use native code you need to create your project with native code at getting started doc basically

  1. install pre request apps (node – Java Development Kit – android studio – xcode – react native cli )
  2. run command react-native init MyProjectName
  3. cd your project folder cd MyProjectName
  4. run react-native run-android or react-native run-ios

if you want to convert expo project to native code project you can do ejecting-from-create-react-native-app

  1. install native code requirement as above
  2. run npm run eject

after that you can use third party libraries that use native code and run react-native link

Answer:

Instead of expo you can create a project using react-native CLI.

Create a new project using command :

react-native init Myproject

cd Myproject

Run the project using the following command :

react-native run-android

Then you can use react-native-device-info package.

I tried with following versions and it worked for me.

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

I installed it with command :

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

Then I link it with command :

react-native link react-native-device-info

If you are facing any issue while linking the package then you can do the manual link or you can cross check the packages is successfully link or not.

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

include ‘:app’

include ‘:react-native-device-info’

project(‘:react-native-device-info’).projectDir = new File(rootProject.projectDir,
‘../node_modules/react-native-device-info/android’)

  1. in 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()
      );
    }

    ......
  }

Permissions

Add the appropriate, optional permissions to your AndroidManifest.xml:

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

Example

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

var deviceId = DeviceInfo.getUniqueID();

you can use above deviceId.

Answer:

If you are using Expo try this.

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

Answer:

If your goal is to get a client unique ID, then you might want to use NativeModules.

Import { NativeModules } from 'react-native'

on your component…

for iOS: console.log(NativeModules.SettingsManager.clientUniqueId)
for Android: console.log(NativeModules.PlatformConstants.fingerprint); (or NativeModules.PlatformConstants.serial)

Answer:

getUniqueId is not reliable on Android using react-native-device-info, see the issue below:
https://github.com/rebeccahughes/react-native-device-info/issues/355

There is a PR waiting to be released:
https://github.com/rebeccahughes/react-native-device-info/pull/358

After releasing this change, you can get the unique id using getUUID