用Angular触发CSV文件下载

这个问题之前已经有了一些要求,但是我看到的解决scheme似乎都没有工作,这可能是因为我将文件stream式传输到浏览器。 我最终想要的CSV是在一个专用的S3存储桶中,由于安全中间件,我必须通过一个NodeJS端点来获取它。 API的代码如下。

exports.download = function(req, res) { var recording = req.vsRecording, s3 = new AWS.S3(); if(recording.data_uri){ try{ res.set('Content-Type', 'application/octet-stream'); var fileStream = s3.getObject({Bucket: 'processing-dispatched', Key: recording._id + '/aggregated.csv'}).createReadStream(); fileStream.pipe(res); } catch(err){ res.status(500).json({error: err}); } } else { res.status(500).json({error: 'Recording does not have a report file.'}); } }; 

这完美的作品,我可以得到文件的内容回浏览器。 当出现问题的时候就是试图把这个内容打开成文件下载。 有没有一种特殊的方式来处理下载stream?

我得到的最接近的是客户端上的这段代码,如果我closures了adblocker,有时似乎在本地主机上工作 – 但是在生产中不起作用。

 $scope.download = function(){ Report.download($state.params.recordingId).then(function(data){ var csvContent = "data:text/csv;charset=utf-8," + data.toString(); var encodedUri = encodeURI(csvContent); window.open(encodedUri); }); 

Report.download只是一个围绕我的Node端点的angular度服务包装器,它返回一个promise,并parsing数据variables中文件的内容。

原因可能是浏览器阻止了新窗口。 允许所有网站在浏览器设置中显示popup窗口。

你可以用不同的方式尝试一下,在fs node创build一个文件,然后将url返回给Front-end

要么

你可以尝试下面的代码

 $scope.download = function() { Report.download($state.params.recordingId).then(function(data) { var csvContent = "data:text/csv;charset=utf-8," + data.toString(); var a = document.createElement('a'); a.href = "data:application/csv;charset=utf-8," + csvContent; a.setAttribute('download', "abc.csv"); document.body.appendChild(a); a.click(); document.body.removeChild(a); }); }