AngularJs，下载大文件

Question

我需要从 angular 下载一个大文件。我有一个 link，当客户端点击时，必须下载该文件。控制器中的代码：

$scope.download = function(id, type){
    LogService.getLogFile(id, type)  //service call endpoint of backend
                    .then(function (data) {  

                        var file = new Blob([data], {type: 'application/csv;charset=utf-8'});
                        var fileURL = $window.URL.createObjectURL(file);
                        a.href = fileURL;
                        a.download = fileName;
                        a.click();
                    })
                    .catch(function (err) {
                        //error
                    });
}

它适用于小文件 (300Mb) 但不适用于大文件 (800Mb)。我需要下载文件直到 4Gb。以及主浏览器（Chrome、Mozilla 和 Safari）。因为我在jimmywarting/StreamSaver.js中看到一个解决方案（未测试）但仅适用于 Chrome 和 Opera。

我在后端使用Node Js，代码是：

function getFile(req, res){

     res.setHeader('Content-Type', 'application/octet-stream');
     res.setHeader('Content-disposition', 'attachment');

     var filePath = '....'; //PATH 
     var readStream = fs.createReadStream(filePath);

     readStream.pipe(res);

    })
    .catch(function () {
        res.sendStatus(400);
    })

谢谢。

Answer 1

最后我解决了向 url 添加令牌并向 api 请求的问题。

html:

<a ng-click="downloadFile('attributes')" ng-if="log.path_attributes_file">download</a>

控制器，添加到 url 参数 'token'。

//Download File
        $scope.downloadFile = function downloadFile(type) {
            window.location.href = '/api/logs/' + $scope.log._id +'/' + type + '?token=' + $http.defaults.headers.common['Authorization'];
        }

app.js 在 Node Js 中，用于从 url 获取令牌。默认情况下只取自 header。我使用 'express-jwt' 模块。令牌是：'Bearer 23f334f...token...dafafad'

    app.use('/api', expressJwt({ secret: config.secret ,getToken: function fromHeaderOrQuerystring (req) {
    if (req.headers.authorization && req.headers.authorization.split(' ')[0] === 'Bearer') {
        return req.headers.authorization.split(' ')[1];
    } else if (req.query && req.query.token.split(' ')[0] === 'Bearer') {
        return req.query.token.split(' ')[1];
    }
    return null;
}}).unless({ path: ['/api/users/authenticate', '/api/users/register'] }));

Node JS 中的处理程序请求。 'nameFile'是下载的文件名，'pathFile'是文件所在的路径。

function getFile(req, res){
    res.setHeader('Content-Type', 'text/csv');
    res.setHeader('Content-disposition', 'attachment');
    res.attachment(nameFile);
    res.sendFile(path.resolve(pathFile));
}

AngularJs，下载大文件

AngularJs, download large files

download

large-files

angularjs