ASP.NET Filter Tindakan Kustom MVC 4

Oleh Tim Perkemahan Web

Unduh Kit Pelatihan Kamp Web

ASP.NET MVC menyediakan Filter Tindakan untuk menjalankan logika pemfilteran baik sebelum atau sesudah metode tindakan dipanggil. Filter Tindakan adalah atribut kustom yang menyediakan sarana deklaratif untuk menambahkan perilaku pra-tindakan dan pasca-tindakan ke metode tindakan pengontrol.

Di Lab Langsung ini Anda akan membuat atribut filter tindakan kustom ke dalam solusi MvcMusicStore untuk menangkap permintaan pengontrol dan mencatat aktivitas situs ke dalam tabel database. Anda akan dapat menambahkan filter pengelogan Anda dengan injeksi ke pengontrol atau tindakan apa pun. Terakhir, Anda akan melihat tampilan log yang menunjukkan daftar pengunjung.

Lab Langsung ini mengasumsikan Anda memiliki pengetahuan dasar tentang MVC ASP.NET. Jika Anda belum menggunakan MVC ASP.NET sebelumnya, kami sarankan Anda untuk membahas ASP.NET MVC 4 Fundamentals Hands-on Lab.

Catatan

Semua kode sampel dan cuplikan disertakan dalam Kit Pelatihan Kamp Web, tersedia dari di Rilis Microsoft-Web/WebCampTrainingKit. Proyek khusus untuk lab ini tersedia di ASP.NET Filter Tindakan Kustom MVC 4.

Tujuan

Di Lab Langsung ini, Anda akan mempelajari cara:

• Membuat atribut filter tindakan kustom untuk memperluas kemampuan pemfilteran
• Menerapkan atribut filter kustom dengan injeksi ke tingkat tertentu
• Mendaftarkan filter tindakan kustom secara global

Prasyarat

Anda harus memiliki item berikut untuk menyelesaikan lab ini:

• Microsoft Visual Studio Express 2012 untuk Web atau superior (baca Lampiran A untuk petunjuk tentang cara menginstalnya).

Siapkan

Menginstal Cuplikan Kode

Untuk kenyamanan, banyak kode yang akan Anda kelola di sepanjang lab ini tersedia sebagai cuplikan kode Visual Studio. Untuk menginstal cuplikan kode, jalankan file .\Source\Setup\CodeSnippets.vsi .

Jika Anda tidak terbiasa dengan Cuplikan Visual Studio Code, dan ingin mempelajari cara menggunakannya, Anda dapat merujuk ke lampiran dari dokumen ini "Lampiran C: Menggunakan Cuplikan Kode".

---

Latihan

Lab Langsung ini terdiri dari latihan berikut:

1. Latihan 1: Tindakan pengelogan
2. Latihan 2: Mengelola Beberapa Filter Tindakan

Perkiraan waktu untuk menyelesaikan lab ini: 30 menit.

Catatan

Setiap latihan disertai dengan folder Akhir yang berisi solusi yang dihasilkan yang harus Anda peroleh setelah menyelesaikan latihan. Anda dapat menggunakan solusi ini sebagai panduan jika Anda memerlukan bantuan tambahan untuk mengerjakan latihan.

Latihan 1: Tindakan Pengelogan

Dalam latihan ini, Anda akan mempelajari cara membuat filter log tindakan kustom dengan menggunakan Penyedia Filter MVC 4 ASP.NET. Untuk tujuan itu, Anda akan menerapkan filter pengelogan ke situs MusicStore yang akan merekam semua aktivitas di pengontrol yang dipilih.

Filter akan memperluas ActionFilterAttributeClass dan mengambil alih metode OnActionExecuting untuk menangkap setiap permintaan lalu melakukan tindakan pengelogan. Informasi konteks tentang permintaan HTTP, metode eksekusi, hasil, dan parameter akan disediakan oleh kelas ASP.NET MVC ActionExecutingContext .

Catatan

ASP.NET MVC 4 juga memiliki penyedia filter default yang dapat Anda gunakan tanpa membuat filter kustom. ASP.NET MVC 4 menyediakan jenis filter berikut:

