AngularJs、大きなファイルをダウンロード

Question

私は大きなファイルを角からダウンロードする必要があります。リンクがあり、クライアントがクリックするとファイルをダウンロードする必要があります。コントローラーで コード：

$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のためだけです。私はバックエンドでノードの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のparam 'トークン' に追加します。

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

urlからトークンを取得するためのノードJsのapp.js。デフォルトではヘッダーからのみ取得します。私は 'express-jwt'モジュールを使用します。そして、トークンは次のとおりです。 'ベアラ23f334f ...トークン... dafafad' ノードJSで

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'] })); 

ハンドラ要求。 '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)); 
} 

Answer 2

これを試してみてください：

が

a.href = fileURL; 

に

window.location.href = fileURL; 

Answer 3

は、以下を参照してください、それは良い説明を与えるリンクに置き換えます。

http://blog.neilni.com/2016/04/23/download-file-in-angular-js/ 

http://jsfiddle.net/onury/5gWFL/ 

https://techdev.de/an-angularjs-directive-to-download-pdf-files/