close window after file save in FileSaver.js

I am using the FileSaver.js file to save my canvas to image. I have to close the window after download. Is there any way to achieve this?

Here is my code what i have tried,

canvas.toBlob(function (blob) {
    saveAs(blob, "RQGantt.png");
    window.close();
});

It's works fine with small size of image. But my window closed before it's start downloading when i have a large size of image.

Is there any way to do this in client side?

Here is response they have provided for https://github.com/eligrey/FileSaver.js/issues/52 issue.

Unfortunately, JS can't tell when the file has finished saving so the user will have to close new tabs it may make for content being saved.

So, I have made a following workaround

window.onbeforeunload = function () {
    //For IE
    if (HTMLCanvasElement.prototype.msToBlob && window["ganttBlob"])
        saveAs(ganttBlob, "imageName.png");
}

canvas.toBlob(function (blob) {
    window.ganttBlob = blob;
    // For Non IE Browser
    if (!canvas.msToBlob) {
        saveAs(blob, "imageName.png");
        setTimeout(function () {
            window.close();
        }, 500);
    }
    else //For IE
        window.close();
});

So, now even the window has been closed, download prompt option will comes.

close the window after download · Issue #52 · eligrey/FileSaver.js , toBlob(function (blob) { saveAs(blob, "RQGantt.png"); window.close(); } Unfortunately, JS can't tell when the file has finished saving so the user  I have to close the window after download. Is there any way to achieve this? Here is my code what i have tried, canvas.toBlob(function (blob) { saveAs(blob, "RQGantt.png"); window.close(); }); It's works fine with small size of image.

The page in the link you provided says:

FileSaver.js implements the HTML5 W3C saveAs() FileSaver interface in browsers that do not natively support it.

The linked page, pointing to the spec for filesaver, says it supports the following significant event:

onwriteend of type Function

Handler for writeend events.

That's what you need to use. The save operation, like most significant things in javascript, is an asynchronous event.

You want to catch the end of the write operation, and then close the window:

canvas.toBlob(function (blob) {
    var filesaver = saveAs(blob, "RQGantt.png");
    filesaver.onwriteend = function() { window.close(); }
}

EDIT

Unfortunately, it looks like this isn't available. See: https://github.com/eligrey/FileSaver.js/issues/1

Perhaps you can ask the writer of the plugin to revisit the issue.

The best I can suggest is add a button that lets the user click to close. On click, you can call abort, as shown in the github page, and assume it will exit cleanly if it's already finished. Then do a window.close.

eligrey/FileSaver.js, There is no way to detect if a file was saved or not. And the task is synchronous. even if it might not look like it. It would just look like. save(file  The SaveAs function currently provided by FileSaverJS seems to save a file by clicking and closing the anchor element without bringing up the "SaveAs" window. I want to open a "SaveAs" window via FileSaverJS and save the file to the desired desktop path.

You may want to try the following version of FileSaver.js: https://github.com/graingert/FileSaver.js/commit/db6a69e6f072901c2f00a4461136e38c58e082b1

Combined with this syntax:

blob = new Blob([icsFileContents], {type: "application/octet-stream;charset=utf-8"});

var fileSaver = saveAs(blob, "calEvent.ics").onwriteend = function() {
    setTimeout(function() { window.close(); }, 250);
};

I haven't tested on large files, though I did test on a Slow 3G connection and it waited for the file to be written & downloaded before closing.

Source: https://github.com/eligrey/FileSaver.js/issues/1

FileSaver.js, FileSaver.js is the solution to saving files on the client-side, and is perfect for web Blobs may be opened instead of saved sometimes—you may have to direct your Safari users to manually press ⌘ + S to save the file after it is opened. Due to restrictions in iOS saveAs opens in a new window instead of Close. AddThis. eligrey / FileSaver.js. Can't open pdf after saveAs you're saying that I have to find something else to convert the file to a PDF and FileSaver will just save it.

Sams Teach Yourself Windows 8 Apps with JavaScript and HTML5 in 24 , if the error occurred after the stream was opened, //close the stream if After adding the filesaver.js file to our js folder, we need to reference it in default.html. invoke the File Save command in the app bar and cause the File Save Picker to  FileSaver.js implements the saveAs() FileSaver interface in browsers that do not natively support it. There is a FileSaver.js demo that demonstrates saving various media types. FileSaver.js is the solution to saving files on the client-side, and is perfect for webapps that need to generate files, or for saving sensitive information that shouldn't be sent to an external server.

Saving generated files on the client-side | Web, js which implements it. The following example illustrates how to save an XHTML document with saveAs() . var bb =  @rsmelo92 I think we used your solution before switching to FileSaver.js. If I remember correctly there was some weird issues with this as well ant that is why we started using FileSaver.js. But I might be misremembering so try testing it as much as you can. It could have been just an Ios or IE bug I am not sure.

File.js-1 Source Code, to direct your Safari users to manually press ⌘+S to save the file after it is opened​. See https://github.com/eligrey/FileSaver.js/blob/master/LICENSE.md. */. Wow, I didn’t know that! I’m going to look into adding that into FileSaver.js this instant. Also, I just experimented with it a bit and it looks like Chrome doesn’t follow the download property precisely when there isn’t a filename extension but a known media type is used (e.g. it saves foo.txt if the type is text/plain and the filename is only “foo”).

Comments
  • Maybe you should post an issue on the GitHub page. The developer seems active on there: github.com/eligrey/FileSaver.js/issues?state=open - normally this kind of thing is handled within an 'onComplete' style callback, but without going into the source-code of the plugin itself I couldn't tell you if such a callback exists or not.
  • Why not add a callback function into your "saveAs" function, so that window is only closed once the saveAs function is finished? e.g. jsfiddle.net/gH8FY