Bagian 4: Model dan Akses Data

oleh Jon Galloway

MVC Music Store adalah aplikasi tutorial yang memperkenalkan dan menjelaskan langkah demi langkah cara menggunakan ASP.NET MVC dan Visual Studio untuk pengembangan web.

MVC Music Store adalah implementasi penyimpanan sampel ringan yang menjual album musik secara online, dan mengimplementasikan administrasi situs dasar, rincian masuk pengguna, dan fungsionalitas kedai belanja.

Seri tutorial ini merinci semua langkah yang diambil untuk membangun aplikasi sampel MVC Music Store ASP.NET. Bagian 4 mencakup Model dan Akses Data.

Sejauh ini, kami baru saja meneruskan "data dummy" dari Pengontrol ke templat Tampilan kami. Sekarang kita siap untuk menghubungkan database nyata. Dalam tutorial ini kita akan membahas cara menggunakan SQL Server Compact Edition (sering disebut SQL CE) sebagai mesin database kita. SQL CE adalah database berbasis file gratis, tersemat, yang tidak memerlukan penginstalan atau konfigurasi apa pun, yang membuatnya sangat nyaman untuk pengembangan lokal.

Akses database dengan entity framework Code-First

Kami akan menggunakan dukungan Entity Framework (EF) yang disertakan dalam proyek ASP.NET MVC 3 untuk mengkueri dan memperbarui database. EF adalah API data pemetaan relasional objek fleksibel (ORM) yang memungkinkan pengembang untuk mengkueri dan memperbarui data yang disimpan dalam database dengan cara berorientasi objek.

Entity Framework versi 4 mendukung paradigma pengembangan yang disebut code-first. Code-first memungkinkan Anda membuat objek model dengan menulis kelas sederhana (juga dikenal sebagai POCO dari objek CLR "plain-old"), dan bahkan dapat membuat database dengan cepat dari kelas Anda.

Perubahan pada Kelas Model kami

Kami akan memanfaatkan fitur pembuatan database dalam Kerangka Kerja Entitas dalam tutorial ini. Namun, sebelum kita melakukannya, mari kita buat beberapa perubahan kecil pada kelas model kita untuk menambahkan beberapa hal yang akan kita gunakan nanti.

Menambahkan Kelas Model Artis

Album kami akan dikaitkan dengan Artis, jadi kami akan menambahkan kelas model sederhana untuk menggambarkan Artis. Tambahkan kelas baru ke folder Model bernama Artist.cs menggunakan kode yang ditunjukkan di bawah ini.

namespace MvcMusicStore.Models
{
    public class Artist
    {
        public int ArtistId { get; set; }
        public string Name { get; set; }
    }
}

Memperbarui Kelas Model kami

Perbarui kelas Album seperti yang ditunjukkan di bawah ini.

namespace MvcMusicStore.Models
{
    public class Album
    {
        public int      AlbumId     { get; set; }
        public int      GenreId     { get; set; }
        public int      ArtistId    { get; set; }
        public string   Title       { get; set; }
        public decimal  Price       { get; set; }
        public string   AlbumArtUrl { get; set; }
        public Genre    Genre       { get; set; }
        public Artist   Artist      { get; set; }
    }
}

Selanjutnya, buat pembaruan berikut ke kelas Genre.

using System.Collections.Generic;
 
namespace MvcMusicStore.Models
{
    public partial class Genre
    {
        public int      GenreId     { get; set; }
        public string   Name        { get; set; }
        public string   Description { get; set; }
        public List<Album> Albums   { get; set; }
    }
}

Menambahkan folder App_Data

Kami akan menambahkan direktori App_Data ke proyek kami untuk menyimpan file database SQL Server Express kami. App_Data adalah direktori khusus di ASP.NET yang sudah memiliki izin akses keamanan yang benar untuk akses database. Dari menu Proyek, pilih Tambahkan Folder ASP.NET, lalu App_Data.

Membuat String Koneksi dalam file web.config

Kami akan menambahkan beberapa baris ke file konfigurasi situs web sehingga Entity Framework tahu cara menyambungkan ke database kami. Klik dua kali pada file Web.config yang terletak di akar proyek.

