Encrypt a zip file with browserpgp javascript tool

[sharmapn]

OpenPGP.js version 5.1
Browser version

I would like to encrypt a zip file using OpenPGP.js (https://browserpgp.github.io/). All processing needs to be done on the client-side, without involvement of Node.js. Using the javascript-based browserpgp.js, encryption of plaintext file is easy, but encryption of zip files are challenging. I am attaching the code I use to encrypt the zip file. Since, the contents of zip file are not text, so I have used guides for working with binary data from https://github.com/openpgpjs/openpgpjs. I believe the resulting file after encryption of a zip file should be in raw/binary format, and the resulting file saved from the following encryption code is in binary. However, I verified it and its cannot be decrypted.
I tried many variations of the encodings offerings by OpenPGP and so did one of the members from the OpenPGP Gitter channel - where I also posted this question. But no luck and therefore I think its a bug.

I am using the Kleopatra desktop OpenPGP tool (https://www.openpgp.org/software/kleopatra/) to verify if the resulting encrypted file. Using the tool, I tested to see if I can decrypt the encrypted file using my private key. The resulting binary file cannot be decrypted using the Kleopatra tool. So I was wondering what is wrong with this code, as the resulting file should be decryptable using Kleopatra.

You can create two public keys using the tool here: https://browserpgp.github.io/

function openpgp_encryptZIPFile(){  
  var zip = new JSZip();
  zip.file("Hello.txt", "Hello World\n");
  var img = zip.folder("images");
  zip.generateAsync({type:"blob"})
  .then(function(content) {
      console.log('contents: ' + content);     
      encryptedZipFile = OpenPGPEncryptDataZipFile(content);
  });  
}

async function OpenPGPEncryptDataZipFile(zipBlob) 
{    
  //This is my public key
  const key1 = `somekey1`;  //you would have to put a public key here 
    //This is the testuser public key
  const key2 = `somekey2`; //you would have to put another public key here 
  const publicKeysArmored = [key1, key2];
  //create a combined key
  const publicKeys = await Promise.all(publicKeysArmored.map(armoredKey => openpgp.readKey({ armoredKey }))); 
    
  var binaryData = new Uint8Array(zipBlob);  
  
  //https://github.com/openpgpjs/openpgpjs/blob/main/README.md
  //For OpenPGP.js v4 syntax is:  const message = openpgp.Message.fromBinary(binaryData); 
  //For OpenPGP.js v5 syntax is:  const message2 = await openpgp.createMessage({ binary: binaryData });
  //`const {data: encrypted}' OR `const { message }' OR just `const encrypted'
  const  encrypted  = await openpgp.encrypt({
  message: await openpgp.createMessage({ binary: binaryData }),      
     encryptionKeys: publicKeys,
     //signingKeys: privateKey // optional
     format: 'binary'
  });
  console.log('encrypted: ' + encrypted);
  var encryptedBlob = new Blob([encrypted],{type: 'text/plain'});    
  //var encryptedBlob = new Blob([encrypted], {type: "octet/stream"});
  saveAs(encryptedBlob, 'test.zip.enc' ); 
}

[twiss]

new Uint8Array(zipBlob) most likely doesn't do what you think it does. Perhaps try new Uint8Array(await zipBlob.arrayBuffer()), or just ask JSZip for a Uint8Array instead of a Blob in the first place.

Also, octet/stream is not a valid MIME type. Perhaps you meant application/octet-stream?

[hema4295]

@twiss Hi, I tried to change to Uint8Array, it can generate a pgp, but when decrypt it with command line on MAC, it shows 'gpg: no valid OpenPGP data found'. Here is my code:

 const openpgp = require("openpgp");

const readable = fs.createReadStream("test.zip");
const data = await consumers.arrayBuffer(readable);
const binaryData = new Uint8Array(data);  

const encrypted = await openpgp.encrypt({
  message:  openpgp.message.fromBinary(binaryData),
  publicKeys: (await openpgp.key.readArmored(pgpPublicKeyArmored)).keys,
  format: 'binary',
});

const encryptedBlob = new Blob([encrypted],{type: 'text/plain'});   
const buffer = Buffer.from( await encryptedBlob.arrayBuffer() );

fs.writeFile("test.zip.pgp", buffer, () => console.log('encryptedBlob saved!') );

console.log("======done");

Would you help me figure out what went wrong? Thanks!

[twiss]

In OpenPGP.js v4, you want to use encrypted.data, not encrypted.
Also, this code:

const encryptedBlob = new Blob([encrypted],{type: 'text/plain'});   
const buffer = Buffer.from( await encryptedBlob.arrayBuffer() );

is entirely unneeded, and the MIME type is wrong. You can just remove it and use encrypted.data as a Uint8Array directly, or Buffer.from(encrypted.data) if you need a buffer for some reason.

Also, we recommend upgrading to OpenPGP.js v5, there you can indeed use encrypted directly, although the rest of the API is different, see https://github.com/openpgpjs/openpgpjs/wiki/V5-Changelog#high-level-api-changes.

[sharmapn]

Thank you so much twiss. Your answer works.
Changed new Uint8Array(zipBlob) to new Uint8Array(await zipBlob.arrayBuffer())

[sharmapn]

For anyone looking, here is the decryption code, which is called from the above OpenPGPEncryptDataZipFile function

await testDecryption(encrypted);  //this line of code is placed in the above function, to call the function below

async function testDecryption(encrypted) {
  const privKeyObj = (await openpgp.readKey({ armoredKey: privkey }).catch((err) => {   
    console.log(err);
  })); 

  const { data: decrypted } = await openpgp.decrypt({
    message: await openpgp.readMessage({ binaryMessage: encrypted }),
    decryptionKeys: [privKeyObj],
    //signingKeys: privateKey // optional
    format: 'binary'
  });
  var decryptedBlob = new Blob([decrypted], { type: 'text/plain' });
  saveAs(decryptedBlob, 'testdecrypted.zip');
}

[twiss]

For what it's worth, text/plain is not the correct MIME type for a .zip file, probably you want application/zip

[sharmapn]

Sure twiss, I will change that.

[sharmapn]

Hi twiss, I tried to use passphrase based approach to encrypt the key. I generated and use another set of pub-pri keys with the Privkey Passphrase. But upon decryption of the encrypted zip file using the private key, and providing the passphrase, it gives the following error.

Uncaught (in promise) DOMException: Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.

Everything is exactly the same, with the following additional code. Would be glad if I can get help me out here.

  const passphrase = document.getElementById("pass").value
  const privKeyObj = ( await openpgp.readKey( { armoredKey: privkey } ) .catch( (err) => 
  { 
    console.log(err);
  } ) );  //.keys[0]
  
  //using passphrase. Executes only of passphrase textbox is populated
  if (passphrase) {
    console.log('Decrypting passphrase');
    await privKeyObj.decrypt(passphrase).catch((err) => {
      console.log('err.message' + err.message)
    })
  } 

[twiss]

Also, it says Uncaught (in promise) DOMException, but here you're catching everything, so actually most likely the error is coming from somewhere else, I think

[sharmapn]

myPriKeyPassphrase.txt
myPubKeyPassphrase.txt

[sharmapn]

I restarted the browser, ran the application and got this error:
requestOpenPGP.js:237 Uncaught (in promise) TypeError: privKeyObj.decrypt is not a function

[sharmapn]

I have just created another pair of pub-pri keys with the same passphrase (the one I attached above).
While decryption, I get the same error using the above code.
TypeError: privKeyObj.decrypt is not a function
But I can decrypt the encrypted zip file using Kleopatra, providing the new private key and the passphrase (Kleopatra prompts for passphrase during decryption).

[twiss]

In v5, you can use openpgp.decryptKey instead

[sharmapn]

Thanks twiss, it works.
I used the openpgp.decryptkey function and modified the following option during the decryption:
from privateKeys: [privKeyObj] to decryptionKeys: privateKey

In a bit more detail:

const privateKey = await openpgp.decryptKey({
    privateKey: await openpgp.readPrivateKey({ armoredKey: privkey }), //privateKeyArmored
    passphrase
  });
  
 const { data: decrypted } = await openpgp.decrypt({
    message: await openpgp.readMessage({ binaryMessage: binaryData }),  
    decryptionKeys: privateKey, //privateKeys: [privKeyObj],  
    format: 'binary'
  }).catch(function(error){
    console.log('Error decrypting');
  });