I am a very new for developing an application and React Native. I'm developing an electronic signature application and I want to add a new certification by import a '.pfx' file with a password. I'm using react-native-document-picker to pick the file from the device and store it in useState and a password input in the another.
My handleChooseFile code:
const handleChooseFile = async () => {
//Opening Document Picker for selection of one file
try {
const res = await DocumentPicker.pick({
type: [DocumentPicker.types.allFiles],
});
console.log('res = ', res)
//Setting the state to show single file attributes
setSelectedFile(res)
} catch (err) {
//Handling any exception (If any)
if (DocumentPicker.isCancel(err)) {
//If user canceled the document selection
alert('Canceled from single doc picker');
} else {
//For Unknown Error
alert('Unknown Error: ' + JSON.stringify(err));
throw err;
}
}
};
I saw this code for ReactJS for reading files and I've tried it.
My handleSubmit code:
const handleSubmit = (e) => {
e.preventDefault();
// Do something with the files
console.log(selectedFile);
//const reader = new FileReader();
const reader = new FileReader();
reader.onload = function (e) {
const fileContent = e.target.result;
// decrypt p12 using the password returned by getPassword(), the password should be protected and not hard coded
try {
// get p12 as ASN.1 object
const p12Asn1 = forge.asn1.fromDer(fileContent);
const p12 = forge.pkcs12.pkcs12FromAsn1(p12Asn1, pwd);
// get bags by type
const certBags = p12.getBags({ bagType: forge.pki.oids.certBag });
const pkeyBags = p12.getBags({ bagType: forge.pki.oids.pkcs8ShroudedKeyBag });
// fetching certBag
const certBag = certBags[forge.pki.oids.certBag][0];
// fetching keyBag
const keybag = pkeyBags[forge.pki.oids.pkcs8ShroudedKeyBag][0];
// generate pem from private key
//var privateKeyPem = forge.pki.privateKeyToPem(keybag.key);
// generate pem from cert
//var certificate = forge.pki.certificateToPem(certBag.cert);
if (certBag && keybag) {
console.log(certBag.cert);
console.log('Success then upload file!');
setStatus('Check password PASS then upload file...');
uploadFile();
}
} catch (error) {
console.log(error);
console.log('Fail!');
setStatus('Fail!');
};
};
reader.readAsBinaryString(selectedFile);
}
Once I run this function it will be error says: 'rader.readAsBinryString is not a function'. How can I do the FileReader in React Native.