Gulir ke bagian bawah file ini dan tambahkan <bagian connectionStrings> tepat di atas baris terakhir, seperti yang ditunjukkan di bawah ini.

<connectionStrings>
    <add name="MusicStoreEntities"
     connectionString="Data Source=|DataDirectory|MvcMusicStore.sdf"
     providerName="System.Data.SqlServerCe.4.0"/>
  </connectionStrings>  
</configuration>

Menambahkan Kelas Konteks

Klik kanan folder Model dan tambahkan kelas baru bernama MusicStoreEntities.cs.

Kelas ini akan mewakili konteks database Entity Framework, dan akan menangani operasi buat, baca, perbarui, dan hapus untuk kami. Kode untuk kelas ini ditunjukkan di bawah ini.

using System.Data.Entity;
 
namespace MvcMusicStore.Models
{
    public class MusicStoreEntities : DbContext
    {
        public DbSet<Album> Albums { get; set; }
        public DbSet<Genre> Genres { get; set; }
    }
}

Itu saja - tidak ada konfigurasi lain, antarmuka khusus, dll. Dengan memperluas kelas dasar DbContext, kelas MusicStoreEntities kami dapat menangani operasi database kami untuk kami. Sekarang setelah kita mendapatkan yang terhubung, mari kita tambahkan beberapa properti lagi ke kelas model kita untuk memanfaatkan beberapa informasi tambahan dalam database kita.

Menambahkan data katalog penyimpanan kami

Kami akan memanfaatkan fitur dalam Entity Framework yang menambahkan data "seed" ke database yang baru dibuat. Ini akan mengisi katalog toko kami sebelumnya dengan daftar Genre, Artis, dan Album. Unduhan MvcMusicStore-Assets.zip - yang mencakup file desain situs kami yang digunakan sebelumnya dalam tutorial ini - memiliki file kelas dengan data seed ini, yang terletak di folder bernama Code.

Dalam folder Kode / Model, temukan file SampleData.cs dan letakkan ke folder Model di proyek kami, seperti yang ditunjukkan di bawah ini.

Sekarang kita perlu menambahkan satu baris kode untuk memberi tahu Entity Framework tentang kelas SampleData tersebut. Klik dua kali pada file Global.asax di akar proyek untuk membukanya dan tambahkan baris berikut ke bagian atas metode Application_Start.

protected void Application_Start()
{
    System.Data.Entity.Database.SetInitializer(
    new MvcMusicStore.Models.SampleData());
    AreaRegistration.RegisterAllAreas();
    RegisterGlobalFilters(GlobalFilters.Filters);
    RegisterRoutes(RouteTable.Routes);
 }

Pada titik ini, kami telah menyelesaikan pekerjaan yang diperlukan untuk mengonfigurasi Kerangka Kerja Entitas untuk proyek kami.

Mengkueri Database

Sekarang mari kita perbarui StoreController kita sehingga alih-alih menggunakan "data dummy" itu memanggil ke database kita untuk mengkueri semua informasinya. Kita akan mulai dengan mendeklarasikan bidang di StoreController untuk menyimpan instans kelas MusicStoreEntities, bernama storeDB:

