electron項目中實現(xiàn)視頻下載保存到本地的方式
第一種方式:用戶自定義選擇下載地址位置
渲染進(jìn)程
// 渲染進(jìn)程 // 引入 import { ipcRenderer } from "electron"; // 列表行數(shù)據(jù)下載視頻操作,diffVideoUrl 是視頻請求地址 handleDownloadClick(row) { if (!row.diffVideoUrl) { this.$message.error("暫無視頻,請稍后重試下載"); } else { //渲染線程主動發(fā)送 downloadVideo事件到主線程請求下載視頻 ipcRenderer.send("downloadVideo", row.diffVideoUrl, row.orderCode); } }
主進(jìn)程
// 主進(jìn)程 // 引入 import { ipcMain, dialog } from "electron"; import path from "path"; import fs from "fs"; import axios from "axios"; // 監(jiān)聽渲染進(jìn)程下載視頻 ipcMain.on("downloadVideo", async (event, videoUrl, fileName) => { let result = await dialog.showOpenDialog({ properties: ["openDirectory", "createDirectory", "promptToCreate"], }); if (!result.canceled) { // 用戶選擇的路徑 let directoryPath = result.filePaths[0]; // 獲取目標(biāo)文件的路徑 const destPath = path.join(directoryPath, fileName + ".mp4"); try { // 請求七牛視頻地址接口,獲取視頻 const response = await axios({ method: "get", url: videoUrl, responseType: "stream", // 以流的形式獲取響應(yīng)體,用于寫入文件 }); // 在用戶選擇的目標(biāo)文件路徑下創(chuàng)建一個可寫流 const ws = fs.createWriteStream(destPath); // 將數(shù)據(jù)流保存到文件中 response.data.pipe(ws); dialog.showMessageBox(mainWindow, { message: "已下載成功!", type: "none", }); } catch (error) { console.log(error); dialog.showMessageBox(mainWindow, { message: "下載失?。?, type: "none", }); } } });
第二種方式:系統(tǒng)內(nèi)部設(shè)置默認(rèn)下載地址位置
渲染進(jìn)程
// 渲染進(jìn)程 // 引入 import { ipcRenderer } from "electron"; // 列表行數(shù)據(jù)下載視頻操作,diffVideoUrl 是視頻請求地址 handleDownloadClick(row) { if (!row.diffVideoUrl) { this.$message.error("暫無視頻,請稍后重試下載"); } else { //渲染線程主動發(fā)送 downloadVideo事件到主線程請求下載視頻 ipcRenderer.send("downloadVideo", row.diffVideoUrl, row.orderCode); } }
主進(jìn)程
// 主進(jìn)程 // 引入 import { app, ipcMain, dialog } from "electron"; import path from "path"; import fs from "fs"; import axios from "axios"; // 監(jiān)聽渲染進(jìn)程下載視頻 ipcMain.on("downloadVideo", async (event, videoUrl, fileName) => { // 默認(rèn)下載到電腦 downloads 目錄下 let directoryPath = app.getPath("downloads"); // 獲取目標(biāo)文件的路徑 const destPath = path.join(directoryPath, fileName + ".mp4"); try { // 請求七牛視頻地址接口,獲取視頻 const response = await axios({ method: "get", url: videoUrl, responseType: "stream", // 以流的形式獲取響應(yīng)體,用于寫入文件 }); // 在用戶選擇的目標(biāo)文件路徑下創(chuàng)建一個可寫流 const ws = fs.createWriteStream(destPath); // 將數(shù)據(jù)流保存到文件中 response.data.pipe(ws); dialog.showMessageBox(mainWindow, { message: "已下載成功!", type: "none", }); } catch (error) { console.log(error); dialog.showMessageBox(mainWindow, { message: "下載失?。?, type: "none", }); } });
代碼中相關(guān)代碼點解釋:
mainWindow
是 new BrowserWindow()
創(chuàng)建應(yīng)用程序窗口,此處省略相關(guān)代碼,例子代碼如下:
// 在主進(jìn)程中. const { BrowserWindow } = require('electron') const mainWindow = new BrowserWindow({ width: 800, height: 600 })
dialog.showOpenDialog
參考官方文檔:dialog.showOpenDialog
app.getPath
參考官方文檔:app.getPath
到此這篇關(guān)于electron項目中實現(xiàn)視頻下載保存到本地的文章就介紹到這了,更多相關(guān)electron視頻下載保存到本地內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
用于CSS代碼壓縮與格式化的javascript函數(shù)代碼
呵呵,發(fā)現(xiàn)只要幾行JS代碼就可實現(xiàn)css的壓縮與格式化,非常不錯。2009-12-12JS實現(xiàn)動態(tài)生成表格并提交表格數(shù)據(jù)向后端
這篇文章主要為大家詳細(xì)介紹了JS實現(xiàn)動態(tài)生成表格并提交表格數(shù)據(jù)向后端的相關(guān)資料,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-01-01精彩的Bootstrap案例分享 重點在注釋!(選項卡、柵格布局)
這篇文章主要為大家分享了一個精彩的Bootstrap案例,涉及到了選項卡、柵格布局,關(guān)鍵重點在注釋,感興趣的小伙伴們可以參考一下2016-07-07javascript中JSON對象與JSON字符串相互轉(zhuǎn)換實例
這篇文章主要介紹了javascript中JSON對象與JSON字符串相互轉(zhuǎn)換,實例分析了json對象與字符串常用的幾種轉(zhuǎn)換技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07