美文网首页
RN的生物识别指纹验证库:react-native-touch-

RN的生物识别指纹验证库:react-native-touch-

作者: println文 | 来源:发表于2020-09-09 13:54 被阅读0次

安装(rn项目目录)

yarn add react-native-touch-id
// npm i -S react-native-touch-id

链接库

react-native link react-native-touch-id

安卓添加权限(AndroidManifest.xml文件)

 <!-- <uses-permission android:name="android.permission.USE_FINGERPRINT" /> -->

代码TouchTest.js

import React, { Component } from 'react';
import {
    View,
    Text,
    Alert,
    StyleSheet,
    TouchableHighlight,
} from 'react-native';
import TouchID from "react-native-touch-id";

export default class TouchTest extends Component {
    constructor() {
        super()
        this.state = {
            supportTouch: ''
        };
    }

    componentDidMount() {
        // 是否支持生物识别身份验证
        TouchID.isSupported()
            .then(res => {
                this.setState({
                    supportTouch: res
                });
            })
    }

    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.miniText}>本设备是否支持指纹?<Text style={{ color: "#f00" }}>{this.state.supportTouch ? '是' : '否'}</Text></Text>
                <TouchableHighlight
                    style={styles.btn}
                    onPress={this.handleTouch}
                >
                    <Text style={styles.txt}>测试指纹</Text>
                </TouchableHighlight>
            </View>
        );
    }

    // 验证身份
    handleTouch() {
        TouchID.isSupported()
            .then(() => {
                TouchID.authenticate()
                    .then(() => {
                        Alert.alert('识别成功');
                    })
                    .catch(e => {
                        Alert.alert(e.message);
                    });
            })
            .catch(e => {
                console.log(e);
            });
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: "center",
        justifyContent: "center",
        backgroundColor: "#F5FCFF"
    },
    btn: {
        padding: 12,
        borderRadius: 50,
        backgroundColor: "#409EFF"
    },
    txt: {
        color: "#fff",
        fontWeight: "bold"
    },
    miniText: {
        color: "#999",
        marginBottom: 24
    }
});

相关文章

  • RN的生物识别指纹验证库:react-native-touch-

    RN的生物识别指纹验证库:react-native-touch-id 本文暂时只测试安卓手机 安装(rn项目目录)...

  • 更安全的验证方式:双生物特征融合认证

    更安全的验证方式:双生物特征融合认证 当苹果公司推出带有指纹识别功能的iPhone6,类似指纹识别的生物特征识别技...

  • iOS 指纹识别

    一.指纹识别 自iPhone 5S始,苹果公司推出了全新生物安全识别技术---指纹识别验证(Touch ID)。 ...

  • 指纹识别验证

    本文仅实现简单的验证跳转 引入依赖库 指纹验证的实现代码如下: 指纹识别识别的几种反馈 Demo下载地址 参考文章...

  • 指纹、VR、AR

    ------指纹------优雅实现Android指纹验证安卓指纹识别库(安卓官方 + 三星 SDK + 魅族 S...

  • iOS生物识别验证(Touch ID、Face ID)

    简介 iOS生物识别验证包括Touch ID和Face ID。苹果从iPhone5S开始,具有指纹识别技术,从iO...

  • iOS中的指纹识别开发

    自iPhone 5S始,苹果公司推出了全新生物安全识别技术---指纹识别验证(Touch ID)。使得我们可以更快...

  • Android指纹识别

    上一篇讲了通过FingerprintManager验证手机是否支持指纹识别,以及是否录入了指纹,这里进行指纹的验证...

  • 微信小程序 vs html5 :能力及限制

    最后更新时间:2017-08-25 能力 生物识别。一般是指纹识别。基础库版本1.5.0 手机号快速填写组件(需用...

  • 指纹/人脸/虹膜 生物识别技能大爆发

    就生物识别本身来说,也可以分为指纹识别、人脸识别、虹膜识别、掌/指纹静脉识别等。各种识别方式因各自特性适用于不同的...

网友评论

      本文标题:RN的生物识别指纹验证库:react-native-touch-

      本文链接:https://www.haomeiwen.com/subject/bgeeektx.html