{"id":1137,"date":"2014-03-27T04:32:37","date_gmt":"2014-03-27T04:32:37","guid":{"rendered":"http:\/\/www.rezafaisal.net\/?p=1137"},"modified":"2014-04-06T12:57:27","modified_gmt":"2014-04-06T12:57:27","slug":"mengakses-dan-menguji-web-api-dengan-tool-a-simple-test-client-for-asp-net-web-api","status":"publish","type":"post","link":"http:\/\/www.rezafaisal.net\/?p=1137","title":{"rendered":"Mengakses dan Menguji Web API dengan Tool A Simple Test Client for ASP.NET Web API"},"content":{"rendered":"

Pada posting sebelumnya http:\/\/www.rezafaisal.net\/?p=1125<\/a> telah di bahas tentang halaman bantuan dimana pada halaman tersebut kita dapat melihat class controller apa saja yang ada pada project dan method-method apa saja yang terdapat pada setiap class.<\/p>\n

Tetapi bagi yang ingin mencoba menggunakan fungsi-fungsi tersebut harus tetap melakukan akses langsung masing-masing method pada class controller via url baik yang bisa dilakukan dengan akses web browser atau secara memrograman.\u00a0 Pada posting ini akan dibahas bagaimana mengakses dan menguji method pada class controller Web API dengan bantuan \u201cA Simple Test Client for ASP.NET Web API<\/a>\u201d.\u00a0 Tool ini nantinya akan diintegrasikan dengan halaman bantuan Web API.<\/p>\n

Berikut adalah langkah-langkah yang dapat dilakukan :<\/p>\n

{Installasi A Simple Test Client for ASP.NET Web API<\/em><\/strong>}<\/p>\n

Untuk menambahkan \u201ctool\u201d ini pada project web adalah dengan cara akses fitur Manage NuGet Packages, dengan cara klik kanan pada project yang diinginkan kemudian pilih fitur tersebut.<\/p>\n

\"blog1\"<\/a><\/p>\n

Keyword yang bisa digunakan adalah WebApiTestClient, maka akan didapat daftar seperti di atas, kemudian klik tombol Install.<\/p>\n

\"blog2\"<\/a><\/p>\n

Selajutnya modifikasi file Api.cshtml yang terdapat pada folder Areas\\HelpPage\\Views\\Help.<\/p>\n

\n
\n
   1:<\/span> @using System.Web.Http<\/pre>\n
<\/p>\n
   2:<\/span> @using ASP.Areas.HelpPage.Models<\/pre>\n
<\/p>\n
   3:<\/span> @model HelpPageApiModel<\/pre>\n
<\/p>\n
   4:<\/span><\/pre>\n
<\/p>\n
   5:<\/span> @{<\/pre>\n
<\/p>\n
   6:<\/span>     var description = Model.ApiDescription;<\/pre>\n
<\/p>\n
   7:<\/span>     ViewBag.Title = description.HttpMethod.Method + \" \" + description.RelativePath;<\/pre>\n
<\/p>\n
   8:<\/span> }<\/pre>\n
<\/p>\n
   9:<\/span><\/pre>\n
<\/p>\n
  10:<\/span> <<\/span>link<\/span> type<\/span>=\"text\/css\"<\/span> href<\/span>=\"~\/Areas\/HelpPage\/HelpPage.css\"<\/span> rel<\/span>=\"stylesheet\"<\/span> \/><\/span><\/pre>\n
<\/p>\n
  11:<\/span> <<\/span>div<\/span> id<\/span>=\"body\"<\/span> class<\/span>=\"help-page\"<\/span>><\/span><\/pre>\n
<\/p>\n
  12:<\/span>     <<\/span>section<\/span> class<\/span>=\"featured\"<\/span>><\/span><\/pre>\n
<\/p>\n
  13:<\/span>         <<\/span>div<\/span> class<\/span>=\"content-wrapper\"<\/span>><\/span><\/pre>\n
<\/p>\n
  14:<\/span>             <<\/span>p<\/span>><\/span><\/pre>\n
<\/p>\n
  15:<\/span>                 @Html.ActionLink(\"Help Page Home\", \"Index\")<\/pre>\n
<\/p>\n
  16:<\/span>             <\/<\/span>p<\/span>><\/span><\/pre>\n
<\/p>\n
  17:<\/span>         <\/<\/span>div<\/span>><\/span><\/pre>\n
<\/p>\n
  18:<\/span>     <\/<\/span>section<\/span>><\/span><\/pre>\n
<\/p>\n
  19:<\/span>     <<\/span>section<\/span> class<\/span>=\"content-wrapper main-content clear-fix\"<\/span>><\/span><\/pre>\n
<\/p>\n
  20:<\/span>         @Html.DisplayForModel()<\/pre>\n
<\/p>\n
  21:<\/span>     <\/<\/span>section<\/span>><\/span><\/pre>\n
<\/p>\n
  22:<\/span> <\/<\/span>div<\/span>><\/span><\/pre>\n
<\/p>\n
  23:<\/span> @Html.DisplayForModel(\"TestClientDialogs\")<\/pre>\n
<\/p>\n
  24:<\/span> @section Scripts {<\/pre>\n
<\/p>\n
  25:<\/span>     @Html.DisplayForModel(\"TestClientReferences\")<\/pre>\n
<\/p>\n
  26:<\/span>     <<\/span>link<\/span> type<\/span>=\"text\/css\"<\/span> href<\/span>=\"~\/Areas\/HelpPage\/HelpPage.css\"<\/span> rel<\/span>=\"stylesheet\"<\/span> \/><\/span><\/pre>\n
<\/p>\n
  27:<\/span> }<\/pre>\n
<\/p>\n<\/div>\n<\/div>\n
Dan tambahkan baris ke-23 sampai baris ke-27 ke halaman Api.cshtml tersebut.<\/p>\n
{Testing<\/em><\/strong>}<\/p>\n
Maka akan dapat dilihat akan terdapat tambahan tombol \u201cTest API\u201d pada pojok kiri bawah pada halaman bantuan ketika kita mengakses bantuan dari suatu method pada class controller.<\/p>\n
\"blog3\"<\/a><\/p>\n
Dan berikut adalah tampilan ketika tombol \u201cTest API\u201d diklik, akan tampil window seperti pada gambar di bawah.<\/p>\n
\"blog4\"<\/a><\/p>\n
Dan berikut adalah hasil yang dapat dilihat ketika tombol Send diklik. Selain hasil output body juga dapat dilihat status dan header dari response method yang sedang kita akses tersebut.<\/p>\n
\"blog5\"<\/a><\/p>\n
Selamat mencoba :)<\/p>\n","protected":false},"excerpt":{"rendered":"
Pada posting sebelumnya http:\/\/www.rezafaisal.net\/?p=1125 telah di bahas tentang halaman bantuan dimana pada halaman tersebut kita dapat melihat class controller apa saja yang ada pada project dan method-method apa saja yang terdapat pada setiap class. Tetapi bagi yang ingin mencoba menggunakan…<\/p>\n","protected":false},"author":1,"featured_media":1130,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[6],"tags":[68,96,108],"class_list":["post-1137","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-softwaredev","tag-asp-net","tag-vs-2013","tag-web-api"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2014\/03\/blog2_thumb5.jpg","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p1sNAL-il","_links":{"self":[{"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/posts\/1137","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1137"}],"version-history":[{"count":2,"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/posts\/1137\/revisions"}],"predecessor-version":[{"id":1147,"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/posts\/1137\/revisions\/1147"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/media\/1130"}],"wp:attachment":[{"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1137"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1137"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.rezafaisal.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1137"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}