① 如何使 WebAPI 自动生成漂亮又实用在线API文档
1、如何引入组件
首先，我们需要定义一个API项目
然后通过Nuget引入组件。记住选下图中的第三个。
引入成功后，将向项目里面添加一些主要文件：
•Scripts\WebApiTestClient.js
•Areas\HelpPage\TestClient.css
•Areas\HelpPage\Views\Help\DisplayTemplates\TestClientDialogs.cshtml
•Areas\HelpPage\Views\Help\DisplayTemplates\TestClientReferences.cshtml
2、如何使用组件
1、修改Api.cshtml文件
通过上述步骤，就能将组件WebAPITestClient引入进来。下面我们只需要做一件事：打开文件 (根据 Areas\HelpPage\Views\Help) Api.cshtml 并添加以下内容:
•@Html.DisplayForModel("TestClientDialogs")
•@Html.DisplayForModel("TestClientReferences")
② 请问html的js调用webapi接口
引用jquery，有很方便的GET调用方法：
<!DOCTYPEhtml>
<html>
<head>
<metahttp-equiv="content-type"content="text/html;charset=UTF-8">
<metaname="viewport"content="width=device-width,initial-scale=1">
<!--src值为文件位置路径-->
<scripttype="text/javascript"charset="UTF-8"src="javascript/jquery-1.12.1.js"></script>
<title>测试案例</title>
<!--语法：jQuery.getJSON(url,data,success(data,status,xhr))-->
<scripttype="text/javascript"charset="UTF-8">
functiongetToken(){
$.getJSON("http://localhost/kdapi/api/access_token",{"id":111,"secret":2352532},function(result){
alert(result.access_token);
});
}
</script>
</head>
<body>
<buttononclick="getToken()"style="width:120px;height:60px;">获取Token</button>
</body>
</html>
③ WebAPI与传统的WebService有哪些不同
WebService是利用HTTP管道实现了RPC的一种规范形式，放弃了对HTTP原生特征与语义的完备支持；而WebAPI是要保留HTTP原生特征与语义的同时实现RPC，但WebAPI的实现风格可以是千姿百态，RESTful只是实现了其中一种风格，你也可以定义一种风格，并实现
WebAPI相比WebService更为轻量级、灵活、优化好的情况下，性能更有优势，但是对复杂或大型业务的描述与使用增加了无形的成本
WebAPI可以更好的利用HTTP与生俱来的特征，如：缓存、代理、安全、头信息扩展，反之，部分实现方式WebService无法利用HTTP特征
本质上WebAPI与传统模式的WebService都是实现RPC，远程服务；传统的WebService只是利用了HTTP通道，进行独立的交互，但是这个交互协议可以移植到其他协议下运作，而WebAPI天生与HTTP依赖无法移植
WebService与WebAPI在80端口下工作，都可以绕开默认的网络防火墙限制，因为默认下网络防火墙对系统级端口与协议下的内容是开放的
WebService与RESTfulWebAPI服务端都可以使用反射来实现自动化部署，只是前者更为容易，因为存在标准的规范，后者只是开发WebAPI的推荐风格，实现上需要自己来规范与描述，处理不兼容问题；WebAPI在无反射下的业务实现更为直观接近MVC模式下的开发的应用，通用，性能更好、更为灵活，能够直接利用HTTP的动态网页技术开发接口与功能
WebAPI对于交互数据的格式没有明确规定，使得其可以更好的使用在特定的软件运行平台，但是需要开发者对各种格式的支持；传统的WebService则要求使用服务的平台对数据格式强制适应，服务端的交互数据处理变得更加快捷容易，而增加了不同使用端的对服务交互困难度
④ WebAPIs基本操作
1、作用: 制作网页特效和用户交互
2、组成：
1）DOM：操作页面元素；（document顶级对象）
2）BOM：操作浏览器。
1）优点：灵活， 所有CSS选择器都可以使用；
2）获取单个元素：document.querySelector('选择器')，选择器不存在的话，获取结果为null，结果可以直接使用；
3）获取多个同一类元素：document.querySelectorAll('选择器')，拿到的结果: NodeList伪数组，通过遍历数组获取对应元素。
PS：伪数组：存在着length属性，可以通过数组下标的方式进行每个元素的访问，但是不能够使用push等数组的方法。
1）getElementById('id值')： 获取单个元素；
2）getElementsByTagName('标签名')：获取多个同一类元素；（伪数组）
3）getElementsByClassName('类名'): 获取多个同一类元素。（伪数组）
1）a的href，img的src、alt、title等；
2）属性: 可以访问, 也可以修改
3）语法: 元素.属性名 = 属性值
1）innerText：针对文本: 不识别标签；
2）innerHTML：针对所有: 包括标签；（常用，innerHTML可实现innerText功能）
1）行内样式：
适用于: 单行样式修改；
语法：元素.style.样式名 = 样式值；
操作的只能是行内的样式；
操作的结果要带单位；
一定是小驼峰, 没有中划线；
2）类名操作：
语法：元素.classList；
元素.classList.add('类名') : 追加类；
元素.classList.remove('类名') : 移除类；
元素.classList.toggle('类名') : 切换类。
1）type: input标签的password和text；
2）value: 所有表单属性；
获取值: 元素.value；
修改值: 元素.value = 新值；
3）checked: 选中；
true: 选中；
false: 不选中；
4）disabled: 禁用；
true: 禁用；
false: 不禁用。
⑤ webApi如何将一个页面
第一步：新建项目后，找到Global.asax文件----找到GlobalConfiguration.Configure(WebApiConfig.Register)方法------按F12进入 WebApiConfig.Register方法中----添加内容红框框
知识点：路由器注册顺序是由上往下的，会先从上面进行匹配。
路由器的名称不能重名，否则报错【CustomApi/DefaultApi】
第二步：设置webapi项目为启动项，然后启动，在网页路径上加api/values(控制器名称不要Controller)
知识点：因为ValuesController是项目自带的，那么这一次的请求与 DefaultApi的路由规格是一致的。
⑥ WebService和Webapi的区别
Web Service特征
1、它是基于SOAP协议的，数据格式是XML
2、只支持HTTP协议
3、它不是开源的，但可以被任意一个了解XML的人使用
4、它只能部署在IIS上
Web API特征（红色标记与WebService区别）
1、这是一个简单的构建HTTP服务的新框架
2、在.net平台上Web API 是一个开源的、理想的、构建REST-ful 服务的技术
3、不像WCF REST Service.它可以使用HTTP的全部特点（比如URIs、request/response头，缓存，版本控制，多种内容格式）
4、它也支持MVC的特征，像路由、控制器、action、filter、模型绑定、控制反转（IOC）或依赖注入（DI），单元测试。这些可以使程序更简单、更健壮
5、它可以部署在应用程序和IIS上
6、这是一个轻量级的框架，并且对限制带宽的设备，比如智能手机等支持的很好
7、Response可以被Web API的MediaTypeFormatter转换成Json、XML 或者任何你想转换的格式。
8、Web API非常适合构建移动客户端服务
以下情况可以考虑用Web API
1、 需要Web Service但是不需要SOAP
2、 需要在已有的WCF服务基础上建立non-soap-based http服务
3、 只想发布一些简单的Http服务，不想使用相对复杂的WCF配置
4、 发布的服务可能会被带宽受限的设备访问
5、希望使用开源框架，关键时候可以自己调试或者自定义一下框架
6、如果服务需要在http协议上，并且希望利用http协议的各种功能
7、如果服务需要被各种客户端(特别是移动客户端)调用
小结（仅供参考）
总体来说，两者都是服务，只是表现形式存在一些差异
webapi多用于基于http请求的服务应用,比如说移动服务端或者需要提供第三方API 服务的场景下
webservice也可以应用于webapi所在的场景，但是如果是我的选择，我一般是做为内部服务的使用，好比如果一个系统我会用wcf/webservice作为内部子系统间的服务通信，而webapi用于外部服务的请求~
⑦ 如何使 WebAPI 自动生成漂亮又实用在线API文档
1.1 SwaggerUI
SwaggerUI 是一个简单的Restful API 测试和文档工具。简单、漂亮、易用（官方demo）。通过读取JSON 配置显示API. 项目本身仅仅也只依赖一些 html,css.js静态文件. 你可以几乎放在任何Web容器上使用。
1.2 Swashbuckle
Swashbuckle 是.NET类库,可以将WebAPI所有开放的控制器方法生成对应SwaggerUI的JSON配置。再通过SwaggerUI 显示出来。类库中已经包含SwaggerUI 。所以不需要额外安装。
2.快速开始
创建项目 OnlineAPI来封装网络音乐服务(示例下载) ，通过API可以搜索、获取音乐的信息和播放连接。
我尽量删除一些我们demo中不会用到的一些文件，使其看上去比较简洁。
WebAPI 安装 Swashbuckle
Install-Package Swashbuckle
代码注释生成文档说明。
Swashbuckle 是通过生成的XML文件来读取注释的，生成 SwaggerUI，JSON 配置中的说明的。
安装时会在项目目录 App_Start 文件夹下生成一个 SwaggerConfig.cs 配置文件，用于配置 SwaggerUI 相关展示行为的。如图：
将配置文件大概99行注释去掉并修改为
c.IncludeXmlComments(GetXmlCommentsPath(thisAssembly.GetName().Name));
并在当前类中添加一个方法
/// <summary>
/// </summary>
/// <param name="name"></param>
/// <returns></returns>
protected static string GetXmlCommentsPath(string name)
{
return string.Format(@"{0}\bin\{1}.XML", AppDomain.CurrentDomain.BaseDirectory, name);
}
紧接着你在此Web项目属性生成选卡中勾选 “XML 文档文件”，编译过程中生成类库的注释文件
添加网络音乐 3个API
访问 http://<youhost>/swagger/ui/index,最终显示效果
我们通过API 测试API 是否成功运行
3.添加自定义HTTP Header
在开发移动端 API时常常需要验证权限，验证参数放在Http请求头中是再好不过了。WebAPI配合过滤器验证权限即可
首先我们需要创建一个 IOperationFilter 接口的类。IOperationFilter
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Http;
using System.Web.Http.Description;
using System.Web.Http.Filters;
using Swashbuckle.Swagger;
namespace OnlineAPI.Utility
{
public class HttpHeaderFilter : IOperationFilter
{
public void Apply(Operation operation, SchemaRegistry
schemaRegistry, ApiDescription apiDescription)
{
if (operation.parameters == null) operation.parameters = new
List<Parameter>();
var filterPipeline =
apiDescription.ActionDescriptor.GetFilterPipeline();
//判断是否添加权限过滤器
var isAuthorized = filterPipeline.Select(filterInfo =>
filterInfo.Instance).Any(filter => filter is IAuthorizationFilter);
//判断是否允许匿名方法
var allowAnonymous =
apiDescription.ActionDescriptor.GetCustomAttributes<AllowAnonymousAttribute>().Any();
if (isAuthorized && !allowAnonymous)
{
operation.parameters.Add(new Parameter
{
name = "access-key",
@in = "header",
description = "用户访问Key",
required = false,
type = "string"
});
}
}
}
}
在 SwaggerConfig.cs 的 EnableSwagger 配置匿名方法类添加一行注册代码
c.OperationFilter<HttpHeaderFilter>();
添加Web权限过滤器
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Text;
using System.Web;
using System.Web.Http;
using System.Web.Http.Controllers;
using Newtonsoft.Json;
namespace OnlineAPI.Utility
{
/// <summary>
///
/// </summary>
public class AccessKeyAttribute : AuthorizeAttribute
{
/// <summary>
/// 权限验证
/// </summary>
/// <param name="actionContext"></param>
/// <returns></returns>
protected override bool IsAuthorized(HttpActionContext actionContext)
{
var request = actionContext.Request;
if (request.Headers.Contains("access-key"))
{
var accessKey = request.Headers.GetValues("access-key").SingleOrDefault();
//TODO 验证Key
return accessKey == "123456789";
}
return false;
}
/// <summary>
/// 处理未授权的请求
/// </summary>
/// <param name="actionContext"></param>
protected override void HandleUnauthorizedRequest(HttpActionContext actionContext)
{
var content = JsonConvert.SerializeObject(new {State = HttpStatusCode.Unauthorized});
actionContext.Response = new HttpResponseMessage
{
Content = new StringContent(content, Encoding.UTF8, "application/json"),
StatusCode = HttpStatusCode.Unauthorized
};
}
}
}
在你想要的ApiController 或者是 Action 添加过滤器
[AccessKey]
最终显示效果
4.显示上传文件参数
SwaggerUI 有上传文件的功能和添加自定义HTTP Header 做法类似，只是我们通过特殊的设置来标示API具有上传文件的功能
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Http.Description;
using Swashbuckle.Swagger;
namespace OnlineAPI.Utility
{
/// <summary>
///
/// </summary>
public class UploadFilter : IOperationFilter
{
/// <summary>
/// 文件上传
/// </summary>
/// <param name="operation"></param>
/// <param name="schemaRegistry"></param>
/// <param name="apiDescription"></param>
public void Apply(Operation operation, SchemaRegistry schemaRegistry, ApiDescription apiDescription)
{
if (!string.IsNullOrWhiteSpace(operation.summary) && operation.summary.Contains("upload"))
{
operation.consumes.Add("application/form-data");
operation.parameters.Add(new Parameter
{
name = "file",
@in = "formData",
required = true,
type = "file"
});
}
}
}
}
在 SwaggerConfig.cs 的 EnableSwagger 配置匿名方法类添加一行注册代码
c.OperationFilter<UploadFilter>();
API 文档展示效果
⑧ 怎样操作WebAPI接口
先定义一个简单的webapi，简单到差不多直接用vs2010自动生成的webapi代码。
其中的TestModle是一个简单的class，如下
public class TestModle
{
public string a { get; set; }
public string b { get; set; }
public string c { get; set; }
}
前端页面放四个代表get，post，put，delete的按钮，在加一个div显示返回值
前端代码中加载jquery，在定义四个按钮的click事件
get和post，我习惯用$.get和$.post，当然也能用$.ajax.
get直接返回webapi get的return值，post的话我就不在后端做处理了直接返回传入的值，这里只做示范
put和delete，只能用$.ajax来处理。
put的话一般用于update某个id的数据信息
delete用于删除某个id的数据，如下图所示
点击每个按钮，可以在页面上看到相应的效果
本回答由提问者推荐
评论
1 1
xzozxzb | 汽车顾问向TA咨询
擅长： 汽车
其他回答
先定义一个简单的webapi，简单到差不多直接用vs2010自动生成的webapi代码。
其中的TestModle是一个简单的class，如下
public class TestModle
{
public string a { get; set; }
public string b { get; set; }
public string c { get; set; }
}
前端页面放四个代表get，post，put，delete的按钮，在加一个div显示返回值
前端代码中加载jquery，在定义四个按钮的click事件
get和post，我习惯用$.get和$.post，当然也能用$.ajax.
get直接返回webapi get的return值，post的话我就不在后端做处理了直接返回传入的值，这里只做示范
put和delete，只能用$.ajax来处理。
put的话一般用于update某个id的数据信息
delete用于删除某个id的数据，如下图所示
点击每个按钮，可以在页面上看到相应的效果