我有一个网页GET /team
正在加载一个团队列表,而DEL /team
正在从/team/:key
删除一个团队。因此,您导航到团队的个人资料页面并从那里删除它们,删除后应将您重定向到/team
页面。我已将日志放入控制台,并且已成功删除team
,而且它正在加载/team
,但浏览器未加载此项。我把我的代码放在下面,有什么想法吗?
路线:
app.get('/team'/*, lim("Must be logged in to see teams")*/, getAllTeams, function(req, res){
util.log('Serving request for url [GET] ' + req.route.path);
// Pass it the list of all Teams
res.render('team', {'teamsList' : req.teamsList} );
});
app.get('/team/:key', function(req, res) {
util.log('Serving request for url [GET] ' + req.route.path);
Team.findByKey(req.params.key, function(err, teamData){
if(!err && teamData){
teamData = teamData;
res.render('teamDetails', { 'teamData' : teamData } );
} else {
util.log('Error in fetching Team by key : ' + req.params.key);
res.json({
'retStatus' : 'failure',
'msg' : 'Error in fetching Team by key ' + req.params.key
});
}
});
});
/**
* DEL /team/:key
* Delete Team by key
*/
app.del('/team/:key', getAllTeams, function(req, res) {
util.log('Serving request for url [DEL] ' + req.route.path);
Team.remove({key : req.params.key}, function(err){
var message = '';
var retStatus = '';
if (!err) {
util.log('Successfully deleting Team with key: ' + req.params.key);
message = 'Successfully deleting Team with key: ' + req.params.key;
retStatus = 'Success';
res.redirect('/team');
} else {
util.log('Error deleting Team with key: ' + req.params.key + 'Error: ' + util.inspect(err));
res.json({
'retStatus' : 'failure',
'msg' : 'Error in fetching Team with key ' + req.params.key
});
}
});
});
JavaScript + HTML模板:
button#teamDelete.btn.btn-danger.btn-mini(type="submit", value="Delete Team") Delete
script(type='text/javascript')
$('#teamDelete').live('click',function(){
var teamId = #{teamData.key};
$.post('/team/' + teamId, { _method : 'delete' }, function(response) {
console.log(response);
if(response.retStatus === 'Success') {
if('/team' && '/team' !== "") {
window.location = '/team';
}
}
});
});
控制台日志:
10 Mar 11:52:01 - Serving request for url [GET] /team
10 Mar 11:52:02 - Serving request for url [GET] /team/:key
10 Mar 11:52:03 - Serving request for url [DEL] /team/:key
10 Mar 11:52:03 - Successfully deleting Team with key: 1362855941128
10 Mar 11:52:03 - Serving request for url [GET] /team
getAllTeams:
var getAllTeams = function(req, res, next){
Team.getAll(function(err, teamsList){
if(!err && teamsList){
req.teamsList = teamsList;
return next();
}
});
};
Team.getAll(团队架构)
Team.statics.getAll = function(cb){
var query = this.find({});
query.sort({key : -1});
return query.exec(cb);
};
答案 0 :(得分:2)
要快速解决方法,只需将重定向网址添加到响应中,然后在客户端执行:
if (redirectUrl && redirectUrl !== "")
window.location = redirectUrl;
答案 1 :(得分:2)
您的请求是POST($ .post),您的路由是app.del,因此它永远不会在app.del路由中获得res.redirect。
为什么不使用app.post?
<强>更新强>
假设$ .post在这里发送HTTP DEL请求发生了什么:服务器发送302响应没有数据但浏览器从未向GET路由发送另一个请求,因为服务器指示它(或者jQuery处理重定向吗?不确定)。 res.redirect()是实际的HTTP响应,而不是一些内部服务器端指令,用于将请求重新路由到另一条路径,就像在ASP.NET中可以做的那样(实际上是错误的)... Route旨在接收请求,回复回复并忘掉它。您需要将路由与处理它们的实际函数分开,然后您就可以调用该函数而不是发送重定向。
代码建议
在app.del('/ team /:key'...
...
retStatus = 'Success';
// res.redirect('/team');
res.send({
retStatus : retStatus,
redirectTo: '/team',
msg : 'Just go there please' // this should help
});
...
$ .post中的客户端('/ team /'...
...
$.post('/team/' + teamId, { _method : 'delete' }, function(response) {
console.log(response);
if(response.retStatus === 'Success') {
// not sure what did you mean by ('/team' && '/team' !== "")
// if('/team' && '/team' !== "") {
if (response.redirectTo && response.msg == 'Just go there please') {
window.location = response.redirectTo;
}
}
});
...
不确定它是否有效,因为我不明白您的getAllTeams
做了什么以及为什么要将teamList
存储在req中。如果要存储在会话中,而不是假设正确配置了中间件,则需要使用req.session。如果您只需要在请求中存储它,并且您的getAllTeams准备此团队列表,最好存储在res.locals中(如res.locals.teamList)。
并确保您的getAllTeams下一次调用。所以基本上你的getAllTeams应该是这样的:
function getAllTeams (req, res, next) {
res.locals.teamList = [/* whatever */];
next();
}
然后你可以在路由处理程序中使用res.locals.teamList而不是req.teamList。
res.render('team', {teamsList : res.locals.teamsList} );
'团队'模板也有问题......
快速建议:)
此外,使用Express的方式使得扩展/管理应用程序变得非常困难。我不记得究竟在哪里,但是在他们编写的文档中,Express应该被用作应用程序框架的基础,而不是像大多数PHP框架那样完整的框架。它为您提供了很多功能和灵活性,但也需要提前考虑您的应用程序架构。
express的最强大功能是,您可以通过next()将许多特定于路由的处理程序/中间件传递给彼此来处理任何路由。我有一个静态表,定义在每个路由上使用哪些处理程序,允许在一个页面上查看整个应用程序有30个左右的路由。此表用于在应用程序启动时动态组合路由。它带来了很大的灵活性,可管理性(我可以从路由到路由移动/复制粘贴处理程序 - 每个处理程序表示为一个单词)和代码重用。我还在客户端使用相同的路由定义哈希进行客户端路由。