I have encrypted a video file using base64 encoding format and AES-encryption. I decrypt data stream-by-stream and append/write each stream (as a .mp4 file) to achieve the final video but it takes a lot of time to achieve a final output.
Major Edit :
I have found resources html5-media-and-data-uri which helps to play data in a webview, but it doesn't play video's with 2,000,000+ base64 characters.
Function to decrypt file and initialize html code within web view with base64 data
decryptfile() {
RNFetchBlob.fs
.readStream(
RNFetchBlob.fs.dirs.DCIMDir + "/encryptfile1.dat",
"base64",
2796256, //character to be read at a time for decryption
2500 // Time taken before each stream enters for decryption
)
.then(stream => {
let data = "";
stream.open();
stream.onData(chunk => {
data += chunk;
var decipherText = simpleCrypto.decrypt(chunk.toString()); // Decryption
decryptText = decryptText + decipherText; // appending decrypted data
});
stream.onEnd(() => {
htmlCode =
`<html>
<body>
<video style="width: 50%; height: 50%; margin-top: 10%; margin-left: 22%;"
controls>
<source type="video/mp4" src="data:video/mp4;base64,` +
decryptText.toString() + // final decrypted data
`">
</video>
</body>
</html>`;
this.setState({ playvideo: !this.state.playvideo }); // state set for playing video at end of decryption
console.log("File decrypted");
});
});
}
Web View Code
<WebView
style=
source=
/>
Need help in finding ways/alternative to play video using base64 in react-native.
This is a Offline e-learning app where videos are stored in SD-CARD and data is decrypted on fly and played in a video player.
from Play video using base64 encoded string in React-Native
No comments:
Post a Comment