Downloading files looks very trivial and there are many working solutions. Working until the server says 401 UNAUTHORIZED. My requirements are rather natural:

• In no case the current window may be replaced.
• I don't want to open a new window, as it makes no sense.
• In case of an error, some message must be shown to the user.

I tried to use an iframe as a target of the link and hoped to be notified in case of an error. I see I was naive.

• I could imagine to place some script in the iframe which would notify main page onunload. It look a bit plicated so I'm asking first instead.
• I could ask the server about the oute. This would surely work, somehow. But it's plicated too, as there's timing problem and the session is expired, so I'd have to circumvent this.

Downloading files looks very trivial and there are many working solutions. Working until the server says 401 UNAUTHORIZED. My requirements are rather natural:

• In no case the current window may be replaced.
• I don't want to open a new window, as it makes no sense.
• In case of an error, some message must be shown to the user.

I tried to use an iframe as a target of the link and hoped to be notified in case of an error. I see I was naive.

• I could imagine to place some script in the iframe which would notify main page onunload. It look a bit plicated so I'm asking first instead.
• I could ask the server about the oute. This would surely work, somehow. But it's plicated too, as there's timing problem and the session is expired, so I'd have to circumvent this.

• javascript
• angularjs
• iframe
• download

• Have you tried Blob URLs for downloading files? – Onur Yıldırım Commented May 28, 2014 at 1:32
• @OnurYıldırım No, never heard about them. From what I've just read, I'm rather sceptical. Could you elaborate? – maaartinus Commented May 28, 2014 at 1:37
• Sure. Please see my answer below. – Onur Yıldırım Commented May 28, 2014 at 2:25

2 Answers 2

You can use a Blob object to trigger file download from javascript. This is introduced with the File API and still in Working Draft state. So you'll have limited browser-support. As of 2015, you have wide browser support for Blob URLs and Blob Constructor.

<div ng-controller="appController" ng-app="app">
    <a ng-href="{{ fileUrl }}" download="file.txt">download</a>
</div>

var app = angular.module('app', []);

// Angular prepends "unsafe" tag in ng-href to prevent XSS
// so we need to sanitize this
app.config(['$pileProvider', function ($pileProvider) {
    // for Angular 1.0.x and 1.1.x, you should use urlSanitizationWhitelist
    $pileProvider.aHrefSanitizationWhitelist(/^\s*(https?|blob|ftp):/);
}]);

app.controller('appController', function ($scope, $window) {
    // Creating a Blob with our data for download
    // this will parse the URL in ng-href such as: blob:http...
    var data = 'some data here...',
        blob = new Blob([data], { type: 'text/plain' }),
        url = $window.URL || $window.webkitURL;
    $scope.fileUrl = url.createObjectURL(blob);
});

See a demo fiddle here.

There are some libraries to extend browser support for this such as Blob.js

You should also check out FileSaver.js which also falls back to data:URI.

You could handle HTTP errors without it interrupting your controller / service logic by making use of HTTP interceptors. When an error happens, handle it in an interceptor and then broadcast the error to an error handler, which could display an error to the user.

$httpProvider.interceptors.push(function($q, dependency1, dependency2) {
    return {
       'request': function(config) {
        // same as above
        },

        'response': function(response) {
        // same as above
     }
  };

});