如何在电子应用程序中本地保存图像

时间:2019-04-10 08:24:02

标签: javascript mysql express vue.js electron

我正在使用vue-cli-electron-builder构建一个电子应用。

用户提交带有名称,电子邮件和图像(照片)的表单,该表单存储在本地mysql数据库中,以后将同步到云中。 只有图像名称会存储在数据库中,问题是

  • 在哪里以及如何在本地保存实际图像?
  • 如何将图像同步到云?

在开发模式下,它存储在项目中,但是生产捆绑的应用程序不能那样工作。

  

我尝试了multer.diskStorage将映像保存到“ ./server/uploads”。它可以在开发模式下工作,但在生产中则行不通。

1 个答案:

答案 0 :(得分:0)

您可以将上传的内容存储在userAppData文件夹中。您应该尝试如下操作

function uploadFile() {
    dialog.showOpenDialog({
          properties: ['openFile','multiSelections'],
          filters: [{
             name: 'Images',
             extensions: ['jpg', 'png', 'gif']
          }]
       },
       uploadF, //define callback 
    )
}
function uploadF(filePaths) {
    if (filePaths!=undefined) {
        //multiple image upload
        for (let i = 0; i < filePaths.length; i++) {
            let fileName = path.basename(filePaths[i])
            fileName = moment().unix()+'-'+fileName //rename file
            let fileUploadPath = app.getPath('userData')+ '' + fileName;
            move(filePaths[i],fileUploadPath,cb)
        }
    }
}
function cb(e) {
    console.log("error in upload file",e);
}
function move(oldPath, newPath, callback) {
    fs.rename(oldPath, newPath, function (err) {
        if (err) {
        if (err.code === 'EXDEV') {
            copy();
        } else {
            console.log("err",err);

            callback(err);
        }
        return;
        }
        callback();
    });
    function copy() {
        var readStream = fs.createReadStream(oldPath);
        var writeStream = fs.createWriteStream(newPath);
        readStream.on('error', callback);
        writeStream.on('error', callback);

        readStream.on('close', function () {
            let fileName=path.basename(newPath)
            console.log(fileName,"  file uploaded")
            //remove path from destination
            //fs.unlink(oldPath, callback);
            // do your stuff
        });
        readStream.pipe(writeStream);
    }
}