Asp.Net WebApi学习教程之增删改查

webapi简介

在asp.net中，创建一个HTTP服务，有很多方案，以前用ashx，一般处理程序（HttpHandler），现在可以用webapi

微软的web api是在vs2012上的mvc4项目绑定发行的，它提出的web api是完全基于RESTful标准的，完全不同于之前的（同是SOAP协议的）wcf和webService，它是简单，代码可读性强的，上手快的，如果要拿它和web服务相比，我会说，它的接口更标准，更清晰，没有混乱的方法名称，有的只有几种标准的请求，如get,post,put,delete等，它们分别对应的几个操作，下面讲一下：

GET：获取

POST：添加

PUT：修改

DELETE：删除

注意上面公开的API接口都是在XMLHttpRequest情况下调用的，当然你可以使用jquery的ajax组件来完成这个请求调用，它的代码更加面向对象，下面会举例说明。

WebAPI是根据请求头信息（Accept Header）来查找已经格式化注册的响应头信息（Content-Type）来确定它应该返回的输出类型json/xml，浏览器访问基本都是xml，如果只需要json的话可以通过Global.asax设置

protected void Application_Start(object sender, EventArgs e)
      {//默认JSON
          GlobalConfiguration.Configuration.Formatters.XmlFormatter.SupportedMediaTypes.Clear();
      }

webapi示例（CRUD）

环境：vs2015、iis7、webapi2.0、.net4.5.2

功能：webapi+ajax实现增删改查

模型

namespace cms.Model
{public partial class student
    {
        public int ID { get; set; }
        public string name { get; set; }
        public int sex { get; set; }
        public int age { get; set; }
        public System.DateTime timesAdd { get; set; }
    }
}

修改webapi路由

webapi默认路由api/{controller}/{id}，如果不喜欢可以修改为api/{controller}/{action}/{id}，下边是修改后的代码

public static void Register(HttpConfiguration config)
        {
            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{action}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }

Controller代码

using System;
using System.Collections.Generic;
using System.Net;
using System.Web.Http;
using cms.BLL;
using cms.Model;
namespace cms.Web.API
{
    public class StudentController : ApiController
    {
        public studentBLL bll = new studentBLL();
        // GET: /api/student/GetList
        public IEnumerable<student> GetList()
        {
            var list = bll.FindList();
            return list;
        }

        // GET: api/Student/Get/5
        public student Get(int id)
        {
            var model = bll.Find(id);
            if (model == null)
            {
                throw new HttpResponseException(HttpStatusCode.NotFound);
            }
            return model;
        }
        //添加方法1：如果要添加的字段和模型刚好匹配就用这个
        // POST: api/Student/Post
        public student Post([FromBody]student entity)
        {
            entity.timesAdd = DateTime.Now;
            return bll.Add(entity);

            //dynamic data = new { name = _name, age = _age };
            //return Json<dynamic>(data);
        }
        //添加方法2：如果要添加的字段和模型不匹配就用这个
        // POST: api/Student/PostAdd
        //注意：webapi post接受数据dynamic,ajax调用时也得把json格式化为字符串才行
        public student PostAdd(dynamic obj)
        {
            student model = new student();
            model.name = obj.name;
            model.sex = obj.sex;
            model.age = obj.age;
            model.timesAdd = DateTime.Now;
            return bll.Add(model);
        }

        // PUT: api/Student/Put/5
        public void Put(int id, [FromBody]student entity)
        {
            student model = bll.Find(id);
            model.name = entity.name;
            model.sex = entity.sex;
            model.age = entity.age;
            if (!bll.Update(model))
            {
                throw new HttpResponseException(HttpStatusCode.NotFound);
            }
        }

        // DELETE: api/Student/Delete/5
        public void Delete(int id)
        {
            if (!bll.Delete(id))
            {
                throw new HttpResponseException(HttpStatusCode.NotFound);
            }
        }
    }
}

html代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>webapi教程</title>
    <script type="text/javascript" src="Scripts/jquery-1.8.2.js"></script>
    <style type="text/css">
        h2 {
            border-bottom: solid 1px #ccc;
            padding-bottom: 10px;
        }

        #box_list span {
            margin-right: 30px;
            width: 100px;
            display: inline-block;
        }

        .time {
            width: 200px !important;
        }
    </style>
