Express URL跳轉(重定向)的實現


Express URL跳轉(重定向)的實現

 

Express是一個基於Node.js實現的Web框架,其響應HTTP請求的response對象中有兩個用於URL跳轉方法res.location()res.redirect(),使用它們可以實現URL的301或302重定向。

res.location(path)

res.location(path)

下面列舉了幾種,設置http響應頭Location的方法

res.location('/foo/bar');
res.location('http://example.com');
res.location('back');

路徑值back具有特殊的意義,這個涉及到請求頭Referer中指定的URL,如果Referer頭沒有指定,將會設置為'/'。

Express通過Location頭將指定的URL字符串傳遞給瀏覽器,它並不會對指定的字符串進行驗證(除'back'外)。而瀏覽器則負責將當前URL重定義到響應頭Location中指定的URL。

res.redirect([status,] path)

其中參數:

  • status:{Number},表示要設置的HTTP狀態碼
  • path:{String},要設置到Location頭中的URL

使用指定的http狀態碼,重定向到指定的URL,如果不指定http狀態碼,使用默認的狀態碼”302“:”Found“,

res.redirect('/foo/bar');
res.redirect('http://example.com');
res.redirect(301, 'http://example.com');
res.redirect('../login');

重定向可以是一個完整的URL,這樣會重定向到一個不同的站點上。

res.redirect('http://google.com');

重定向也可以相對於所在主機的根目錄,例如,如果你的程序運行在:http://example.com/admin/post/new上下面的代碼將會重定向到如下地址:http://example.com/admin

res.redirect('/admin');

重定向也可以相對於當前的URL,例如:從http://example.com/blog/admin/這個地址(注意反斜杠),下面的代碼將會重定向到地址:http://example.com/blog/admin/post/new

res.redirect('post/new')

在從地址: http://example.com/blog/admin重定向到 post/new,如果沒有反斜杠的話將會重定向到:http://example.com/blog/post/new

如果你感覺上面的行為很迷惑,想想文件目錄和文件的路徑,這會讓你更好理解。

相對路徑的重定向也是允許的,如果你的地址是: http://example.com/admin/post/new,下面的代碼將會重定向到http//example.com/admin/post這個地址:

res.redirect('..');

back重定向,重定向到請求的referer,當沒有referer請求頭的情況下,默認為‘/’

res.redirect('back'); 

URL重定向原理

進行URL重定向時,服務器只在響應信息的HTTP頭信息中設置了HTTP狀態碼Location頭信息。

當狀態碼為301302時(301-永久重定向、302-臨時重定向),表示資源位置發生了改變,需要進行重定向。

Location頭信息表示了資源的改變的位置,即:要跳重定向的URL。

 

location()redirect()的比較

Expressresponse對象,是對Node.js原生對象ServerResponse的擴展。location()方法只會設置Location頭,而redirect()方法除了會設置Location頭外還可自動或手頭設置HTTP狀態碼。理論上講兩者可以實現重定向。

location()方法實現過程大致如下:

復制代碼
res.location = function(url){
  var req = this.req;

  // "back" 是 referrer的別名
  if ('back' == url) url = req.get('Referrer') || '/';

  // 設置Lcation
  this.setHeader('Location', url);
  return this;
};
復制代碼

從以上代碼可以看出,location()方法本質上是調用了ServerResponse對象的setHeader()方法,但並沒有設置狀態碼。通過location()設置頭信息后,其后的代碼還會執行。

使用location()方法實現URL的重定向,還要手動設置HTTP狀態碼

res.location('http://itbilu.com');
res.statusCode = 301;

如果需要立即返回響應信息,還要調用end()方法:

復制代碼
res.location('http://itbilu.com');
res.statusCode = 301;
res.end('響應的內容');

// 或
res.location('http://itbilu.com');
res.sent(302);
復制代碼

redirect()方法實現過程大致如下:

復制代碼
res.redirect = function(url){
  var head = 'HEAD' == this.req.method;
  var status = 302;
  var body;

  // 一些處理
  ……

  // 通過 location 方法設置頭信息
  this.location(url);
  
  // 另一些處理
  ……

  // 設置狀態並返回響應
  this.statusCode = status;
  this.set('Content-Length', Buffer.byteLength(body));
  this.end(head ? null : body);
};
復制代碼

從以上代碼可以看出,redirect()方法是對location()方法的擴展。通過location()設置Loction頭后,設置HTTP狀態碼,最后通過ServerResponse對象的end()方法返回響應信息。調用redirect()方法后,其后的代碼都不會被執行

重定向與不重定向

在使用的過程中,redirect()方法大多能重定向成功,而location()方法則不太確定,有時可以成功有時不能成功。這與我們的用法有關。

上面講過,URL重定向是在瀏覽器端完成的,而URL重定向與HTTP狀態碼Location頭有關。瀏覽器首先會判斷狀態碼,只有當狀態碼是:301302時,才會根據Location頭中的URL進行跳轉。

所以,使用location()設置頭信息,而不設置狀態碼或狀態碼不是301302,並不會發生重定向:

res.location('http://itbilu.com');
res.sent(200);

而使用redirect()設置的狀態碼不是301302也不會發生跳轉:

res.redirect(200, 'http://itbilu.com');

 

參考:

1、http://itbilu.com

2、http://www.expressjs.com.cn/4x/api.html#res.location


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM