码迷,mamicode.com
首页 > Windows程序 > 详细

A simple Test Client built on top of ASP.NET Web API Help Page

时间:2015-11-30 17:23:29      阅读:296      评论:0      收藏:0      [点我收藏+]

标签:

Step 1: Install the Test Client package

Install the WebApiTestClient package from the NuGet Package Manager. Make sure to “Include Prerelease” then just type in “WebApiTestClient” and click Install.

技术分享

Once the package is installed, it will add the following files to your project:

  • Scripts\WebApiTestClient.js
  • Areas\HelpPage\TestClient.css
  • Areas\HelpPage\Views\Help\DisplayTemplates\TestClientDialogs.cshtml
  • Areas\HelpPage\Views\Help\DisplayTemplates\TestClientReferences.cshtml

It will also pull in the ASP.NET Web API Help Page package if it’s not already installed.

Step 2: Wire up the Test Client on Help Page

Open the file Api.cshtml (under Areas\HelpPage\Views\Help) and add the following:

  • @Html.DisplayForModel("TestClientDialogs")
  • @Html.DisplayForModel("TestClientReferences")

Note that you add the @Html.DisplayForModel("TestClientDialogs") after the <div> and @Html.DisplayForModel("TestClientReferences") inside the Scripts section.

技术分享

You need to have the following JavaScript libraries installed. They should be installed if you used the default Web API template. Now, if you have different version numbers, you can update the references in TestClientReferences.cshtml.

  • jQuery 1.7.1
  • jQuery.UI.Combined 1.8.20
  • knockoutjs 2.1.0

Once everything is wired up correctly, you should see the “Test API” button appearing on the bottom right corner of the API page.

技术分享

 

Testing Web APIs

Now you can click on the “Test API” button to start testing the APIs. For each URI parameters, it will automatically provide a text box so that you can fill in the value instead of editing the URI. Note that the URI automatically gets updated as you fill in the parameter values.

技术分享

After you click on Send, another dialog will pop up showing you the response.

技术分享

Adding Request Headers

You can add additional request headers by clicking “Add Header”. For example, you can add the accept header “text/xml” to ask for XML.

技术分享

And sure enough, your Web API returned the content as XML.

技术分享

Providing Request Body

For methods like POST, you can provide the body in the Body section. Note that it will be prepopulated with the samples from Help Page so you don’t need to do any copy-pasting.

技术分享

And you can select different samples based on the supported media types. For instance, selecting application/xml will pull in the XML sample. Note that the content-type and content-length headers are updated accordingly.

技术分享

You can change the content of the body and the content-length header will change as you type!

技术分享

 

Update: The source code is now hosted at: https://github.com/yaohuang/WebApiTestClient

A simple Test Client built on top of ASP.NET Web API Help Page

标签:

原文地址:http://www.cnblogs.com/simadi/p/5007608.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!