CODEWITHSUNDEEP
javascriptdirectorydownloadelectron
Avi
Avi

Reputation: 2170

Electron - Download a file to a specific location

I need to download a file to a specific location in my Electron program.
I tried implementing this API but failed.
Then I tried implementing the official API, but couldn't realize how to actually start downloading the file.

How can I download a file to a specific location, say C:\Folder?

Upvotes: 19

Views: 48031

Answers (4)

N.Maxim
N.Maxim

Reputation: 19

Issue HTTP/HTTPS requests using Chromium's native networking library

 net.fetch(url).then(async response => {
        const fileStream = fs.createWriteStream(file.filePath);
        response.arrayBuffer().then(arrayBuffer => {
            fileStream.write(Buffer.from(arrayBuffer));
        }).finally(() => {
            fileStream.close();
        });
    });

Upvotes: 0

Avi
Avi

Reputation: 2170

I ended up using electron-dl.
To send a download request (from the renderer.js):

ipcRenderer.send("download", {
    url: "URL is here",
    properties: {directory: "Directory is here"}
});

In the main.js, your code would look something like this:

const {app, BrowserWindow, ipcMain} = require("electron");
const {download} = require("electron-dl");
let window;
app.on("ready", () => {
    window = new BrowserWindow({
        width: someWidth,
        height: someHeight
    });
    window.loadURL(`file://${__dirname}/index.html`);
    ipcMain.on("download", (event, info) => {
        download(BrowserWindow.getFocusedWindow(), info.url, info.properties)
            .then(dl => window.webContents.send("download complete", dl.getSavePath()));
    });
});

The "download complete" listener is in the renderer.js, and would look like:

const {ipcRenderer} = require("electron");
ipcRenderer.on("download complete", (event, file) => {
    console.log(file); // Full file path
});

If you want to track your download's progress:

In main.js:

ipcMain.on("download", (event, info) => {
    info.properties.onProgress = status => window.webContents.send("download progress", status);
    download(BrowserWindow.getFocusedWindow(), info.url, info.properties)
        .then(dl => window.webContents.send("download complete", dl.getSavePath()));
});

In renderer.js:

ipcRenderer.on("download progress", (event, progress) => {
    console.log(progress); // Progress in fraction, between 0 and 1
    const progressInPercentages = progress * 100; // With decimal point and a bunch of numbers
    const cleanProgressInPercentages = Math.floor(progress * 100); // Without decimal point
});

Upvotes: 47

Akshay Anurag
Akshay Anurag

Reputation: 744

To allow a user to download a file in an Electron application, you need to do the following:

  1. Get either the default session or the session of the user from the partition. See Session

  2. Once you have an instance of the session object, you can then listen for events like will-download which is emitted on Session object when the user clicks on a link to download a file and the file is going to be downloaded.

  3. The will-download event returns the item which is going to be downloaded. This item contains the necessary events (downloaded, failed, paused etc.) and necessary methods (where to save the file) etc.

Now, regarding the query on How to download a file to C:/folder ?

You have 2 choices regarding that:

  1. You can either ask the user to set the download location (Default behavior)
  2. You can set the download location for the file using item object, that you get from the event will-download. Use the method setSavePath on the item object.

If you rather want to set the default download location for all the files, then you can use, setDownloadPath on the session object. Then that will be the default path for that session.

Upvotes: 6

mbehzad
mbehzad

Reputation: 3888

as you mentioned yourself, electron-dl seems to be the popular way to do that. Mainly from the github page: npm i -S electron-dl

const {BrowserWindow} = require('electron');
const {download} = require('electron-dl');
download(BrowserWindow.getFocusedWindow(), "http://url-to-asset", {directory:"c:/Folder"})

Upvotes: 4

Related Questions