2013年3月13日 星期三

ASP.NET MVC - LowercaseRoutesMVC 讓網站的 URL 輸出為小寫

在 SEO 對於 URL 的討論中,有部分的人是覺得網頁的 URL 大小寫對於 PageRank 是有影響,而有些人是說對於非使用 IIS 網頁伺服器的網站其 URL 的大小寫才會有影響,對於我來說,其實有關於 URL 大小寫與 SEO 的關係對於我來說並不是那麼清楚,但為何又要介紹這個套件呢?

其實我們開發 ASP.NET MVC 網站很少會注意到 URL 大小寫,多半我們都是在注意網頁執行的正確以及使用者是否輸入正確的 URL,但如果今天被客戶要求需要將網站內所產出的 URL 都一律使用小寫時,那麼 LowercaseRoutesMVC 這個套件就派上用場了,這邊就來介紹這一個套件。


LowercaseRoutesMVC - Map ASP.NET MVC routes to lowercase URLs

http://lowercaseroutesmvc.codeplex.com/

image

NuGet - LowercaseRoutesMVC

http://nuget.org/packages/LowercaseRoutesMVC

image

 

一般我們在 ASP.NET MVC 所開發的網站裡所產出的 URL 都會是以下的樣子,

http://test.com/Home/Index or http://test.com/Order/List

如果是讓使用者自行輸入 URL 的話,一般來說並不會在輸入時去區分大小寫,以上 URL 就會輸入以下,

http://test.com/home/index or http://test.com/order/list

前面有說到,假如要將網站產出的 URL 都轉為小寫的這樣需求時,就是在 ASP.NET MVC 專案中藉由 NuGet 將 LowercaseRoutesMVC 安裝到專案裡使用就可以了,以下為安裝以及使用的步驟,

 

Step.1 從 NuGet 安裝 LowsercaseRoutesMVC

先準備好一個 ASP.NET MVC 網站專案,建立好 Model, Controller, View,

image

P.S 這個示範用的 ASP.NET MVC 專案為 ASP.NET MVC 4.

預設的狀況下,URL 都是以 Camel-cased 的方式呈現,就是我們 Controller 的 prefix 與 Action 名稱是怎麼輸入的,然後再以 Route 設定來做輸出,

image

image

image

 

Step.2 透過 NuGet 安裝 LowercaseRoutesMVC

在 NuGet 管理視窗中搜尋「LowercaseRoutesMVC」,會出現兩個結果,我們這邊需要安裝的是第一個,而第二個「LowercaseRoutesMVC4」則是提供給 ASP.NET Web API HTTP routes 所使用,

SNAGHTML1995cc3a

image

 

Step.3 修改 RouteConfig.cs 的 Route 設定

接著是修改 RouteConfig.cs 的 Route 設定,原本是使用 routes.MapRoute() 來進行 route 設定,而在安裝 LowercaseRoutesMVC 之後,這邊就需要做修改,以下為原本 RouteConfig.cs 的內容,

image

將原本使用 MapRoute() 方法改為使用 MapRouteLowercase() 方法,記得前面要引用 LowercasrRoutesMVC 的 Namespace,

image

上面的設定修改完成後,重新建置專案,再一次執行網站,觀察 HTML 原始碼就可以看到原本為 Camel-cased 的 URL 已經是以 lower-cased 產出,

image

image

 

※ Area 的修改

我在原本的網站專案中新增一個 Area「Test」,

image

在尚未做任何的設定修改前,我在 Home/Index 首頁增加一個指向 Test/Product/List 的連結,而產出的 URL 結果如下,

image

image

而 Test/Product/List 網頁的 URL 並沒有轉為 lower-cased,這是因為 Area 的 Route 設定並需要在 AreaRegistration 中做設定修改,以下是尚未做任何設定修改的 TestAreaRegistration.cs,

image

這邊的修改就如同在 RouteConfig.cs 的修改是一樣的,如下,

image

修改並重新建置專案,重新執行網站,原本首頁指向 Test 區域的 URL 已經轉為 lower-cased,

image

進入到 Test 區域內的 Product/List 網頁,也可以看到網頁的 URL 也是以 lower-cased 呈現,

image

至於 ASP.NET Web API 的重新設定 HTTP Routes,這就直接看 LowercaseRoutesMVC - CodePlex 首頁的說明。

 


雖然說這種指定網站內所有 URL 都要使用 lower-cased 呈現的需求是比較少,但假如有碰到這樣的需求時,LowercaseRoutesMVC 這個套件就可以派上用場,而且在設定上也不會很繁瑣(如果不寫程式的話,是需要到 IIS 去修改 Url Rewrite rule 的設定)。

 

相關連結:

MSDN ASP.NET MVC Forum - How can we convert url to the lower caes in routing in MVC

MSDN - RouteCollection.LowercaseUrls 屬性

stackoverflow - .NET 4.5 MVC RouteCollection.LowercaseUrls breaks when using Area

Solving Duplicate Content with Distinct URLs Issue in ASP.NET MVC - Imran Baloch's Blog

 

以上

沒有留言:

張貼留言

提醒

千萬不要使用 Google Talk (Hangouts) 或 Facebook 及時通訊與我聯繫、提問,因為會掉訊息甚至我是過了好幾天之後才發現到你曾經傳給我訊息過,請多多使用「詢問與建議」(在左邊,就在左邊),另外比較深入的問題討論,或是有牽涉到你實作程式碼的內容,不適合在留言板裡留言討論,請務必使用「詢問與建議」功能(可以夾帶檔案),謝謝。