ReactNative获取手机唯一识别码

      最近在项目中遇到一个需求:app需要获取用户手机的唯一识别码然后上传到后台。在此我使用了 react-native-device-info 插件,从名字可以看出这个插件的作用是获取设备的信息。

官方地址请看:react-native-device-info - npm

使用

react-native-device-info 安装简单,cd到项目根目录下

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

当然注意一点如果你的ReactNative版本大于0.47,那么你安装的时候react-native-device-info版本必须0.11.0以及以上版本。

接下来是链接 可以直接使用下面命令

react-native link react-native-device-info

       但是我使用这种方式链接之后,不管在Android还是在Ios上,编译都会出错,所以我采用手动配置。

配置

     Android

使用AndroidStudio打开项目。在android/app/build.gradle文件中 dependencies 中添加compile project(':react-native-device-info')

ReactNative获取手机唯一识别码_第1张图片

在android/settings.gradle中添加

include ':react-native-device-info'

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

在MainApplication.java中,导入

import com.learnium.RNDeviceInfo.RNDeviceInfo;

然后加上 代码 :new RNDeviceInfo()

ReactNative获取手机唯一识别码_第2张图片

到此为止,环境配置完成,编译即可通过,在打包的时候可能会碰到如下错误:


ReactNative获取手机唯一识别码_第3张图片

此时只需要刷新下项目或者关闭AndroidStudio,然后重新打开即可。

IOS

1.首先要在xcode中进行初始化 打开xcode,找到自己的项目,展开后右击Libraries文件夹。 选择Add Files to "projectName"... 找到当前项目目录-->node_modules/react-native-device-info文件夹,找到"RNDeviceInfo.xcodeproj"文件,然后点击Add 。

ReactNative获取手机唯一识别码_第4张图片
ReactNative获取手机唯一识别码_第5张图片

2.在xcode中加载 在Xcode中点击你的工程名字——>Build Phases——>Link Binary With Libraries——>点击 '+'号按钮,添加libRNDeviceInfo.a文件

ReactNative获取手机唯一识别码_第6张图片
ReactNative获取手机唯一识别码_第7张图片
ReactNative获取手机唯一识别码_第8张图片

3.添加环境变量                                                                                              $(SRCROOT)/../react-native/React and $(SRCROOT)/../../React                                          并且修改 recursive

ReactNative获取手机唯一识别码_第9张图片
ReactNative获取手机唯一识别码_第10张图片

到此ios下配置完成。

使用

只需要在项目中导入

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

this.DeviceID = DeviceInfo.getUniqueID();

直接使用即可。

查看API直接在官网查看即可。API

你可能感兴趣的:(ReactNative获取手机唯一识别码)