URL Yönlendirme

Makale
06/16/2023

Wingtip Toys Örnek Proje (C#) veya E-kitabı İndir (PDF)

Bu öğretici serisi, web için ASP.NET 4.5 ve Microsoft Visual Studio Express 2013 kullanarak ASP.NET Web Forms uygulaması oluşturmanın temellerini öğretecektir. Bu öğretici serisine eşlik etmek için C# kaynak koduna sahip bir Visual Studio 2013 projesi kullanılabilir.

Bu öğreticide Wingtip Toys örnek uygulamasını URL yönlendirmeyi destekleyecek şekilde değiştireceksiniz. Yönlendirme, web uygulamanızın arama motorları tarafından kolay, daha kolay anımsanabilen ve daha iyi desteklenen URL'leri kullanmasını sağlar. Bu öğretici, önceki "Üyelik ve Yönetim" öğreticisini oluşturur ve Wingtip Toys öğretici serisinin bir parçasıdır.

Öğrenecekleriniz:

bir ASP.NET Web Forms uygulaması için yolları kaydetme.
Web sayfasına yol ekleme.
Yolları desteklemek için veritabanından veri seçme.

ASP.NET Yönlendirmeye Genel Bakış

URL yönlendirme, bir uygulamayı fiziksel dosyalara eşlenmeyen istek URL'lerini kabul etmek üzere yapılandırmanıza olanak tanır. İstek URL'si, kullanıcının web sitenizde bir sayfayı bulmak için tarayıcılarına girdiği URL'dir. Yönlendirmeyi, kullanıcılar için anlamsal olarak anlamlı olan ve arama motoru iyileştirmesine (SEO) yardımcı olabilecek URL'leri tanımlamak için kullanırsınız.

Varsayılan olarak, Web Forms şablonu ASP.NET Kolay URL'ler içerir. Temel yönlendirme çalışmalarının çoğu Kolay URL'ler kullanılarak uygulanacaktır. Ancak, bu öğreticide özelleştirilmiş yönlendirme özellikleri ekleyebilirsiniz.

URL yönlendirmeyi özelleştirmeden önce Wingtip Toys örnek uygulaması aşağıdaki URL'yi kullanarak bir ürüne bağlanabilir:

https://localhost:44300/ProductDetails.aspx?productID=2

URL yönlendirmeyi özelleştirerek Wingtip Toys örnek uygulaması, daha kolay okunan bir URL kullanarak aynı ürüne bağlanır:

https://localhost:44300/Product/Convertible%20Car

Yollar

Yol, bir işleyiciye eşlenen bir URL desenidir. İşleyici, Web Forms bir uygulamadaki .aspx dosyası gibi fiziksel bir dosya olabilir. İşleyici, isteği işleyen bir sınıf da olabilir. Yol tanımlamak için URL desenini, işleyiciyi ve isteğe bağlı olarak yol için bir ad belirterek Route sınıfının bir örneğini oluşturursunuz.

Nesnesini sınıfın statik Routes özelliğine RouteTable ekleyerek Route uygulamaya yolu eklersiniz. Routes özelliği, uygulamanın tüm yollarını depolayan bir RouteCollection nesnedir.

URL Desenleri

URL deseni değişmez değerler ve değişken yer tutucuları (URL parametreleri olarak adlandırılır) içerebilir. Değişmez değerler ve yer tutucular, URL'nin eğik çizgi (/) karakteriyle sınırlandırılmış kesimlerinde bulunur.

Web uygulamanıza bir istek yapıldığında, URL segmentlere ve yer tutuculara ayrıştırılır ve değişken değerleri istek işleyicisine sağlanır. Bu işlem, sorgu dizesindeki verilerin ayrıştırılıp istek işleyicisine geçirilmesine benzer. Her iki durumda da değişken bilgileri URL'ye eklenir ve anahtar-değer çiftleri biçiminde işleyiciye geçirilir. Sorgu dizeleri için hem anahtarlar hem de değerler URL'dedir. Yollar için anahtarlar URL düzeninde tanımlanan yer tutucu adlarıdır ve URL'de yalnızca değerler bulunur.

URL deseninde, yer tutucuları küme ayraçları ( { ve } ) içine alarak tanımlarsınız. Bir segmentte birden fazla yer tutucu tanımlayabilirsiniz, ancak yer tutucuların değişmez değerle ayrılması gerekir. Örneğin, {language}-{country}/{action} geçerli bir yol desenidir. Ancak, {language}{country}/{action} yer tutucular arasında değişmez değer veya sınırlayıcı olmadığından geçerli bir desen değildir. Bu nedenle yönlendirme, dil yer tutucusunun değerini ülke yer tutucusunun değerinden ayıracağı yeri belirleyemez.

Yolları Eşleme ve Kaydetme

Wingtip Toys örnek uygulamasının sayfalarına yol ekleyebilmeniz için önce, uygulama başlatıldığında yolları kaydetmeniz gerekir. Yolları kaydetmek için olay işleyicisini Application_Start değiştirirsiniz.

Visual Studio'Çözüm GezginiGlobal.asax.cs dosyasını bulun ve açın.

Sarı renkle vurgulanan kodu Global.asax.cs dosyasına aşağıdaki gibi ekleyin:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Optimization;
using System.Web.Routing;
using System.Web.Security;
using System.Web.SessionState;
using System.Data.Entity;
using WingtipToys.Models;
using WingtipToys.Logic;

namespace WingtipToys
{
    public class Global : HttpApplication
    {
        void Application_Start(object sender, EventArgs e)
        {
          // Code that runs on application startup
          RouteConfig.RegisterRoutes(RouteTable.Routes);
          BundleConfig.RegisterBundles(BundleTable.Bundles);

          // Initialize the product database.
          Database.SetInitializer(new ProductDatabaseInitializer());

          // Create custom role and user.
          RoleActions roleActions = new RoleActions();
          roleActions.AddUserAndRole();

          // Add Routes.
          RegisterCustomRoutes(RouteTable.Routes);
        }

        void RegisterCustomRoutes(RouteCollection routes)
        {
          routes.MapPageRoute(
              "ProductsByCategoryRoute",
              "Category/{categoryName}",
              "~/ProductList.aspx"
          );
          routes.MapPageRoute(
              "ProductByNameRoute",
              "Product/{productName}",
              "~/ProductDetails.aspx"
          );
        }
    }
}

Wingtip Toys örnek uygulaması başlatıldığında olay işleyicisini Application_Start çağırır. Bu olay işleyicisinin RegisterCustomRoutes sonunda yöntemi çağrılır. yöntemi, RegisterCustomRoutes nesnesinin MapPageRoute yöntemini RouteCollection çağırarak her yolu ekler. Yollar yol adı, yol URL'si ve fiziksel URL kullanılarak tanımlanır.

İlk parametre ("ProductsByCategoryRoute"), yol adıdır. Gerektiğinde yolu çağırmak için kullanılır. İkinci parametre ("Category/{categoryName}"), koda göre dinamik olabilecek kolay değiştirme URL'sini tanımlar. Bir veri denetimini verilere göre oluşturulan bağlantılarla doldurduğunuz sırada bu yolu kullanırsınız. Bir yol aşağıdaki gibi gösterilir:

routes.MapPageRoute(
      "ProductsByCategoryRoute",
      "Category/{categoryName}",
      "~/ProductList.aspx"
  );

Yolun ikinci parametresi, küme ayraçları ({ } tarafından belirtilen dinamik bir değer içerir. Bu durumda, categoryName doğru yönlendirme yolunu belirlemek için kullanılacak bir değişkendir.

Not

İsteğe bağlı

yöntemini ayrı bir sınıfa taşıyarak kodunuzu yönetmeyi RegisterCustomRoutes daha kolay bulabilirsiniz. Logic klasöründe ayrı RouteActions bir sınıf oluşturun. Yukarıdaki RegisterCustomRoutes yöntemi Global.asax.cs dosyasından yeni RoutesActions sınıfa taşıyın. RoleActionsGlobal.asax.cs dosyasından yöntemini çağırma örneği olarak sınıfını RegisterCustomRoutes ve createAdmin yöntemini kullanın.

Olay işleyicisinin RegisterRoutes başında nesnesini kullanarak RouteConfig yöntem çağrısının Application_Start da olduğunu fark etmiş olabilirsiniz. Bu çağrı, varsayılan yönlendirmeyi uygulamak için yapılır. Visual Studio'nun Web Forms şablonunu kullanarak uygulamayı oluşturduğunuzda varsayılan kod olarak eklenmiştir.

Rota Verilerini Alma ve Kullanma

Yukarıda belirtildiği gibi yollar tanımlanabilir. Global.asax.cs dosyasındaki olay işleyicisine Application_Start eklediğiniz kod, tanımlanabilir yolları yükler.

Yolları Ayarlama

Yollar için ek kod eklemeniz gerekir. Bu öğreticide, bir veri denetiminden veri kullanarak yolları oluştururken kullanılan bir RouteValueDictionary nesneyi almak için model bağlamayı kullanacaksınız. nesnesi, RouteValueDictionary belirli bir ürün kategorisine ait ürün adlarının listesini içerir. Veriler ve rota temelinde her ürün için bir bağlantı oluşturulur.

Kategoriler ve Ürünler için Yolları Etkinleştirme

Ardından, her ürün kategorisine eklenecek doğru yolu belirlemek için uygulamasını kullanacak ProductsByCategoryRoute şekilde güncelleştireceksiniz. Ayrıca ProductList.aspx sayfasını her ürün için yönlendirilmiş bir bağlantı içerecek şekilde güncelleştireceksiniz. Bağlantılar, değişiklik öncesinde olduğu gibi görüntülenir, ancak bağlantılar artık URL yönlendirmeyi kullanır.

Çözüm Gezgini'da, site henüz açık değilse Site.Master sayfasını açın.

İşaretlemenin aşağıdaki gibi görünmesi için "categoryList" adlı ListView denetimini değişiklikler sarı renkle vurgulanmış şekilde güncelleştirin:

<asp:ListView ID="categoryList"  
    ItemType="WingtipToys.Models.Category" 
    runat="server"
    SelectMethod="GetCategories" >
    <ItemTemplate>
        <b style="font-size: large; font-style: normal">
        <a href="<%#: GetRouteUrl("ProductsByCategoryRoute", new {categoryName = Item.CategoryName}) %>">
            <%#: Item.CategoryName %>
        </a>
        </b>
    </ItemTemplate>
    <ItemSeparatorTemplate>  |  </ItemSeparatorTemplate>
</asp:ListView>

Çözüm Gezgini'daProductList.aspx sayfasını açın.

ItemTemplateProductList.aspx sayfasının öğesini güncelleştirmeler sarı renkle vurgulanmış şekilde güncelleştirin; böylece işaretleme aşağıdaki gibi görünür:

<ItemTemplate>
  <td runat="server">
    <table>
      <tr>
        <td>
          <a href="<%#: GetRouteUrl("ProductByNameRoute", new {productName = Item.ProductName}) %>">
            <image src='/Catalog/Images/Thumbs/<%#:Item.ImagePath%>'
              width="100" height="75" border="1" />
          </a>
        </td>
      </tr>
      <tr>
        <td>
          <a href="<%#: GetRouteUrl("ProductByNameRoute", new {productName = Item.ProductName}) %>">
            <%#:Item.ProductName%>
          </a>
          <br />
          <span>
            <b>Price: </b><%#:String.Format("{0:c}", Item.UnitPrice)%>
          </span>
          <br />
          <a href="/AddToCart.aspx?productID=<%#:Item.ProductID %>">
            <span class="ProductListItem">
              <b>Add To Cart<b>
            </span>
          </a>
        </td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table>
    </p>
  </td>
</ItemTemplate>

ProductList.aspx.cs dosyasının arka planındaki kodu açın ve sarı renkle vurgulandığı şekilde aşağıdaki ad alanını ekleyin:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using WingtipToys.Models;
using System.Web.ModelBinding;
using System.Web.Routing;

GetProducts Arka planda kod yöntemini (ProductList.aspx.cs) aşağıdaki kodla değiştirin:

public IQueryable<Product> GetProducts(
    [QueryString("id")] int? categoryId,
    [RouteData] string categoryName)
{
    var _db = new WingtipToys.Models.ProductContext();
    IQueryable<Product> query = _db.Products;

    if (categoryId.HasValue && categoryId > 0)
    {
        query = query.Where(p => p.CategoryID == categoryId);
    }

    if (!String.IsNullOrEmpty(categoryName))
    {
        query = query.Where(p =>
            String.Compare(p.Category.CategoryName,
            categoryName) == 0);
    }
    return query;
}

Ürün Ayrıntıları için Kod Ekleme

Şimdi, yol verilerini kullanmak için ProductDetails.aspx sayfasının arka planındaki kodu ( ProductDetails.aspx.cs ) güncelleştirin. Yeni GetProduct yöntemin, kullanıcının eski kolay olmayan, yönlendirilmemiş URL'yi kullanan bir bağlantının yer işaretine sahip olduğu durum için de bir sorgu dizesi değeri kabul ettiğini unutmayın.

GetProduct Arka planda kod yöntemini (ProductDetails.aspx.cs) aşağıdaki kodla değiştirin:

public IQueryable<Product> GetProduct(
        [QueryString("ProductID")] int? productId,
        [RouteData] string productName)
{
    var _db = new WingtipToys.Models.ProductContext();
    IQueryable<Product> query = _db.Products;
    if (productId.HasValue && productId > 0)
    {
        query = query.Where(p => p.ProductID == productId);
    }
    else if (!String.IsNullOrEmpty(productName))
    {
        query = query.Where(p =>
              String.Compare(p.ProductName, productName) == 0);
    }
    else
    {
        query = null;
    }
    return query;
}

Uygulamayı Çalıştırma

Güncelleştirilmiş yolları görmek için uygulamayı şimdi çalıştırabilirsiniz.

Wingtip Toys örnek uygulamasını çalıştırmak için F5 tuşuna basın.
Tarayıcı açılır ve Default.aspx sayfasını gösterir.
Sayfanın üst kısmındaki Ürünler bağlantısına tıklayın.
Tüm ürünler ProductList.aspx sayfasında görüntülenir. Tarayıcı için aşağıdaki URL (bağlantı noktası numaranızı kullanarak) görüntülenir:
https://localhost:44300/ProductList
Ardından, sayfanın üst kısmındaki Arabalar kategorisi bağlantısına tıklayın.
ProductList.aspx sayfasında yalnızca arabalar görüntülenir. Tarayıcı için aşağıdaki URL (bağlantı noktası numaranızı kullanarak) görüntülenir:
https://localhost:44300/Category/Cars
Ürün ayrıntılarını görüntülemek için sayfada listelenen ilk arabanın adını ("Dönüştürülebilir Araba") içeren bağlantıya tıklayın.
Tarayıcı için aşağıdaki URL (bağlantı noktası numaranızı kullanarak) görüntülenir:
https://localhost:44300/Product/Convertible%20Car
Ardından, tarayıcıya şu yönlendirilmemiş URL'yi (bağlantı noktası numaranızı kullanarak) girin:
https://localhost:44300/ProductDetails.aspx?productID=2
Kod, kullanıcının yer işareti eklenmiş bir bağlantı olması durumunda sorgu dizesi içeren bir URL'yi tanımaya devam eder.

Özet

Bu öğreticide, kategoriler ve ürünler için yollar eklediniz. Yolların model bağlama kullanan veri denetimleriyle nasıl tümleştirilebileceğini öğrendiniz. Sonraki öğreticide genel hata işlemeyi uygulayacaksınız.

Ek Kaynaklar

ASP.NET Kolay URL'ler
Üyelik, OAuth ve SQL Veritabanı içeren güvenli bir ASP.NET Web Forms uygulamasını Azure App Service dağıtma
Microsoft Azure - Ücretsiz Deneme

Önceki Sonraki