Android指纹验证

记录——目前ios指纹验证还报错不能用

Android指纹验证

下载触摸组件:$ npm install react-native-fingerprint-scanner --save;

自动配资:$ react-native link react-native-fingerprint-scanner;

额外配置:在android/app/proguard-rules.pro文件里配置⬇️


#MeiZu Fingerprint

-keep class com.fingerprints.service.** { *; }
-dontwarn com.fingerprints.service.**

#Samsung Fingerprint

-keep class com.samsung.android.sdk.** { *; }
-dontwarn com.samsung.android.sdk.**

下载propTypes库
npm install --save prop-types

引入方式
import PropTypes from 'prop-types'

以下按照此网址方法编写:https://dotnet.ctolib.com/article/wiki/49206

网址教程:ios实施&android实施引入方法为

此git库react-native-fingerprint-scanner 中的

FingerprintPopup.component.ios.js和FingerprintPopup.component.android.js文件

这两个文件放在公共js文件夹中 ,他们两个的公共样式:FingerprintPopup.component.style.js文件

Android实施中有引入文件ShakingText.component.js也在上面的git库中

Android指纹验证_第1张图片

最后是展现触发指纹弹框:

在需要指纹验证的页面引入:

import FingerprintScanner from 'react-native-fingerprint-scanner';

import FingerprintPopup from '../../common/components/shakingText/FingerprintPopup.component';

配置指纹验证弹框的显示隐藏和触发按钮:

handleFingerprintShowed = () => {

	this.setState({ popupShowed: true });

};


handleFingerprintDismissed = () => {

    this.setState({ popupShowed: false });
    
};

componentDidMount() {

  	FingerprintScanner
    	.isSensorAvailable()
    	.catch(error => this.setState({ errorMessage: error.message }));

}


rende(){
  	const { errorMessage, popupShowed } = this.state;
    return(
    
    	
    		
		
    
    	{errorMessage && (
    		
    			{errorMessage}
    		
    	)}
    
    	{popupShowed && (
	    	
		)}
   
   
    	constructor(props) {
    		super(props);
    		this.state = {
	    		errorMessage: undefined,
    			popupShowed: false
    		};
    	}
    )
}

你可能感兴趣的:(Android指纹验证)