Electron - 在打开保存对话框之前写入文件

Question

I'm using electron to develop an app. after some encryption operations are done, I need to show a dialog to the user to save the file. The filename I want to give to the file is a random hash but I have no success also with this. I'm trying with this code but the file will not be saved. How I can fix this?

const downloadPath = app.getPath('downloads')

ipcMain.on('encryptFiles', (event, data) => {
  let output = [];
  const password = data.password;
  data.files.forEach( (file) => {
    const buffer = fs.readFileSync(file.path);
    const dataURI = dauria.getBase64DataURI(buffer, file.type);
    const encrypted = CryptoJS.AES.encrypt(dataURI, password).toString();
    output.push(encrypted);
  })
  const filename = hash.createHash('md5').toString('hex');
  console.log(filename)
  const response = output.join(' :: ');
  dialog.showSaveDialog({title: 'Save encrypted file', defaultPath: downloadPath }, () => {
    fs.writeFile(`${filename}.mfs`, response, (err) => console.log(err) )  
  })
})

Answer 1

The problem you're experiencing is resulting from the asynchronous nature of Electron's UI functions: They do not take callback functions, but return promises instead. Thus, you do not have to pass in a callback function, but rather handle the promise's resolution. Note that this only applies to Electron >= version 6. If you however run an older version of Electron, your code would be correct -- but then you should really update to a newer version (Electron v6 was released well over a year ago).

Adapting your code like below can be a starting point to solve your problem. However, since you do not state how you generate the hash (where does hash.createHash come from?; did you forget to declare/import hash ?; did you forget to pass any message string?; are you using hash as an alias for NodeJS' crypto module?), it is (at this time) impossible to debug why you do not get any output from console.log (filename) (I assume you mean this by "in the code, the random filename will not be created"). Once you provide more details on this problem, I'd be happy to update this answer accordingly.

As for the default filename: As per the Electron documentation , you can pass a file path into dialog.showSaveDialog () to provide the user with a default filename.

The file type extension you're using should also actually be passed with the file extension into the save dialog. Also passing this file extension as a filter into the dialog will prevent users from selecting any other file type, which is ultimately what you're also currently doing by appending it to the filename.

Also, you could utilise CryptoJS for the filename generation: Given some arbitrary string, which could really be random bytes, you could do: filename = CryptoJS.MD5 ('some text here') + '.mfs'; However, remember to choose the input string wisely. MD5 has been broken and should thus no longer be used to store secrets -- using any known information which is crucial for the encryption of the files you're storing (such as data.password ) is inherently insecure. There are some good examples on how to create random strings in JavaScript around the internet, along with this answer here on SO.

Taking all these issues into account, one might end up with the following code:

const downloadPath = app.getPath('downloads'),
      path = require('path');

ipcMain.on('encryptFiles', (event, data) => {
  let output = [];
  const password = data.password;

  data.files.forEach((file) => {
    const buffer = fs.readFileSync(file.path);
    const dataURI = dauria.getBase64DataURI(buffer, file.type);
    const encrypted = CryptoJS.AES.encrypt(dataURI, password).toString();
    output.push(encrypted);
  })

  // not working:
  // const filename = hash.createHash('md5').toString('hex') + '.mfs';

  // alternative requiring more research on your end
  const filename = CryptoJS.MD5('replace me with some random bytes') + '.mfs';
  console.log(filename);

  const response = output.join(' :: ');
  dialog.showSaveDialog(
    {
      title: 'Save encrypted file',
      defaultPath: path.format ({ dir: downloadPath, base: filename }), // construct a proper path
      filters: [{ name: 'Encrypted File (*.mfs)', extensions: ['mfs'] }] // filter the possible files
    }
  ).then ((result) => {
    if (result.canceled) return; // discard the result altogether; user has clicked "cancel"
    else {
      var filePath = result.filePath;
      if (!filePath.endsWith('.mfs')) {
        // This is an additional safety check which should not actually trigger.
        // However, generally appending a file extension to a filename is not a
        // good idea, as they would be (possibly) doubled without this check.
        filePath += '.mfs';
      }
      fs.writeFile(filePath, response, (err) => console.log(err) )  
    }
  }).catch ((err) => {
    console.log (err);
  });
})