Создание SEO (и пользователей) дружественных URL в вашем приложении ASP.NET MVC

1. Вступление
2. Генерация URL
3. Привязка параметров

Опубликовано: 28 июля 2015 г.

Вступление

Посмотрите на следующий URL:

http://www.amazon.com/gp/product/1617292397/ref=s9_psimh_gw_p14_d4_i1?pf_rd_m=ATVPDKIKX0DER&pf_rd_s=desktop-1&pf_rd_r=0TFM5Q6WM6KD9NPNG9G7&pf_rd_t=36701&pf_rd_p=2079475242&pf_rd_i=desktop

Вы хоть представляете, на что указывает URL, просто взглянув на него? Скорее всего нет.

Теперь посмотрим на это:

http://www.dpreview.com/articles/9485436827/the-big-beast-hands-on-with-the-panasonic-lumix-dmc-gx8

Любая идея? Ну, может показаться, что это статья о практической работе с Panasonic Lumix DMX-GX8.

В сегодняшней записи блога я хотел бы продемонстрировать, как создавать «дружественные» URL-адреса в ваших приложениях ASP.NET. Дружественный не только в том смысле, что кто-то может посмотреть на него и выяснить, на что указывает URL, но, что более важно, дружественный для поисковых систем.

Прямо сейчас вы, возможно, спросите, как это влияет на поисковые системы, такие как Google, каков URL страницы? Наверняка компьютеру все равно? Ну, вы были бы в некотором роде правы, но дело в том, что наличие ключевых слов, по которым вы пытаетесь ранжироваться в URL страницы, действительно имеет значение.

Есть много вещей, которые играют роль в том, как Google определяет рейтинг веб-страницы, и никто не может точно сказать, насколько большую роль играет каждый из этих факторов. Однако большинство людей согласны с тем, что наличие ключевых слов, по которым вы хотите, чтобы страница ранжировалась в URL страницы, действительно помогает в ранжировании страницы.

В этой записи блога я собираюсь показать вам, как создавать URL-адреса в вашем приложении, которое является более SEO - и удобным для пользователя.

Генерация URL

В моем примере приложения я создал фиктивную базу данных продуктов, которая отображает список продуктов и позволяет пользователю щелкнуть конкретный продукт, чтобы перейти на страницу сведений об этом продукте.

Мой класс продукта довольно прост:

открытый класс Product {public string Description {get; задавать ; } public int Id {get; задавать ; } публичная строка Name {get; задавать ; } публичная цена Price {get; задавать ; }}

На странице со списком продуктов я просто отображаю список продуктов:

И когда пользователь нажимает на конкретный продукт, он переходит на страницу сведений о продукте:

Посмотрите на URL, который мы генерируем:

Это обычный URL, который вы получаете в большинстве приложений ASP.NET MVC, который передает идентификатор конкретной строки базы данных в действие контроллера.

Мы хотим иметь что-то более удобное для пользователя. Кое-что, по крайней мере, также содержит название нашего продукта. Чтобы сгенерировать дружественный URL-адрес, я создал новый метод в своем классе Product, который генерирует правильный «кусок» (или URL) для страницы сведений о продукте:

