app opens
change password, input data, press encrypt, data is encrypted
press decrypt, decrypted data is same as before
change password, try encrypt and decrypt,
encrypted data changes, but decrpted data stays same
//cmdnpm install cordova-plugin-aes256-encryption
npm install @ionic-native/aes-256
ionic cap sync
-------------------------------------
//tab1.tsx
import React, { useState, useEffect } from 'react';
import {
IonContent, IonHeader, IonPage, IonTitle, IonToolbar,
IonAlert, IonButton, IonCard, IonCardHeader,
IonCardSubtitle, IonCardTitle, IonCardContent,
IonItem, IonIcon, IonLabel, IonBadge, IonList,
IonItemDivider, IonCheckbox, IonChip, IonAvatar,
IonGrid, IonRow, IonCol, IonInput, IonToggle,
IonModal, IonRefresher, IonRefresherContent,
IonTextarea, IonSelect, IonListHeader,
IonSelectOption, IonButtons, IonBackButton,
IonMenuButton, IonSegment, IonSearchbar,
IonSegmentButton, IonFooter, IonText, IonToast,
useIonViewDidEnter, useIonViewDidLeave,
useIonViewWillEnter, useIonViewWillLeave
} from '@ionic/react';
import './Tab1.css';
import {
person
} from 'ionicons/icons';
import { Plugins } from '@capacitor/core';
import { AES256 } from '@ionic-native/aes-256';
const Tab1: React.FC = () => {
const [password, setPassword] = useState<string>('12345')
const [secureKey, setSecureKey] = useState<string>('')
const [secureIV, setSecuryIV] = useState<string>('')
const [data, setData] = useState<string>('')
const [encryptedData, setEncrpytedData] = useState<string>('')
const [decryptedData, setDecryptedData] = useState<string>('')
useEffect(() => {
generateSecureKeyAndIV()
}, []);
const generateSecureKeyAndIV = async () => {
setSecureKey(await AES256.generateSecureKey(password))
setSecuryIV(await AES256.generateSecureIV(password))
}
const encrypt = async () => {
AES256.encrypt(secureKey, secureIV, data)
.then(res => {
setEncrpytedData(res);
})
.catch(error => alert(error))
}
const decrypt = () => {
AES256.decrypt(secureKey, secureIV, encryptedData)
.then(res => setDecryptedData(res))
.catch(error => alert(error))
}
return (
<IonPage>
<IonHeader>
<IonToolbar>
<IonTitle>AES256 Examples</IonTitle>
</IonToolbar>
</IonHeader>
<IonContent>
<IonList>
<IonItem>
<IonLabel>Password:</IonLabel>
<IonInput placeholder={password}
onIonChange={e => setPassword(e.detail.value!)}
onIonBlur={e => generateSecureKeyAndIV()}></IonInput>
</IonItem>
<IonItem>
<IonLabel>Data:</IonLabel>
<IonInput placeholder={data}
onIonChange={e => setData(e.detail.value!)}></IonInput>
</IonItem>
<IonItem>
<IonButton expand='block' onClick={() => encrypt()}>Encrypt</IonButton>
</IonItem>
<IonItem >
<IonLabel position='stacked'>Encrypted Data:</IonLabel>
<IonTextarea>
{encryptedData}
</IonTextarea>
</IonItem>
<IonItem>
<IonButton expand='block' onClick={() => decrypt()}>Decrypt</IonButton>
</IonItem>
<IonItem>
<IonLabel position='stacked'>Decrypted Data:</IonLabel>
<IonTextarea>
{decryptedData}
</IonTextarea>
</IonItem>
</IonList>
</IonContent>
</IonPage>
);
};
export default Tab1;
reference:
AES256
The design and strength of all key lengths of the AES algorithm (i.e., 128, 192 and 256) are sufficient to protect classified information up to the SECRET level. TOP SECRET information will require use of either the 192 or 256 key lengths. The implementation of AES in products intended to protect national security systems and/or information must be reviewed and certified by NSA prior to their acquisition and use.[12]
No comments:
Post a Comment