记electron-vue批量下载文件

写在前面：此处的需求是要在第一次进来后将资源（图片，视频，doc及pdf）下载到本地，而后的加载通过本地读取，避免因网络问题造成页面加载失败

方法网上基本都有，仅是记录一下自己踩过的坑

方法一（可用于单个文件下载）

在进程文件中调取electron本身的api下载

ipcMain.on('downloadFileToFolder', (e, arg) => {
  // 设置保存路径 
  // 三个参数 1:你要保存的目录路径；2：该目录下的文件夹名称；3：名称+后缀名
  const filePath = path.join(getStore.get("pathUrl_12309"), arg.path, `${arg.fileName}.${arg.fileType}`);

  mainWindow.webContents.downloadURL(arg.url);
  mainWindow.webContents.session.once('will-download', (event, item, webContents) => {
    item.setSavePath(filePath);
    console.log(filePath + " 文件保存路径");
    // 监听done事件 文件下载完成
    item.once('done', (event, state) => {
      console.log(state, 'state====')
      if (state === 'completed') {
        // e.sender.send('downloadTrue', "yes")
        webContents.send('sendDownLoadMsg', arg.fileName)
        // shell.openPath(filePath) //打开文件
      }
    })
  }) 

})

其他页面调取

import { ipcRenderer } from "electron";


 ipcRenderer.send("downloadFileToFolder", {
          url: item.serverUrl,
          fileName: name,
          path: "/" + item.parentModuleId,
          fileType: type
 });

期间遇到的问题： 因为是多个资源所以进行了循环下载去调取，会造成上一个文件没下载好，后一个文件又去请求调用页面则会反复弹出文件管理器，需要用户手动点击选择路径，操作十分不好。

解决方法（仅供参考）：

1. 通过时间函数，设定4-8秒的时间下载再调取下一个。
   问题：不适用于大文件

2.在done事件完成后发送消息给进程，函数读取到后再进去下载
问题：因为是数组所有进行了下标+1去调用，此方法无法同步操作，可自行进行整改

方法二（使用request库）

首先下载request库，可直接在页面中调用

npm i request

在调用的页面中引入

var request = require("request");

——————————————
const filePath = path.join( 
		store.get("pathUrl_12309"),  
	    "/" + item.parentModuleId, 
	    `${name}.${type}`
 );
 var req = request({
          method: "GET",
          url: encodeURI(item.serverUrl)  // encodeURI：链接包含中文
  });
  var out = fs.createWriteStream(filePath); //创建文件写入
  req.pipe(out);
  req.on("response", data => {
        console.log(data, "data==="); 
  });
  //接收到文件流事件
   req.on("data", chunk => {  });
   //文件接收结束
   req.on("end", () => { 
          this.loadIndex++;
          if (this.loadIndex == this.downLoadFiles.length) {
            console.log("进入停止函数");
            // 下载完毕重新进入判断函数，去获取文件夹下内容
            that.getFolderData();
          } else {
            // this.sleep(2000);
            // 重新进入此函数下载文件
            this.saveFiles(this.downLoadFiles);
          }
   });

over