React Native RSA加密
2018-06-29 本文已影响4人
_凌浩雨
Jsencrypt框架
NPM Jsencrypt
1). npm安装
npm i jsencrypt
2). 导入
import 'jsencrypt';
3). 使用Git控制台创建私钥
# 创建
openssl genrsa -out rsa_1024_priv.pem 1024
# 查看私钥
cat rsa_1024_priv.pem
4). 使用Git控制台创建公钥
# 创建
openssl rsa -pubout -in rsa_1024_priv.pem -out rsa_1024_pub.pem
# 查看
cat rsa_1024_pub.pem
5). JS代码加密
let encrypt = new JSEncrypt();
encrypt.setPublicKey(PUB_KEY);
let encrypted = encrypt.encrypt('要加密的数据');
6). JS代码解密
let decrypt = new JSEncrypt();
decrypt.setPrivateKey(PRIV_KEY);
let decrypted = decrypt.decrypt('公钥加密后的数据');
7). 完整代码
import React, {PureComponent} from 'react';
import {
AppRegistry,
Button,
StyleSheet, Text, TextInput,
View
} from 'react-native';
// npm i jsencrypt
import 'jsencrypt';
// 公钥
const PUB_KEY = '-----BEGIN PUBLIC KEY-----\n' +
'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDLQZ6XzBsLRfgzAOeueNz+64M9\n' +
'ralhL0tykrDzNtCYYPo+vV9/pALPYSrriCUtHgBG36zHJApZ6BsSWYO8P3HoliUL\n' +
'tJZ1DJ97B//7aj0dHSQekXMRE0+7CUWr3ol6FR1V5lf1+Wdcy2IgSoJVHUFhEjtq\n' +
'Lg3BzmwV7Mc2oWZHgwIDAQAB\n' +
'-----END PUBLIC KEY-----\n';
// 私钥
const PRIV_KEY = '-----BEGIN RSA PRIVATE KEY-----\n' +
'MIICXgIBAAKBgQDLQZ6XzBsLRfgzAOeueNz+64M9ralhL0tykrDzNtCYYPo+vV9/\n' +
'pALPYSrriCUtHgBG36zHJApZ6BsSWYO8P3HoliULtJZ1DJ97B//7aj0dHSQekXMR\n' +
'E0+7CUWr3ol6FR1V5lf1+Wdcy2IgSoJVHUFhEjtqLg3BzmwV7Mc2oWZHgwIDAQAB\n' +
'AoGBAJzwpu8Yhw02UoW3PizGYAVpfeWi8LT8mqn1wDGbcocl4jONb26UCiNsKILC\n' +
'lcn3b0lKLhN5rZBsGnMZsREqf90wWHW3kTbuF1d8tJmaJfuC2km3iXd4XAoMgsSR\n' +
'QrHbH+WuiIQzAZviHnY52qXgMwnUN8y1pNrns2Ew3oyGriWhAkEA+ZfUSSMYG7ph\n' +
'Io2UrOZdiM+4XJycG775Rz3hmWR50gbqBpiIjYAOdsgAK6zyyMyuDctTvCgeUm2Z\n' +
'dQhDYpX4swJBANB5SzsICgXKz81V1jNU7cizi7rURC3V8QgJouFzZkrrjru7WJ8Q\n' +
'6WKB6VHjtRxkgBEkkUUU5ucWHLruOr95vfECQQDYJrjdrdrPCJXeiqZbJhWSyfFr\n' +
'ouU+0iCnpdueL/mf/gTmOWrowCHGlGYxbNHFPBzwLUoTBNtdnzTquYFB+4cpAkB3\n' +
'OWb005wnw90jqTtfD+sNJOF8b3iuXfQCjMBB/yU5I431fycnkRxn4bP1ySwCmNdE\n' +
'9oy93T5QWi0EGsouRwmBAkEAogAnYaUe3vK3X7gxrk7F0FGsHZLvR8Y1g8iOZq66\n' +
'53+6QJVj6TFPOw9oS4chdgBnaZVtziJZZnHyjnobO70tUA==\n' +
'-----END RSA PRIVATE KEY-----\n';
/**
* @FileName: RSAEncryptDemo
* @Author: mazaiting
* @Date: 2018/6/29
* @Description:
*/
class RSAEncryptDemo extends PureComponent {
constructor(props) {
super(props);
this.state = {
data: '',
text: ''
}
}
render() {
return (
<View style={styles.container}>
<TextInput
onChangeText={(text) => this.setState({data: text})}
/>
<Button
title='加密'
onPress={() => this.encrypt()}
/>
<Button
title='解密'
onPress={() => this.decrypt()}
/>
<Text>{this.state.text}</Text>
</View>
)
}
/**
* 加密
*/
encrypt() {
let encrypt = new JSEncrypt();
encrypt.setPublicKey(PUB_KEY);
let encrypted = encrypt.encrypt(this.state.data);
this.setState({
text: encrypted
})
}
/**
* 解密
*/
decrypt() {
let decrypt = new JSEncrypt();
decrypt.setPrivateKey(PRIV_KEY);
let decrypted = decrypt.decrypt(this.state.text);
this.setState({
text: decrypted
})
}
}
/**
* 样式属性
*/
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#DDD'
}
});
AppRegistry.registerComponent('abcd', () => RSAEncryptDemo);
8). 效果
加解密效果.gif9). 签名
/**
* 签名
*/
sign() {
let encrypt = new JSEncrypt();
// 私钥加密
encrypt.setPrivateKey(PRIV_KEY);
let encrypted = encrypt.sign(this.state.data, this.digestMethod, "md5");
console.log(encrypted);
this.setState({
text: encrypted
})
}
/**
* 算法
*/
digestMethod(text) {
return text
}
10). 验证
/**
* 验证
*/
verify() {
let decrypt = new JSEncrypt();
// 公钥解密
decrypt.setPublicKey(PUB_KEY);
let decrypted = decrypt.verify(this.state.data, this.state.text,this.digestMethod);
console.log(decrypted);
this.setState({
text: decrypted+''
})
}
/**
* 算法
*/
digestMethod(text) {
return text
}
11). 效果
签名验证.gif注:RSA使用公钥加密,私钥解密。 私钥签名,公钥验证。服务器端存储私钥。