在电子应用程序中将文件从 blob 写入磁盘

Write file to disk from blob in electron application(在电子应用程序中将文件从 blob 写入磁盘)
本文介绍了在电子应用程序中将文件从 blob 写入磁盘的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我正在创建一个 Electron 应用程序,在其中我正在从网络摄像头和桌面记录数据,在记录会话结束时,我想将数据保存到后台的文件中.我不知道如何将数据从 blob 直接写入文件.有什么建议?以下是我当前对 MediaRecord Stop 事件的处理.

I am creating an Electron Application in which I am recording data from webcam and desktop, at the end of the recording session, I want to save the data to a file in the background. I do not know how to write the data from a blob to a file directly. Any suggestions? Below is my current handling for MediaRecord Stop event.

this.mediaRecorder.onstop = (e) => {                                      
       var blob = new Blob(this.chunks,                                      
                           { 'type' : 'video/mp4; codecs=H.264' });                                                       
       var fs = require('fs');                                               
       var fr = new FileReader();                                            
       var data = null;                                                      
       fr.onload = () => {                                                   
           data = fr.result;                                                 
           fs.writeFile("test.mp4", data, err => {                           
               if(err) {                                                     
                   return console.log(err);                                  
               }                                                             
               console.log("The file was saved!");                           
           });                                                               
       };                                                                    
       fr.readAsArrayBuffer(blob);                                           
   }                          

推荐答案

您可以使用 FileReaderBuffer 来完成.

You can do it using FileReader and Buffer.

在渲染器进程中,将事件发送到主进程以将文件与缓冲区一起保存:

In the renderer process, send the event to the main process to save the file with the buffer:

function saveBlob(blob) {
    let reader = new FileReader()
    reader.onload = function() {
        if (reader.readyState == 2) {
            var buffer = new Buffer(reader.result)
            ipcRenderer.send(SAVE_FILE, fileName, buffer)
            console.log(`Saving ${JSON.stringify({ fileName, size: blob.size })}`)
        }
    }
    reader.readAsArrayBuffer(blob)
}

取回确认:

ipcRenderer.on(SAVED_FILE, (event, path) => {
    console.log("Saved file " + path)
})

(SAVE_FILE 和 SAVED_FILE 是包含事件名称的静态字符串)

(SAVE_FILE and SAVED_FILE are static strings containing event name)

在主进程中:

ipcMain.on(SAVE_FILE, (event, path, buffer) => {
    outputFile(path, buffer, err => {
        if (err) {
            event.sender.send(ERROR, err.message)
        } else {
            event.sender.send(SAVED_FILE, path)
        }
    })
})

outputFile 来自 'fs-extra'

outputFile is from 'fs-extra'

首选在主进程中处理节点操作.请参阅 Electron 安全建议.

Handling node operations in main process is preferred. See Electron Security suggestions.

如果你不想使用主进程,你可以使用 'electron-remote' 创建后台进程来写入文件.此外,您可以在后台进程中调用 ffmpeg 将文件压缩/编码为不同的格式.

If you do want to not use main process, you can use 'electron-remote' to create background processes to write the file. Additionally, you can invoke ffmpeg in the background process to compress/encode the file into different format.

这篇关于在电子应用程序中将文件从 blob 写入磁盘的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

Google apps script get range of bytes from binary file(谷歌应用程序脚本从二进制文件中获取字节范围)
Sending Multiple attachments with Google Script from Google Drive(使用 Google 脚本从 Google Drive 发送多个附件)
Distributing Google Apps Scripts for Sheets in your company network(在您的公司网络中分发适用于表格的 Google Apps 脚本)
Upload file to my google drive from anyone using javascript(使用 javascript 将文件从任何人上传到我的谷歌驱动器)
quot;Shared Drivequot; support in Google Apps Script(“共享驱动器Google Apps 脚本中的支持)
Angular 2+ HTTP POST and GDrive API. Resumable file upload with name(Angular 2+ HTTP POST 和 GDrive API.带名称的可恢复文件上传)