</head>
<body>
    <h2>webapi create</h2>
    <div>
        <p><input type="hidden" id="iid" /></p>
        <p>姓名：<input type="text" id="name" /></p>
        <p>性别：<input type="text" id="sex" /></p>
        <p>年龄：<input type="text" id="age" /></p>
        <p><input type="button" id="btnAdd" value="添加" />
            <input type="button" id="btnAdd2" value="添加2" />
        <input type="button" id="btnEdit" value="修改" /></p>
    </div>

    <h2>webapi list</h2>
    <div id="box_list"></div>
    <div>
        <input type="button" id="btnDel" value="删除" />
        <input type="button" id="btnView" value="查看" />
    </div>
    <div id="box_view"></div>
    <script type="text/javascript">
        $(function () {
            GetList();
            $("#btnAdd").click(function () {
                var _data = { name: $("#name").val(), sex: $("#sex").val(), age: $("#age").val() };
                $.ajax({
                    type: "post",
                    url: "/api/Student/Post",
                    data: _data,
                    dataType: "json",
                    success: function (data) {
                        alert("添加成功");
                        GetList();
                    },
                    error: function () {
                        alert("添加失败");
                    }
                });
            })
            $("#btnAdd2").click(function () {
                var _data = JSON.stringify({ name: $("#name").val(), sex: $("#sex").val(), age: $("#age").val() });
                $.ajax({
                    type: "post",
                    url: "/api/Student/PostAdd",
                    data: _data,
                    dataType: "json",
                    contentType: 'application/json',
                    success: function (data) {
                        alert("添加成功");
                        GetList();
                    },
                    error: function () {
                        alert("添加失败");
                    }
                });
            })
            $("#btnDel").click(function () {
                var _iid = $('input:radio[name=iid]:checked').val();;
                $.ajax({
                    type: "Delete",
                    url: "/api/Student/Delete/" + _iid,
                    success: function (data) {
                        alert("删除成功");
                        $('input:radio[name=iid]:checked').parents("p").remove();
                    },
                    error: function () {
                        alert("删除失败");
                    }
                });
            })
            $("#btnView").click(function () {
                var _iid = $('input:radio[name=iid]:checked').val();;
                $.ajax({
                    type: "get",
                    url: "/api/Student/get/" + _iid,
                    dataType: "json",
                    success: function (data) {
                        name: $("#iid").val(data.ID);
                        name: $("#name").val(data.name);
                        sex: $("#sex").val(data.sex);
                        age: $("#age").val(data.age)
                    },
                    error: function () {
                        alert("获取失败");
                    }
                });
            })
            $("#btnEdit").click(function () {
                var _data = { name: $("#name").val(), sex: $("#sex").val(), age: $("#age").val() };
                $.ajax({
                    type: "put",
                    url: "/api/Student/Put/" + $("#iid").val(),
                    data: _data,
                    success: function (data) {
                        alert("修改成功");
                        GetList();
                    },
                    error: function () {
                        alert("修改失败");
                    }
                });
            })
        })
        function GetList()
        {
            $("#box_list").html("");
            $.ajax({
                type: "GET",
                url: "/api/student/GetList",
                dataType: "json",
                success: function (data) {
                    $.each(data, function (i, item) {
                        $("#box_list").append("<p><span><input type='radio' name='iid' value='" + item.ID + "' />" + item.ID + "</span><span>" + item.name + "</span><span>" + item.sex + "</span><span>" + item.age + "</span><span class='time'>" + item.timesAdd + "</span></p>")
                    });
                }
            });
        }
    </script>
</body>
</html>

效果图

常见问题：

如果在做修改和删除操作时报405错误（webapi delete Method Not Allowed），说明是iis把put和delete请求禁止了，需要在web.config中设置一下就ok了

<system.webServer>
    <modules>
      <remove name="WebDAVModule" />
    </modules>
    <handlers>
      <remove name="WebDAV" />
    </handlers>
  </system.webServer>

posted @ 2019-02-27 10:21 WebApi 阅读(11437) 评论(0) 编辑收藏举报

刷新页面返回顶部

Asp.Net WebApi学习教程之增删改查

webapi简介

webapi示例（CRUD）

公告