AngularJs + REST API 文件下载

在angularjs中请求下载文件:
 return $resource($rootScope.externalUrl, null,
            {
                'download': {
                    method: 'GET',
                    responseType: 'arraybuffer',
                    transformResponse: function(data, headers){
                        //MESS WITH THE DATA
                        var response = {};
                        response.data = data;
                        return response;
                    },
                    url: $rootScope.externalUrl + RequestURL.download_url
                } )
-transformResponse:接收服务端响应回来的文件内容,并封装到response对象中


服务端发送请求的文件内容: 



  @RequestMapping(method = RequestMethod.GET, value = "/sample/download")
    public void handleCreditRequestDownload(HttpServletResponse response, Authentication auth) throws ForbiddenEntityException, InvalidCreditException, IOException, NotFoundException {
        
       
        byte[] cr = getBytes();
        response.setContentType("application/octet-stream");
        response.setContentLength(cr.length);
        response.setHeader("Content-Disposition","attachment; filename=\"download.csv\"");
    
        ServletOutputStream ros = response.getOutputStream();       
        ros.write(cr);
        ros.flush();
        
    }


AngularJs 文件下载函数:

fileService.factory("FileDownload", function () {
    return{
        downloadFile: function (data, mimeType, fileName) {
            var success = false;
            var blob = new Blob([data], { type: mimeType });
            try {
                if (navigator.msSaveBlob)
                    navigator.msSaveBlob(blob, fileName);
                else {
                    // Try using other saveBlob implementations, if available
                    var saveBlob = navigator.webkitSaveBlob || navigator.mozSaveBlob || navigator.saveBlob;
                    if (saveBlob === undefined) throw "Not supported";
                    saveBlob(blob, fileName);
                }
                success = true;
            } catch (ex) {
                console.log("saveBlob method failed with the following exception:");
                console.log(ex);
            }

            if (!success) {
                // Get the blob url creator
                var urlCreator = window.URL || window.webkitURL || window.mozURL || window.msURL;
                if (urlCreator) {
                    // Try to use a download link
                    var link = document.createElement('a');
                    if ('download' in link) {
                        // Try to simulate a click
                        try {
                            // Prepare a blob URL
                            var url = urlCreator.createObjectURL(blob);
                            link.setAttribute('href', url);

                            // Set the download attribute (Supported in Chrome 14+ / Firefox 20+)
                            link.setAttribute("download", fileName);

                            // Simulate clicking the download link
                            var event = document.createEvent('MouseEvents');
                            event.initMouseEvent('click', true, true, window, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
                            link.dispatchEvent(event);
                            success = true;

                        } catch (ex) {
                            console.log("Download link method with simulated click failed with the following exception:");
                            console.log(ex);
                        }
                    }

                    if (!success) {
                        // Fallback to window.location method
                        try {
                            // Prepare a blob URL
                            // Use application/octet-stream when using window.location to force download
                            var url = urlCreator.createObjectURL(blob);
                            window.location = url;
                            console.log("Download link method with window.location succeeded");
                            success = true;
                        } catch (ex) {
                            console.log("Download link method with window.location failed with the following exception:");
                            console.log(ex);
                        }
                    }
                }
            }

            if (!success) {
                // Fallback to window.open method
                console.log("No methods worked for saving the arraybuffer, using last resort window.open");
                window.open("", '_blank', '');
            }
        }
    }
})

AngularJs Controller中调用文件下载函数:

 $scope.downloadCreditRequest = function(){
            ProjectService.downloadCreditRequest()
                .then(function(data){                 
                    FileDownload.downloadFile(data.data, "application/octet-stream", "download.csv")
                },function(rejection){
                    AlertsFactory.showError($scope, rejection)
                })
        };




你可能感兴趣的:(AngularJS)