CODEWITHSUNDEEP
javascriptangularjspdf
Achchuthan Yogarajah
Achchuthan Yogarajah

Reputation: 188

AngularJS: $http.get method to download the pdf file

Can you help on this?

This is the API implementation to response the stream out as application/pdf 

public Stream GetConsumerInformationReport(Guid id)
 {
   ..........
   var stream = cryRpt.ExportToStream(ExportFormatType.PortableDocFormat);
   return stream;
}

SPA implementation of get the data from API

var print = function () {
            var downloadPath = apiEndPoint + 'Reports/' + $state.current.data.printPrefix + '.pdf';
            $http.get(downloadPath,httpConfig).
                success(function (data) {
                    var blob = new Blob([data], { type: "application/pdf" });
                    var objectUrl = URL.createObjectURL(blob);
                    $window.open(objectUrl);
            }).
            error(function (data, status, headers, config) {
            // if there's an error you should see it here
            });

        };

Upvotes: 2

Views: 6141

Answers (1)

David Votrubec
David Votrubec

Reputation: 4156

Use FileSaver.js from here http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js

Then define your download method like this. Take it only as an inspiration, do not copy-paste-run :) The original version can be found here - http://davidjs.com/2015/07/download-files-via-post-request-in-angularjs/

    //Define method download() in your ng controller

    $scope.download = () => {
          //Indicates that download is in progress
          $scope.isDownloading = true;

          return $http.get(downloadPath,httpConfig).$promise.then((data: any) => {
                  //using saveAs.js (part of upcoming HTML5 API, but so far a polyfill)
                  var blob = data.response.blob;

                  var fileName: string = data.response.fileName || 'document.pdf';

                  //SaveAs is available at saveAs.js from http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js
                  (<any>$window).saveAs(blob, fileName);
              })
              .finally(() => {
                 $scope.isDownloading = false;
          });
      }

Upvotes: 1

Related Questions