从使用的角度在客户端下载的NodeJS文件 [英] downloading files from nodejs using angular at client side
问题描述
我有一个简单的应用程序的角度具有类似配置 -
angular.module（'应用'，['ngResource'，'ngRoute'，'ui.bootstrap'，'angularFileUpload']）;angular.module（应用）。配置（函数（$ routeProvider，$ locationProvider）{
$ locationProvider.html5Mode（真）;
$ routeProvider
。当（'/'，{templateUrl：'/谐音/主/主'，控制器：'mainCtrl'}）
。当（'/浏览/笔记'，{templateUrl：'/谐音/笔记/ browseNotes'，
控制器：'browseNotesCtrl
}）
。当（'/上传/笔记'，{templateUrl：'/谐音/笔记/ uploadNotes'，
控制器：'uploadNotesCtrl
}）
。当（'/ profile文件'，{templateUrl：'/谐音/帐号/ mvProfile'，
控制器：'mvProfileCtrl
}）时，（'/浏览/笔记/：noteId'，{templateUrl：'/谐音/笔记/ noteDetail'，
控制器：'mvNoteDetailsCtrl
}）;
}）;
现在，我noteDetail部分包含内容 -
醇
李（NG-重复=N范围内（note.actualFileName.length））
一个（NG-点击=下载（N））{{note.actualFileName [N]}}
和控制器code -
$ scope.download =功能（N）{
的console.log（N）;
VAR downloadUrl ='/下载/ NOTE /'+ $ scope.note.noteId +'/'+ $ scope.note.storedFileName [N];
$ HTTP（{方法：GET，网址：downloadUrl}）。成功（功能（数据，状态，头，配置）{
的console.log（状态）;
的console.log（数据）;
}）;
}
在我的NodeJS服务器端的路由配置如下 -
app.get（'/下载/ NOTE /：noteid /：FILEID'，notes.download）;
和notes.download有
exports.download =功能（REQ，RES）{
的console.log（这里）;
的console.log（req.params.noteid）;
的console.log（req.params.fileid）;
res.status（200）;
VAR文件路径= path.normalize（__目录名称+'/../../'）;
文件路径+ ='服务器/上传/+ req.params.fileid;
的console.log（文件路径）;
res.download（文件路径，'server.pdf'）;
};
现在这里的问题是，如果我打开一些网址一样 -
<$p$p><$c$c>http://localhost:5000/download/note/9281a9d1-1b51-4e1b-9102-2b422cb2a111/e3ec261b-4722-4a69-ada6-68f88e2ff3db.pdf直接在浏览器将下载的新文件
但是，如果我从$ HTTP打开它显然它记录加密的二进制数据到控制台，而不是下载。所以，我如何实现这一目标？
而且，就算我创造一个锚标记喜欢的东西 -
再经过我点击它会打开一个页面，没有任何模板（因为我没有在我的routeProvider配置这条路线定义的任何范本，这表明该路由经过不转发到服务器routeProvider，我觉得 ）
以下是我点击附件后看到 -
但如果我在新标签页打开请求它转到服务器和它的作品
用ajax，除非你愿意重建使用斑点在客户侧的文件无法保存文件。 <一href=\"http://stackoverflow.com/questions/14682556/why-threre-is-no-way-to-download-file-using-ajax-request\">See这里
只要使用类似
$ location.url（'/下载/ NOTE /'+ $ scope.note.noteId +'/'+ $ scope.note.storedFileName [N]）;
至于第二部分，你routeProvider不知道该怎么办的时候路径无效。添加
$ routeProvider
。什么时候（'/'， {
templateUrl：'/谐音/主/主'，
控制器：'mainCtrl
}）
。当（'/浏览/笔记'，{
templateUrl：'/谐音/笔记/ browseNotes'，
控制器：'browseNotesCtrl
}）
。当（'/上传/笔记'，{
templateUrl：'/谐音/笔记/ uploadNotes'，
控制器：'uploadNotesCtrl
}）
。当（'/ profile文件'，{
templateUrl：'/谐音/帐号/ mvProfile'，
控制器：'mvProfileCtrl
}）
。当（'/浏览/笔记/：noteId'，{
templateUrl：'/谐音/笔记/ noteDetail'，
控制器：'mvNoteDetailsCtrl
}）
。除此以外（{
redirectTo：'/地方
}）;
I have a simple angular app which has configuration like -
angular.module('app',['ngResource','ngRoute','ui.bootstrap','angularFileUpload']);
angular.module('app').config(function($routeProvider,$locationProvider){
$locationProvider.html5Mode(true);
$routeProvider
.when('/', { templateUrl: '/partials/main/main', controller: 'mainCtrl'})
.when('/browse/notes', { templateUrl: '/partials/notes/browseNotes',
controller: 'browseNotesCtrl'
})
.when('/upload/notes', { templateUrl: '/partials/notes/uploadNotes',
controller: 'uploadNotesCtrl'
})
.when('/profile',{ templateUrl:'/partials/account/mvProfile',
controller: 'mvProfileCtrl'
}).when('/browse/notes/:noteId',{ templateUrl:'/partials/notes/noteDetail',
controller: 'mvNoteDetailsCtrl'
});
});
Now, my noteDetail partial has content -
ol
li(ng-repeat="n in range(note.actualFileName.length)")
a(ng-click="download(n)") {{note.actualFileName[n]}}
and controller has code -
$scope.download = function(n){
console.log(n);
var downloadUrl = '/download/note/' + $scope.note.noteId + '/' + $scope.note.storedFileName[n];
$http({method:'GET',url:downloadUrl}).success(function(data,status,headers,config){
console.log(status);
console.log(data);
});
}
and my server side route configuration in nodejs is as follows -
app.get('/download/note/:noteid/:fileid',notes.download);
and notes.download has
exports.download = function(req,res) {
console.log("here");
console.log(req.params.noteid);
console.log(req.params.fileid);
res.status(200);
var filepath = path.normalize(__dirname + '/../../');
filepath += 'server/uploads/' + req.params.fileid;
console.log(filepath);
res.download(filepath,'server.pdf');
};
now the problem here is if i open some url like -
http://localhost:5000/download/note/9281a9d1-1b51-4e1b-9102-2b422cb2a111/e3ec261b-4722-4a69-ada6-68f88e2ff3db.pdf
directly in the browser it downloads the new file but if i open it from the $http obviously it logs the encrypted binary data into the console, instead of downloading it. So, how do i achieve this?
and also, even if i create an anchor tag with something like -
and then after i click it opens an page without any template ( as i don't have any template defined for this route in my routeProvider configuration, indicating that the route passes through the routeProvider which does not forward it to the server, i feel ) here is what i see after clicking on attachment - but if i open it in new tab request goes to server and it works
You can't save files using ajax, unless you're willing to rebuild the file on the client's side using blobs. See here.
Just use something like
$location.url('/download/note/' + $scope.note.noteId + '/' + $scope.note.storedFileName[n]);
As for the second part, your routeProvider doesn't know what to do when the path is invalid. Add
$routeProvider
.when('/', {
templateUrl: '/partials/main/main',
controller: 'mainCtrl'
})
.when('/browse/notes', {
templateUrl: '/partials/notes/browseNotes',
controller: 'browseNotesCtrl'
})
.when('/upload/notes', {
templateUrl: '/partials/notes/uploadNotes',
controller: 'uploadNotesCtrl'
})
.when('/profile', {
templateUrl: '/partials/account/mvProfile',
controller: 'mvProfileCtrl'
})
.when('/browse/notes/:noteId', {
templateUrl: '/partials/notes/noteDetail',
controller: 'mvNoteDetailsCtrl'
})
.otherwise({
redirectTo: '/wherever'
});
这篇关于从使用的角度在客户端下载的NodeJS文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