открытый класс Product {public string Description {get; задавать ; } public int Id {get; задавать ; } публичная строка Name {get; задавать ; } публичная цена Price {get; задавать ; } // Генерация слагов взята с http://stackoverflow.com/questions/2920744/url-slugify-algorithm-in-c public string GenerateSlug () {строковая фраза = string .Format ("{0} - {1}" , Id, Name); строка str = RemoveAccent (фраза) .ToLower (); // неверные символы str = Regex.Replace (str, @ "[^ a-z0-9 \ s-]", ""); // преобразовать несколько пробелов в один пробел str = Regex.Replace (str, @ "\ s +", "") .Trim (); // вырезать и обрезать str = str.Substring (0, str.Length <= 45? str.Length: 45) .Trim (); str = Regex.Replace (str, @ "\ s", "-"); // дефисы return str; } приватная строка RemoveAccent (string text) {byte [] bytes = System.Text.Encoding.GetEncoding ("Cyrillic") .GetBytes (text); return System.Text.Encoding.ASCII.GetString (bytes); }}

И я также обновил свою страницу листинга, чтобы использовать slug в качестве параметра маршрута вместо Id, как это было раньше:

<таблица> <thead> <tr> <th> имя </ th> <th> цена </ th> <th> изображение </ th> </ tr> </ thead> <tbody> @foreach (var product in Модель) {<tr> <td> <a href = "@ Url.Action (" Детали "," Продукты ", новый {id = @ product.GenerateSlug ()})"> @ product.Name </ a> < / td> <td> @ product.Price </ td> <td> <img src = "http://placehold.it/100x100" /> </ td> </ tr>} </ tbody> </ table >

Теперь, когда я перехожу на страницу сведений о продукте, я вижу, что у нас есть правильный «дружественный» URL-адрес, который содержит название продукта:

Привязка параметров

Но также обратите внимание, что у нас есть новая ошибка. ASP.NET MVC жалуется, что ожидал параметр маршрута id, но не смог его найти. Это потому, что действие Details на моем контроллере ожидает целочисленное значение для параметра id:

public ActionResult Details (int id) {...}

Но вместо целого числа часть нашего маршрута {id} теперь содержит строку. Среда MVC пытается преобразовать строку в целое число, но не может этого сделать, и поэтому она передает нулевое значение, а затем жалуется, что параметр id не может содержать нулевое значение.

Чтобы исправить эту ошибку, нам нужно изменить RouteData для маршрута, чтобы исправить значение параметра id route.

Я создал новый класс с именем SeoFriendlyRoute, который наследуется от Route, и переопределил метод GetRouteData для очистки параметра id. В моей реализации я вызываю базовый метод GetRouteData и проверяю, являются ли данные маршрута не нулевыми, в этом случае это означает, что у меня есть соответствие для моего маршрута.

В этом случае я просто проверяю, присутствует ли параметр id, и если это так, я использую регулярное выражение для извлечения первой части URL, содержащей фактический числовой идентификатор, и назначаю это числовое значение значению маршрута id:

открытый класс SeoFriendlyRoute: Route {public SeoFriendlyRoute (строковый url, значения по умолчанию RouteValueDictionary, IRouteHandler routeHandler): base (url, значения по умолчанию, routeHandler) {} public переопределить RouteData GetRouteData (HttpContextBase httpG_DataTataTataTataTataTataTataTataTataTataTataTataTataTataTataTataTataTataTataTateTateBataTataTextDateTateBataTataTextDateTextDateTateBataTataTextDataTextDextDateTextBateTataTextDateTextDeteDataTextBateTataTextBeteTateText_TextE)): открытый класс. if (routeData! = null) {if (routeData.Values.ContainsKey ("id")) routeData.Values ​​["id"] = GetIdValue (routeData.Values ​​["id"]); } return routeData; } закрытый объект GetIdValue (идентификатор объекта) {if (id! = null) {string idValue = id.ToString (); var regex = new Regex (@ "^ (? <id> \ d +). * $"); var match = regex.Match (idValue); if (match.Success) {return match.Groups ["id"] .Value; }} return id; }}

И последний бит - добавить новый маршрут для пути / products / details / {id}, чтобы использовать мой новый класс маршрута SeoFriendlyRoute:

открытый класс RouteConfig {открытый статический void RegisterRoutes (маршруты RouteCollection) {rout.IgnoreRoute ("{resource} .axd / {* pathInfo}"); route.Add ("ProductDetails", новый SeoFriendlyRoute ("products / details / {id}", новый RouteValueDictionary (new {controller = "Products", action = "Details"}), новый MvcRouteHandler ())); route.MapRoute ("По умолчанию", "{controller} / {action} / {id}", new {controller = "Home", action = "Index", id = UrlParameter.Optional}); }}

И теперь, когда я обновляю страницу, параметры привязываются правильно, поскольку только числовая часть URL-адреса продукта, которая содержит фактический идентификатор продукта, передается как параметр id:

Если вы нашли ценность в этом сообщении в блоге и хотите вернуть услугу, вы можете Купи мне кофе

PS: я публикую еженедельную рассылку для разработчиков ASP.NET под названием ASP.NET Weekly . Если вы хотите получать электронную почту каждую пятницу со всеми лучшими сообщениями в блогах, связанных с ASP.NET за предыдущую неделю, пожалуйста, Подписаться !

Похожие

Комментарии