public class StoreController : Controller
{
    MusicStoreEntities storeDB = new MusicStoreEntities();

Memperbarui Indeks Penyimpanan untuk mengkueri database

Kelas MusicStoreEntities dikelola oleh Kerangka Kerja Entitas dan mengekspos properti koleksi untuk setiap tabel dalam database kami. Mari kita perbarui tindakan Indeks StoreController untuk mengambil semua Genre dalam database kita. Sebelumnya kami melakukan ini dengan data string hard-coding. Sekarang kita hanya dapat menggunakan kumpulan Generes konteks Kerangka Kerja Entitas:

public ActionResult Index()
{
    var genres = storeDB.Genres.ToList();
    return View(genres);
 }

Tidak ada perubahan yang perlu terjadi pada templat Tampilan kami karena kami masih mengembalikan StoreIndexViewModel yang sama yang kami kembalikan sebelumnya - kami hanya mengembalikan data langsung dari database kami sekarang.

Ketika kita menjalankan proyek lagi dan mengunjungi URL "/Store", kita sekarang akan melihat daftar semua Genre dalam database kita:

Memperbarui Penelusuran dan Detail Penyimpanan untuk menggunakan data langsung

Dengan metode tindakan /Store/Browse?genre=[some-genre] , kami mencari Genre berdasarkan nama. Kita hanya mengharapkan satu hasil, karena kita seharusnya tidak pernah memiliki dua entri untuk nama Genre yang sama, sehingga kita dapat menggunakan . Ekstensi Single() di LINQ untuk mengkueri objek Genre yang sesuai seperti ini (jangan ketik ini belum):

var example = storeDB.Genres.Single(g => g.Name == "Disco");

Metode Tunggal mengambil ekspresi Lambda sebagai parameter, yang menentukan bahwa kita menginginkan satu objek Genre sehingga namanya cocok dengan nilai yang telah kita tentukan. Dalam kasus di atas, kami memuat satu objek Genre dengan nilai Nama yang cocok dengan Disko.

Kami akan memanfaatkan fitur Kerangka Kerja Entitas yang memungkinkan kami menunjukkan entitas terkait lainnya yang ingin kami muat juga ketika objek Genre diambil. Fitur ini disebut Pembentukan Hasil Kueri, dan memungkinkan kita mengurangi berapa kali kita perlu mengakses database untuk mengambil semua informasi yang kita butuhkan. Kami ingin mengambil Album untuk Genre sebelumnya yang kami ambil, jadi kami akan memperbarui kueri untuk disertakan dari Genres.Include("Albums") untuk menunjukkan bahwa kami ingin album terkait juga. Ini lebih efisien, karena akan mengambil data Genre dan Album kami dalam satu permintaan database.

Dengan penjelasan di luar cara, berikut adalah tampilan tindakan Telusuri pengontrol Penelusuran kami yang diperbarui:

public ActionResult Browse(string genre)
{
    // Retrieve Genre and its Associated Albums from database
    var genreModel = storeDB.Genres.Include("Albums")
        .Single(g => g.Name == genre);

    return View(genreModel);
}

Kami sekarang dapat memperbarui Tampilan Telusuri Toko untuk menampilkan album yang tersedia di setiap Genre. Buka templat tampilan (ditemukan di /Views/Store/Browse.cshtml) dan tambahkan daftar berpoin Album seperti yang ditunjukkan di bawah ini.

@model MvcMusicStore.Models.Genre
@{
    ViewBag.Title = "Browse";
}
<h2>Browsing Genre: @Model.Name</h2>
<ul>
    @foreach (var album in Model.Albums)
    {
        <li>
            @album.Title
        </li>
    }
</ul>

Menjalankan aplikasi kami dan menelusuri ke /Store/Browse?genre=Jazz menunjukkan bahwa hasil kami sekarang sedang ditarik dari database, menampilkan semua album di Genre yang kami pilih.

Kami akan membuat perubahan yang sama pada URL /Store/Details/[id], dan mengganti data dummy kami dengan kueri database yang memuat Album yang ID-nya cocok dengan nilai parameter.

public ActionResult Details(int id)
{
    var album = storeDB.Albums.Find(id);
 
    return View(album);
}

Menjalankan aplikasi kami dan menelusuri ke /Store/Details/1 menunjukkan bahwa hasil kami sekarang sedang ditarik dari database.

Sekarang setelah halaman Detail Toko kami disiapkan untuk menampilkan album dengan ID Album, mari kita perbarui tampilan Telusuri untuk menautkan ke tampilan Detail. Kami akan menggunakan Html.ActionLink, persis seperti yang kami lakukan untuk menautkan dari Indeks Penyimpanan ke Telusuri Penyimpanan di akhir bagian sebelumnya. Sumber lengkap untuk tampilan Telusuri muncul di bawah ini.

@model MvcMusicStore.Models.Genre
@{
    ViewBag.Title = "Browse";
}
<h2>Browsing Genre: @Model.Name</h2>
<ul>
    @foreach (var album in Model.Albums)
    {
        <li>
            @Html.ActionLink(album.Title,
"Details", new { id = album.AlbumId })
        </li>
    }
</ul>

Kami sekarang dapat menelusuri dari halaman Toko kami ke halaman Genre, yang mencantumkan album yang tersedia, dan dengan mengklik album, kami dapat melihat detail untuk album tersebut.

SebelumnyaBerikutnya