本文转载自:http://www.cnblogs.com/pmars/p/3673811.html

先看效果图:

以下是原文:

如何在帮助页面添加测试工具

  上一篇我在ASP.NET里面添加了一个Help Page,这篇文章我打算在该page里面添加一个测试工具,这样我们在开发的时候就可以直接用来测试API了,对开发很有好处!

  你也可以看这篇文章来添加测试工具:http://blogs.msdn.com/b/yaohuang1/archive/2012/12/02/adding-a-simple-test-client-to-asp-net-web-api-help-page.aspx

1,添加NuGet程序包

  

  

  点击安装即可。

  之后会在你的项目中添加了如下文件:

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

2,添加功能

  这个时候我们需要修改这个文件:Areas\HelpPage\Views\Help\Api.cshtml

 1 <link type="text/css" href="~/Areas/HelpPage/HelpPage.css" rel="stylesheet" />
2 <div id="body" class="help-page">
3 <section class="featured">
4 <div class="content-wrapper">
5 <p>
6 @Html.ActionLink("Help Page Home", "Index")
7 </p>
8 </div>
9 </section>
10 <section class="content-wrapper main-content clear-fix">
11 @Html.DisplayForModel()
12 </section>
13 </div>
14 @Html.DisplayForModel("TestClientDialogs")
15 @section Scripts {
16 <link type="text/css" href="~/Areas/HelpPage/HelpPage.css" rel="stylesheet"/>
17 @Html.DisplayForModel("TestClientReferences")
18 }

  对的,就这么简单。

  你需要确定的是,你的包需要在这个或者之上:

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

3,看看页面

  在Help页面找到任意的API,点击进入查看,会发现,右下角有个Test API 的按钮,点击就是我们要的测试工具了

  

  返回的结果还算正确。

如何在MVC_WebAPI项目中的APIController帮助页面添加Web测试工具测试的更多相关文章

  1. 如何在mvc项目中使用apiController

    文章地址:How do you route from an MVC project to an MVC ApiController in another project? 文章地址:How to Us ...

  2. [Laravel-Swagger]如何在 Laravel 项目中使用 Swagger

    如何在 Laravel 项目中使用 Swagger http://swagger.io/getting-started/ 安装依赖 swagger-php composer require zirco ...

  3. 如何在cocos2d项目中enable ARC

    如何在cocos2d项目中enable ARC 基本思想就是不支持ARC的代码用和支持ARC的分开,通过xcode中设置编译选项,让支持和不支持ARC的代码共存. cocos2d是ios app开发中 ...

  4. 如何在NodeJS项目中优雅的使用ES6

    如何在NodeJS项目中优雅的使用ES6 NodeJs最近的版本都开始支持ES6(ES2015)的新特性了,设置已经支持了async/await这样的更高级的特性.只是在使用的时候需要在node后面加 ...

  5. 如何在VUE项目中添加ESLint

    如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...

  6. 如何在Ionic2项目中使用第三方JavaScript库

    onic的官网放出一记大招Ionic and Typings,来介绍如何在Ionic2项目中使用第三方JavaScript库. 因为在前阵子正好想用一个非常有名的第三方JS库ChartJs来实现一些东 ...

  7. 如何在maven项目中使用spring

    今天开始在maven项目下加入spring. 边学习边截图. 在这个过程中我新建了一个hellospring的项目.于是乎从这个项目出发开始研究如何在maven项目中使用spring.鉴于网上的学习资 ...

  8. 如何在Vue-cli项目中使用JTopo

    1.前言 jTopo(Javascript Topology library)是一款完全基于HTML5 Canvas的关系.拓扑图形化界面开发工具包.其体积小,性能优异,由一群开发爱好者来维护.唯一感 ...

  9. 如何在Vue项目中给路由跳转加上进度条

    1.前言 在平常浏览网页时,我们会注意到在有的网站中,当点击页面中的链接进行路由跳转时,页面顶部会有一个进度条,用来标示页面跳转的进度(如下图所示).虽然实际用处不大,但是对用户来说,有个进度条会大大 ...

随机推荐

  1. merge sort and quick sort 自己去理解吧

    <?php $digits=array(,,,,,,,); function quickSort($arr){ $len=count($arr); ){ return $arr; } $midK ...

  2. DNS拾遗(二)

    MX Record补充 MX记录有优先级的概念,数字越小表示优先级越高.所以一个域可以配置多个不同优先级的MX记录,如果邮件通过第一优先级记录无法递送,则采用第二优先级,以此类推. TXT Recor ...

  3. [专业名词·硬件] 2、DC\DC、LDO电源稳压基本常识(包含基本原理、高效率模块设计、常见问题、基于nRF51822电源管理模块分析等)·长文

    综述先看这里 第一节的1.1简单介绍了DC/DC是什么: 第二节是关于DC/DC的常见的疑问答疑,非常实用: 第三节是针对nRF51822这款芯片电源管理部分的DC/DC.LDO.1.8的详细分析,对 ...

  4. 数据库的Timeout

    数据库的Timeout 其实有很多种情况. 一个是执行的超时时间 executionTimeOut,一个是连接的超时时间connectionTimeOut, 还有呢? 等待的超时时间 ReadTime ...

  5. Java基础之网络编程

    网络编程:1.网络编程概述 (1)网络模型 OSI参考模型 TCP/IP参考模型 (2)网络通讯要素 IP地址 端口号 传输协议 (3)网络通讯前提: **找到对方IP **数据要发送到指定端口.为了 ...

  6. Programming in lua 杂记(转)

    1,loadstring 编译的时候不关心词法范围:   local i = 0   f = loadstring("i = i + 1") g = function () i = ...

  7. Linux初学 - 解决chkconfig Segmentation fault(core dumped)

    yum install *chkconfig*

  8. vuejs与服务器通信

    vuejs与服务器通信 与服务器通信 Vue 实例的原始数据 $data 能直接用 JSON.stringify() 序列化.社区贡献了一个插件 vue-resource,提供一种容易的方式与 RES ...

  9. Java语言的个人理解

    Java语言的个人理解(比价深层次吧) 大四的生活确实十分的奢靡,不锻炼,不读书,几乎就是当一天和尚撞一天钟的生活,太颓废了,还好自己不是这个样子,不过身体确实差了很多,昨天跑了一圈内环(4KM),今 ...

  10. stackView的隐藏与显示注意事项

    1.想要通过变换stackView的y值来让stackView显现/隐藏,同时让其中的button能点击响应,得用topCons 2.导航栏的tinBar要设置为非透明状态