• Filter otorisasi , yang membuat keputusan keamanan tentang apakah akan menjalankan metode tindakan, seperti melakukan autentikasi atau memvalidasi properti permintaan.
• Filter tindakan , yang membungkus eksekusi metode tindakan. Filter ini dapat melakukan pemrosesan tambahan, seperti memberikan data tambahan ke metode tindakan, memeriksa nilai pengembalian, atau membatalkan eksekusi metode tindakan
• Filter hasil , yang membungkus eksekusi objek ActionResult. Filter ini dapat melakukan pemrosesan hasil tambahan, seperti memodifikasi respons HTTP.
• Filter pengecualian , yang dijalankan jika ada pengecualian yang tidak tertangani yang dilemparkan di suatu tempat dalam metode tindakan, dimulai dengan filter otorisasi dan diakhapi dengan eksekusi hasilnya. Filter pengecualian dapat digunakan untuk tugas seperti pengelogan atau menampilkan halaman kesalahan.

Untuk informasi selengkapnya tentang Penyedia Filter, silakan kunjungi tautan MSDN ini: (https://msdn.microsoft.com/library/dd410209.aspx) .

Tentang fitur pengelogan Aplikasi MVC Music Store

Solusi Penyimpanan Musik ini memiliki tabel model data baru untuk pengelogan situs, ActionLog, dengan bidang berikut: Nama pengontrol yang menerima permintaan, Tindakan yang disebut, IP Klien, dan Stempel Waktu.

Model data - Tabel ActionLog

Solusi ini menyediakan Tampilan MVC ASP.NET untuk log Tindakan yang dapat ditemukan di MvcMusicStores/Views/ActionLog:

Tampilan Log Tindakan

Dengan struktur yang diberikan ini, semua pekerjaan akan difokuskan pada mengganggu permintaan pengontrol dan melakukan pengelogan dengan menggunakan pemfilteran kustom.

Tugas 1 - Membuat Filter Kustom untuk Menangkap Permintaan Pengontrol

Dalam tugas ini Anda akan membuat kelas atribut filter kustom yang akan berisi logika pengelogan. Untuk tujuan itu Anda akan memperluas ASP.NET Kelas ActionFilterAttribute MVC dan mengimplementasikan antarmuka IActionFilter.

Catatan

ActionFilterAttribute adalah kelas dasar untuk semua filter atribut. Ini menyediakan metode berikut untuk menjalankan logika tertentu setelah dan sebelum eksekusi tindakan pengontrol:

• OnActionExecuting(ActionExecutingContext filterContext): Tepat sebelum metode tindakan dipanggil.
• OnActionExecuted(ActionExecutedContext filterContext): Setelah metode tindakan dipanggil dan sebelum hasil dijalankan (sebelum tampilan render).
• OnResultExecuting(ResultExecutingContext filterContext): Tepat sebelum hasil dijalankan (sebelum tampilan dirender).
• OnResultExecuted(ResultExecutedContext filterContext): Setelah hasil dijalankan (setelah tampilan dirender).

Dengan mengesampingkan salah satu metode ini ke dalam kelas turunan, Anda dapat menjalankan kode pemfilteran Anda sendiri.

1. Buka folder Mulai solusi yang terletak di \Source\Ex01-LoggingActions\Begin.

   1. Anda harus mengunduh beberapa paket NuGet yang hilang sebelum melanjutkan. Untuk melakukan ini, klik menu Proyek dan pilih Kelola Paket NuGet.

   2. Dalam dialog Kelola Paket NuGet, klik Pulihkan untuk mengunduh paket yang hilang.

   3. Terakhir, bangun solusi dengan mengklik Build | Build Solution.

      Catatan

      Salah satu keuntungan menggunakan NuGet adalah Anda tidak perlu mengirim semua pustaka dalam proyek Anda, mengurangi ukuran proyek. Dengan NuGet Power Tools, dengan menentukan versi paket dalam file Packages.config, Anda akan dapat mengunduh semua pustaka yang diperlukan saat pertama kali menjalankan proyek. Inilah sebabnya mengapa Anda harus menjalankan langkah-langkah ini setelah Anda membuka solusi yang ada dari lab ini.

      Untuk informasi selengkapnya, lihat artikel ini: https://docs.nuget.org/docs/workflows/using-nuget-without-committing-packages.

2. Tambahkan kelas C# baru ke folder Filter dan beri nama CustomActionFilter.cs. Folder ini akan menyimpan semua filter kustom.

3. Buka CustomActionFilter.cs dan tambahkan referensi ke namespace System.Web.Mvc dan MvcMusicStore.Models :

   (Cuplikan Kode - ASP.NET Filter Tindakan Kustom MVC 4 - Ex1-CustomActionFilterNamespaces)

   using System;
   using System.Collections.Generic;
   using System.Linq;
   using System.Web;
   using System.Web.Mvc;
   using MvcMusicStore.Models;
   

4. Warisi kelas CustomActionFilter dari ActionFilterAttribute lalu buat kelas CustomActionFilter menerapkan antarmuka IActionFilter .

   //...
   namespace MvcMusicStore.Filters
   {
       public class CustomActionFilter : ActionFilterAttribute, IActionFilter
       {
           //...
       }
   }
   

5. Buat kelas CustomActionFilter mengambil alih metode OnActionExecuting dan menambahkan logika yang diperlukan untuk mencatat eksekusi filter. Untuk melakukan ini, tambahkan kode yang disorot berikut dalam kelas CustomActionFilter .

   (Cuplikan Kode - ASP.NET Filter Tindakan Kustom MVC 4 - Ex1-LoggingActions)

   public class CustomActionFilter : ActionFilterAttribute, IActionFilter
   {
       void IActionFilter.OnActionExecuting(ActionExecutingContext filterContext)
       {
           // TODO: Add your action filter's tasks here
   
           // Log Action Filter call
           using (MusicStoreEntities storeDb = new MusicStoreEntities())
           {
               ActionLog log = new ActionLog()
               {
                   Controller = filterContext.ActionDescriptor.ControllerDescriptor.ControllerName,
                   Action = string.Concat(filterContext.ActionDescriptor.ActionName, " (Logged By: Custom Action Filter)"),
                   IP = filterContext.HttpContext.Request.UserHostAddress,
                   DateTime = filterContext.HttpContext.Timestamp
               };
               storeDb.ActionLogs.Add(log);
               storeDb.SaveChanges();
               OnActionExecuting(filterContext);
           }
       }
   }
   

   Catatan

   Metode OnActionExecuting menggunakan Kerangka Kerja Entitas untuk menambahkan register ActionLog baru. Ini membuat dan mengisi instans entitas baru dengan informasi konteks dari filterContext.

   Anda dapat membaca lebih lanjut tentang kelas ControllerContext di msdn.

Tugas 2 - Menyuntikkan Pencegat Kode ke Kelas Pengontrol Toko

Dalam tugas ini Anda akan menambahkan filter kustom dengan menyuntikkannya ke semua kelas pengontrol dan tindakan pengontrol yang akan dicatat. Untuk tujuan latihan ini, kelas Pengontrol Toko akan memiliki log.

Metode OnActionExecuting dari filter kustom ActionLogFilterAttribute berjalan saat elemen yang disuntikkan dipanggil.

Dimungkinkan juga untuk mencegat metode pengontrol tertentu.

1. Buka StoreController di MvcMusicStore\Controllers dan tambahkan referensi ke namespace filter:

   using System.Linq;
   using System.Web.Mvc;
   using MvcMusicStore.Models;
   using MvcMusicStore.Filters;
   

2. Masukkan filter kustom CustomActionFilter ke kelas StoreController dengan menambahkan atribut [CustomActionFilter] sebelum deklarasi kelas.

   ...
   [CustomActionFilter]
   public class StoreController : Controller
   {
       ...
   }
   

   Catatan

   Ketika filter disuntikkan ke kelas pengontrol, semua tindakannya juga disuntikkan. Jika Anda ingin menerapkan filter hanya untuk serangkaian tindakan, Anda harus menyuntikkan [CustomActionFilter] ke masing-masing tindakan:

   [CustomActionFilter]
   public ActionResult Index()
   {
     ...
   }
   
   [CustomActionFilter]
   public ActionResult Browse(string genre)
   {
     ...
   }
   

Tugas 3 - Menjalankan Aplikasi

Dalam tugas ini, Anda akan menguji bahwa filter pengelogan berfungsi. Anda akan memulai aplikasi dan mengunjungi toko, dan kemudian Anda akan memeriksa aktivitas yang dicatat.

1. Tekan F5 untuk menjalankan aplikasi.

2. Telusuri ke /ActionLog untuk melihat status awal tampilan log:

   

   Status pelacak log sebelum aktivitas halaman

   Catatan

   Secara default, ini akan selalu menampilkan satu item yang dihasilkan saat mengambil genre yang ada untuk menu.

   Untuk tujuan kesederhanaan, kami membersihkan tabel ActionLog setiap kali aplikasi berjalan sehingga hanya akan menampilkan log verifikasi setiap tugas tertentu.

   Anda mungkin perlu menghapus kode berikut dari metode Session_Start (di kelas Global.asax ), untuk menyimpan log historis untuk semua tindakan yang dijalankan dalam Pengontrol Toko.

   // Clean up Logs Table
   MusicStoreEntities storeDB = new MusicStoreEntities();
   foreach (var log in 
   
   storeDB.ActionLogs.ToList())
   {
      storeDB.ActionLogs.Remove(log);
   }
   
   storeDB.SaveChanges();
   

3. Klik salah satu Genre dari menu dan lakukan beberapa tindakan di sana, seperti menelusuri album yang tersedia.

4. Telusuri ke /ActionLog dan jika log kosong tekan F5 untuk me-refresh halaman. Periksa apakah kunjungan Anda dilacak:

   

   Log tindakan dengan aktivitas yang dicatat

Latihan 2: Mengelola Beberapa Filter Tindakan

Dalam latihan ini Anda akan menambahkan Filter Tindakan Kustom kedua ke kelas StoreController dan menentukan urutan tertentu di mana kedua filter akan dijalankan. Kemudian Anda akan memperbarui kode untuk mendaftarkan filter Secara Global.

Ada berbagai opsi untuk diperhitungkan saat menentukan urutan eksekusi Filter. Misalnya, properti Pesanan dan cakupan Filter:

Anda dapat menentukan Cakupan untuk setiap Filter, misalnya, Anda dapat mencakup semua Filter Tindakan untuk dijalankan dalam Cakupan Pengontrol, dan semua Filter Otorisasi untuk dijalankan dalam cakupan Global. Cakupan memiliki urutan eksekusi yang ditentukan.

Selain itu, setiap filter tindakan memiliki properti Pesanan yang digunakan untuk menentukan urutan eksekusi dalam cakupan filter.

Untuk informasi selengkapnya tentang urutan eksekusi Filter Tindakan Kustom, silakan kunjungi artikel MSDN ini: (https://msdn.microsoft.com/library/dd381609(v=vs.98).aspx).

Tugas 1: Membuat Filter Tindakan Kustom baru

Dalam tugas ini, Anda akan membuat Filter Tindakan Kustom baru untuk dimasukkan ke kelas StoreController, mempelajari cara mengelola urutan eksekusi filter.

1. Buka folder Mulai solusi yang terletak di \Source\Ex02-ManagingMultipleActionFilters\Begin. Jika tidak, Anda mungkin terus menggunakan solusi Akhir yang diperoleh dengan menyelesaikan latihan sebelumnya.

   1. Jika Anda membuka solusi Mulai yang disediakan, Anda harus mengunduh beberapa paket NuGet yang hilang sebelum melanjutkan. Untuk melakukan ini, klik menu Proyek dan pilih Kelola Paket NuGet.

   2. Dalam dialog Kelola Paket NuGet, klik Pulihkan untuk mengunduh paket yang hilang.

   3. Terakhir, bangun solusi dengan mengklik Build | Build Solution.

      Catatan

      Salah satu keuntungan menggunakan NuGet adalah Anda tidak perlu mengirim semua pustaka dalam proyek Anda, mengurangi ukuran proyek. Dengan NuGet Power Tools, dengan menentukan versi paket dalam file Packages.config, Anda akan dapat mengunduh semua pustaka yang diperlukan saat pertama kali menjalankan proyek. Inilah sebabnya mengapa Anda harus menjalankan langkah-langkah ini setelah Anda membuka solusi yang ada dari lab ini.

      Untuk informasi selengkapnya, lihat artikel ini: https://docs.nuget.org/docs/workflows/using-nuget-without-committing-packages.

2. Tambahkan kelas C# baru ke folder Filter dan beri nama MyNewCustomActionFilter.cs

3. Buka MyNewCustomActionFilter.cs dan tambahkan referensi ke System.Web.Mvc dan namespace layanan MvcMusicStore.Models :

   (Cuplikan Kode - ASP.NET Filter Tindakan Kustom MVC 4 - Ex2-MyNewCustomActionFilterNamespaces)

   using System;
   using System.Collections.Generic;
   using System.Linq;
   using System.Web;
   using System.Web.Mvc;
   using MvcMusicStore.Models;
   

4. Ganti deklarasi kelas default dengan kode berikut.

   (Cuplikan Kode - ASP.NET Filter Tindakan Kustom MVC 4 - Ex2-MyNewCustomActionFilterClass)

   public class MyNewCustomActionFilter : ActionFilterAttribute, IActionFilter
   {
     void IActionFilter.OnActionExecuting(ActionExecutingContext filterContext)
   
     {
           // TODO: Add your acction filter's tasks here
   
           // Log Action Filter Call
           MusicStoreEntities storeDB = new MusicStoreEntities();
   
           ActionLog log = new ActionLog()
           {
                Controller = filterContext.ActionDescriptor.ControllerDescriptor.ControllerName,
                Action = filterContext.ActionDescriptor.ActionName + " (Logged By: 
   
   MyNewCustomActionFilter)",
                IP = filterContext.HttpContext.Request.UserHostAddress,
                DateTime = filterContext.HttpContext.Timestamp
           };
   
           storeDB.ActionLogs.Add(log);
           storeDB.SaveChanges();
   
           this.OnActionExecuting(filterContext);
     }
   }
   

   Catatan

   Filter Tindakan Kustom ini hampir sama dengan yang Anda buat di latihan sebelumnya. Perbedaan utamanya adalah atribut "Logged By" diperbarui dengan nama kelas baru ini untuk mengidentifikasi filter mana yang mendaftarkan log.

Tugas 2: Menyuntikkan Pencegat Kode baru ke Kelas StoreController

Dalam tugas ini, Anda akan menambahkan filter kustom baru ke Kelas StoreController dan menjalankan solusi untuk memverifikasi bagaimana kedua filter bekerja sama.

1. Buka kelas StoreController yang terletak di MvcMusicStore\Controllers dan masukkan filter kustom baru MyNewCustomActionFilter ke kelas StoreController seperti yang ditunjukkan dalam kode berikut.

   [MyNewCustomActionFilter]
   [CustomActionFilter]
   public class StoreController : Controller
   {
   ...
   }
   

2. Sekarang, jalankan aplikasi untuk melihat cara kerja dua Filter Tindakan Kustom ini. Untuk melakukan ini, tekan F5 dan tunggu hingga aplikasi dimulai.

3. Telusuri ke /ActionLog untuk melihat status awal tampilan log.

   

   Status pelacak log sebelum aktivitas halaman

4. Klik salah satu Genre dari menu dan lakukan beberapa tindakan di sana, seperti menelusuri album yang tersedia.

5. Periksa apakah kali ini; kunjungan Anda dilacak dua kali: sekali untuk setiap Filter Tindakan Kustom yang Anda tambahkan di kelas StorageController .

   

   Log tindakan dengan aktivitas yang dicatat

6. Tutup browser.

Tugas 3: Mengelola Urutan Filter

Dalam tugas ini, Anda akan mempelajari cara mengelola urutan eksekusi filter dengan menggunakan properti Pesanan.

1. Buka kelas StoreController yang terletak di MvcMusicStore\Controllers dan tentukan properti Pesanan di kedua filter seperti yang ditunjukkan di bawah ini.

   [MyNewCustomActionFilter(Order = 2)]
   [CustomActionFilter(Order = 1)]
   public class StoreController : Controller
   {
   ...
   }
   

2. Sekarang, verifikasi bagaimana filter dijalankan tergantung pada nilai properti Pesanannya. Anda akan menemukan bahwa filter dengan nilai Pesanan terkecil (CustomActionFilter) adalah filter pertama yang dijalankan. Tekan F5 dan tunggu hingga aplikasi dimulai.

3. Telusuri ke /ActionLog untuk melihat status awal tampilan log.

   

   Status pelacak log sebelum aktivitas halaman

4. Klik salah satu Genre dari menu dan lakukan beberapa tindakan di sana, seperti menelusuri album yang tersedia.

5. Periksa apakah kali ini, kunjungan Anda dilacak diurutkan oleh nilai Pesanan filter: CustomActionFilter logs' terlebih dahulu.

   

   Log tindakan dengan aktivitas yang dicatat

6. Sekarang, Anda akan memperbarui nilai pesanan Filter dan memverifikasi bagaimana urutan pengelogan berubah. Di kelas StoreController, perbarui nilai Pesanan Filter seperti yang ditunjukkan di bawah ini.

   [MyNewCustomActionFilter(Order = 1)]
   [CustomActionFilter(Order = 2)]
   public class StoreController : Controller
   {
   ...
   }
   

7. Jalankan aplikasi lagi dengan menekan F5.

8. Klik salah satu Genre dari menu dan lakukan beberapa tindakan di sana, seperti menelusuri album yang tersedia.

9. Periksa apakah kali ini, log yang dibuat oleh filter MyNewCustomActionFilter muncul terlebih dahulu.

   

   Log tindakan dengan aktivitas yang dicatat

Tugas 4: Mendaftarkan Filter Secara Global

Dalam tugas ini, Anda akan memperbarui solusi untuk mendaftarkan filter baru (MyNewCustomActionFilter) sebagai filter global. Dengan melakukan ini, itu akan dipicu oleh semua tindakan yang dilakukan dalam aplikasi dan tidak hanya di StoreController seperti pada tugas sebelumnya.

1. Di kelas StoreController , hapus atribut [MyNewCustomActionFilter] dan properti pesanan dari [CustomActionFilter]. Seharusnya terlihat seperti berikut:

   [CustomActionFilter]
   public class StoreController : Controller
   {
   ...
   }
   

2. Buka file Global.asax dan temukan metode Application_Start . Perhatikan bahwa setiap kali aplikasi dimulai, aplikasi mendaftarkan filter global dengan memanggil metode RegisterGlobalFilters dalam kelas FilterConfig .

   

   Mendaftarkan Filter Global di Global.asax

3. Buka file FilterConfig.cs dalam folder App_Start .

4. Tambahkan referensi ke menggunakan System.Web.Mvc; menggunakan MvcMusicStore.Filters; namespace layanan.

   using System.Web.Mvc;
   using MvcMusicStore.Filters;
   

5. Perbarui metode RegisterGlobalFilters yang menambahkan filter kustom Anda. Untuk melakukan ini, tambahkan kode yang disorot:

   public static void RegisterGlobalFilters(GlobalFilterCollection filters)
   {
       filters.Add(new HandleErrorAttribute());
       filters.Add(new MyNewCustomActionFilter());
   }
   

6. Jalankan aplikasi dengan menekan F5.

7. Klik salah satu Genre dari menu dan lakukan beberapa tindakan di sana, seperti menelusuri album yang tersedia.

8. Periksa apakah sekarang [MyNewCustomActionFilter] sedang disuntikkan di HomeController dan ActionLogController juga.

   

   Log tindakan dengan aktivitas global yang dicatat

Catatan

Selain itu, Anda dapat menyebarkan aplikasi ini ke Windows Azure Web Sites setelah Lampiran B: Menerbitkan aplikasi MVC 4 ASP.NET menggunakan Web Deploy.

---

Ringkasan

Dengan menyelesaikan Lab Langsung ini, Anda telah mempelajari cara memperluas filter tindakan untuk menjalankan tindakan kustom. Anda juga telah mempelajari cara menyuntikkan filter apa pun ke pengontrol halaman Anda. Konsep berikut digunakan:

• Cara membuat filter Tindakan Kustom dengan kelas ASP.NET MVC ActionFilterAttribute
• Cara menyuntikkan filter ke pengontrol MVC ASP.NET
• Cara mengelola pemesanan filter menggunakan properti Pesanan
• Cara mendaftarkan filter secara global

Lampiran A: Menginstal Visual Studio Express 2012 untuk Web

Anda dapat menginstal Microsoft Visual Studio Express 2012 untuk Web atau versi "Ekspres" lainnya menggunakan Microsoft Web Platform Installer. Instruksi berikut memandu Anda melalui langkah-langkah yang diperlukan untuk menginstal Visual studio Express 2012 untuk Web menggunakan Microsoft Web Platform Installer.

1. Buka /iis/extensions/introduction-to-iis-express/iis-express-overview?linkid=9810169. Atau, jika Anda sudah menginstal Penginstal Platform Web, Anda dapat membukanya dan mencari produk "Visual Studio Express 2012 untuk Web dengan Windows Azure SDK".

2. Klik Instal Sekarang. Jika Anda tidak memiliki Penginstal Platform Web, Anda akan diarahkan untuk mengunduh dan menginstalnya terlebih dahulu.

3. Setelah Penginstal Platform Web terbuka, klik Instal untuk memulai penyiapan.

   

   Menginstal Visual Studio Express

4. Baca semua lisensi dan ketentuan produk dan klik Saya Terima untuk melanjutkan.

   

   Menerima persyaratan lisensi

5. Tunggu hingga proses pengunduhan dan penginstalan selesai.

   

   Kemajuan penginstalan

6. Setelah penginstalan selesai, klik Selesai.

   

   Penginstalan selesai

7. Klik Keluar untuk menutup Penginstal Platform Web.

8. Untuk membuka Visual Studio Express for Web, buka layar Mulai dan mulai menulis "VS Express", lalu klik petak VS Express untuk Web .

   

   Vs Express untuk petak web

Lampiran B: Menerbitkan Aplikasi MVC 4 ASP.NET menggunakan Web Deploy

Lampiran ini akan menunjukkan kepada Anda cara membuat situs web baru dari Portal Manajemen Windows Azure dan menerbitkan aplikasi yang Anda peroleh dengan mengikuti lab, memanfaatkan fitur penerbitan Web Deploy yang disediakan oleh Windows Azure.

Tugas 1 - Membuat Situs Web Baru dari Portal Windows Azure

1. Buka Portal Manajemen Windows Azure dan masuk menggunakan kredensial Microsoft yang terkait dengan langganan Anda.

   Catatan

   Dengan Windows Azure, Anda dapat menghosting 10 ASP.NET Situs Web secara gratis lalu menskalakan seiring pertumbuhan lalu lintas Anda. Anda dapat mendaftar di sini.

   

   Masuk ke Portal Manajemen Windows Azure

2. Klik Baru pada bilah perintah.

   

   Membuat Situs Web baru

3. Klik Situs Web Komputasi. | Lalu pilih opsi Buat Cepat. Sediakan URL yang tersedia untuk situs web baru dan klik Buat Situs Web.

   Catatan

   Situs Web Windows Azure adalah host untuk aplikasi web yang berjalan di cloud yang dapat Anda kontrol dan kelola. Opsi Buat Cepat memungkinkan Anda menyebarkan aplikasi web yang telah selesai ke Situs Web Windows Azure dari luar portal. Ini tidak termasuk langkah-langkah untuk menyiapkan database.

   

   Membuat Situs Web baru menggunakan Buat Cepat

4. Tunggu hingga Situs Web baru dibuat.

5. Setelah Situs Web dibuat, klik tautan di bawah kolom URL . Periksa apakah Situs Web baru berfungsi.

   

   Menelusuri ke situs web baru

   

   Situs web berjalan

6. Kembali ke portal dan klik nama situs web di bawah kolom Nama untuk menampilkan halaman manajemen.

   

   Membuka halaman manajemen Situs Web

7. Di halaman Dasbor , di bawah bagian sekilas , klik tautan Unduh profil terbitkan.

   Catatan

   Profil penerbitan berisi semua informasi yang diperlukan untuk menerbitkan aplikasi web ke situs web Windows Azure untuk setiap metode publikasi yang diaktifkan. Profil penerbitan berisi URL, kredensial pengguna, dan string database yang diperlukan untuk menyambungkan dan mengautentikasi terhadap setiap titik akhir tempat metode publikasi diaktifkan. Microsoft WebMatrix 2, Microsoft Visual Studio Express untuk Web dan Dukungan Microsoft Visual Studio 2012 membaca profil penerbitan untuk mengotomatiskan konfigurasi program ini untuk menerbitkan aplikasi web ke situs web Windows Azure.

   

   Mengunduh profil penerbitan Situs Web

8. Unduh file profil publikasi ke lokasi yang diketahui. Selanjutnya dalam latihan ini Anda akan melihat cara menggunakan file ini untuk menerbitkan aplikasi web ke Windows Azure Web Sites dari Visual Studio.

   

   Menyimpan file profil publikasi

Tugas 2 - Mengonfigurasi Server Database

Jika aplikasi Anda menggunakan database SQL Server, Anda harus membuat server SQL Database. Jika Anda ingin menyebarkan aplikasi sederhana yang tidak menggunakan SQL Server, Anda mungkin melewati tugas ini.

1. Anda akan memerlukan server SQL Database untuk menyimpan database aplikasi. Anda dapat melihat server SQL Database dari langganan Anda di portal Manajemen Windows Azure di Dasbor | | Server Server Sql Database. Jika Anda tidak memiliki server yang dibuat, Anda dapat membuatnya menggunakan tombol Tambahkan pada bilah perintah. Perhatikan nama server dan URL, nama masuk administrator dan kata sandi, karena Anda akan menggunakannya dalam tugas berikutnya. Jangan membuat database, karena akan dibuat di tahap selanjutnya.

   

   Dasbor SQL Database Server

2. Dalam tugas berikutnya Anda akan menguji koneksi database dari Visual Studio, karena alasan itu Anda perlu menyertakan alamat IP lokal Anda dalam daftar Alamat IP yang Diizinkan di server. Untuk melakukannya, klik Konfigurasikan, pilih alamat IP dari Alamat IP Klien Saat Ini dan tempelkan pada kotak teks Alamat IP Mulai dan Alamat IP Akhir dan klik tombol .

   

   Menambahkan Alamat IP Klien

3. Setelah Alamat IP Klien ditambahkan ke daftar alamat IP yang diizinkan, klik Simpan untuk mengonfirmasi perubahan.

   

   Konfirmasi Perubahan

Tugas 3 - Menerbitkan Aplikasi MVC 4 ASP.NET menggunakan Web Deploy

1. Kembali ke solusi MVC 4 ASP.NET. Di Penjelajah Solusi, klik kanan proyek situs web dan pilih Terbitkan.

   

   Menerbitkan situs web

2. Impor profil penerbitan yang Anda simpan di tugas pertama.

   

   Mengimpor profil penerbitan

3. Klik Validasi Koneksi. Setelah Validasi selesai, klik Berikutnya.

   Catatan

   Validasi selesai setelah Anda melihat tanda centang hijau muncul di samping tombol Validasi Koneksi.

   

   Memvalidasi koneksi

4. Di halaman Pengaturan , di bawah bagian Database , klik tombol di samping kotak teks koneksi database Anda (yaitu DefaultConnection).

   

   Konfigurasi penyebaran web

5. Konfigurasikan koneksi database sebagai berikut:

   • Di nama Server ketik URL server SQL Database Anda menggunakan awalan tcp: .

   • Di Nama pengguna ketik nama masuk administrator server Anda.

   • Di Kata Sandi ketik kata sandi masuk administrator server Anda.

   • Ketik nama database baru.

     

     Mengonfigurasi string koneksi tujuan

6. Lalu klik OK. Ketika diminta untuk membuat database, klik Ya.

   

   Membuat database

7. string koneksi yang akan Anda gunakan untuk menyambungkan ke SQL Database di Windows Azure ditampilkan dalam kotak teks Koneksi Default. Lalu, klik Berikutnya.

   

   String koneksi menunjuk ke SQL Database

8. Di halaman Pratinjau , klik Terbitkan.

   

   Menerbitkan aplikasi web

9. Setelah proses penerbitan selesai, browser default Anda akan membuka situs web yang diterbitkan.

Lampiran C: Menggunakan Cuplikan Kode

Dengan cuplikan kode, Anda memiliki semua kode yang Anda butuhkan di ujung jari Anda. Dokumen lab akan memberi tahu Anda kapan tepatnya Anda dapat menggunakannya, seperti yang ditunjukkan pada gambar berikut.

Menggunakan cuplikan kode Visual Studio untuk menyisipkan kode ke dalam proyek Anda

Untuk menambahkan cuplikan kode menggunakan keyboard (hanya C#)

1. Tempatkan kursor tempat Anda ingin menyisipkan kode.
2. Mulai ketik nama cuplikan (tanpa spasi atau tanda hubung).
3. Tonton saat IntelliSense menampilkan nama cuplikan yang cocok.
4. Pilih cuplikan yang benar (atau terus ketik hingga seluruh nama cuplikan dipilih).
5. Tekan tombol Tab dua kali untuk menyisipkan cuplikan di lokasi kursor.

Mulai ketik nama cuplikan

Tekan Tab untuk memilih cuplikan yang disorot

Tekan Tab lagi dan cuplikan akan diperluas

Untuk menambahkan cuplikan kode menggunakan mouse (C#, Visual Basic dan XML) 1. Klik kanan tempat Anda ingin menyisipkan cuplikan kode.

1. Pilih Sisipkan Cuplikan diikuti dengan Cuplikan Kode Saya.
2. Pilih cuplikan yang relevan dari daftar, dengan mengkliknya.

Klik kanan tempat Anda ingin menyisipkan cuplikan kode dan pilih Sisipkan Cuplikan

Pilih cuplikan yang relevan dari daftar, dengan mengkliknya