Question

我目前正在学习node.js，最近遇到一种情况，我想点击网页上的按钮下载存储在服务器上的图像。我创建了一个端点，控制器传递两个参数：
- 要下载的图像的名称（目录是固定的）
- 下载图像的名称

我已尝试过Download a file from NodeJS Server using Express

中提供的解决方案

我正在使用angular来填充按钮并触发下载，如下所示：

<div class="btn-group" role="group" aria-label="Image tags">
    <button ng-repeat="tag in imageTags" type="button" class="btn btn-outline-warning" ng-click="download(tag)">{{tag}}</button>
</div>

这是我的控制器：

$scope.download = function(tagName) {
    tagName = tagName.replace(/\W+/g, '-');
    Clarifai.download(tagName, UploadSuccess.uploadedFile)
        // UploadSuccess.uploadedFile contains the name of the file to be downloaded.
        .success(function(data) {
            //do something
        });
}

调用以下工厂方法：

download: function(tagName, imageName) {
    return $http.get('/api/clarifai/tagDownload/' + tagName + "/" + imageName);
}

这是我的路线档案的相关部分：

app.get('/api/clarifai/tagDownload/:tagName/:imageName', function(req, res) {
    // Ignore tagName for now.
    console.log("Begin download");
    var img = path.resolve('image_dump/OutputDump/' + req.params.imageName);
    // Returns the expected path for the file
    var filename = path.basename(img);
    var mimetype = mime.lookup(img);

    console.log(filename);
    console.log(mimetype);

    res.setHeader('Content-disposition', 'attachment; filename=' + filename);
    res.setHeader('Content-type', mimetype);

    var filestream = fs.createReadStream(img);
    filestream.pipe(res);
    res.on('finish', function(){
        console.log("Download complete");
    });
});

所以所有流程都工作到此为止，点击其中一个按钮后，我得到如下输出：

Begin download
Jon-1477683540996.jpg
image/jpeg
GET /api/clarifai/tagDownload/people/Jon-1477683540996.jpg 200 5.296 ms -
Download complete

但我看不到任何地方下载文件的迹象。任何浏览器都没有对话框。到目前为止我读过的所有答案似乎都提到下载是由pipe调用处理的。但是我没有成功。

我也试过了res.download(img)，但效果相同。

我的方法是使用控制器内部的回调来处理这个问题。但我无法弄清楚如何做到这一点。我错过了什么/做错了什么？有人可以指出我正确的方向吗？

提前谢谢。

Answer 1

为了完整起见，我在这里解决了这个问题：
在我的控制器中，而不是使用：

JsonLdOptions

我必须这样做：

$http.get('/api/clarifai/tagDownload/' + tagName + "/" + imageName);

正如adeneo指出的那样，原因是点击Angular中的按钮并不会重定向。因此，必须使用Angular的path = "/api/clarifai/tagDownload/" + tagName + "/" + imageName; $window.location.href = path; API手动触发。

在此答案中也可以找到其他一些替代方法：Using $window or $location to Redirect in AngularJS

如何处理来自nodejs服务器的图像下载？

1 个答案: