开发者社区> 杰克.陈> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

Web API 简单示例

简介: 原文:Web API 简单示例 一、RESTful和Web API   Representational State Transfer (REST) is a software architecture style consisting of guidelines and best practices for creating scalable web services.
+关注继续查看
原文:Web API 简单示例

一、RESTfulWeb API

  Representational State Transfer (REST) is a software architecture style consisting of guidelines and best practices for creating scalable web services. REST is a coordinated set of constraints applied to the design of components in a distributed hypermdedia system that can lead to a more performant and maintainable architecture.  -- wikipedia 

  ASP.NET Web API is a framework that makes it easy to build HTTP services that reach a broad range of clients, including browsers and mobile devices. ASP.NET Web API is an ideal platform for building RESTful applications on the .NET Framework.

  原来RESTful是一种软件架构风格(REST是一种设计风格,而不是一种标准),而ASP.NET Web API是其在.NET平台的一种标准/实现。目前在三种主流的Web Services实现方案中,因为REST模式与复杂的SOAPXML -PRC相比更加简洁,越来越多的web服务开始采用REST风格设计和实现。

  ASP.NET整体框架结构如下图。可以看出,Web API支持JSONXML,面向的是多种客户终端,包括多浏览器和各种移动设备。

 

二、简单示例

   新建ASP.NET Web Application,命名NBAApp

  

  选择Empty模板,下面选择Web API,更改AuthenticationNo Authentication

 

  新建一个Model - Player 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace NBAApp.Models
{
    public class Player
    {
        public int Id { get; set; }
        public int No { get; set; }
        public string Name { get; set; }
        public string Position { get; set; }
        public string Team { get; set; }
    }
}

 

  新建Controller - PlayersController,模板选择Web API 2 Controller - Empty

  

  编辑代码如下

using NBAApp.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;

namespace NBAApp.Controllers
{
    public class PlayersController : ApiController
    {
        Player[] players = new Player[] { 
            new Player { Id = 1, No = 3, Name = "Chris Paul", Position = "Point Guard", Team = "Los Angeles Clippers" },
            new Player { Id = 2, No = 3, Name = "Dwyane Wade", Position = "Shooting Guard", Team = "Miami Heat" },
            new Player { Id = 3, No = 23, Name = "LeBron James", Position = "Forward", Team = "Cleveland Cavaliers" },
            new Player { Id = 4, No = 21, Name = "Tim Duncan", Position = "Power forward", Team = "San Antonio Spurs" },
            new Player { Id = 5, No = 33, Name = "Marc Gasol", Position = "Center", Team = "Memphis Grizzlies" }
        };

        public IEnumerable<Player> GetAllPlayers()
        {
            return players;
        }

        public IHttpActionResult GetPlayer(int id)
        {
            var player = players.FirstOrDefault<Player>(p => p.Id == id);
            if (player == null)
            {
                return NotFound();
            }
            return Ok(player);
        }
    }
}

 

  添加Html - Index.html页面

 

  编辑代码如下

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>NBA App</title>
</head>
<body>

    <div>
        <h2>All Players</h2>
        <ul id="players" />
    </div>
    <div>
        <h2>Search by ID</h2>
        <input type="text" id="prodId" size="5" />
        <input type="button" value="Search" onclick="find();" />
        <p id="player" />
    </div>

    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js"></script>
    <script>
        var uri = 'api/players';

        $(document).ready(function () {
            // Send an AJAX request
            $.getJSON(uri)
                .done(function (data) {
                    // On success, 'data' contains a list of players.
                    $.each(data, function (key, item) {
                        // Add a list item for the player.
                        $('<li>', { text: formatItem(item) }).appendTo($('#players'));
                    });
                });
        });

        function formatItem(item) {
            return item.Id + ": " + item.Name + "(" + item.No + ')' + " - " + item.Team + "(" + item.Position + ")";
        }

        function find() {
            var id = $('#prodId').val();
            $.getJSON(uri + '/' + id)
                .done(function (data) {
                    $('#player').text(formatItem(data));
                })
                .fail(function (jqXHR, textStatus, err) {
                    $('#player').text('Error: ' + err);
                });
        }
    </script>
</body>
</html>

 

  执行效果如下(Chrome浏览器)

 

  F12调出Developer Tools,点击红点Recording Network Log,刷新页面,结果如下

 

  点击进去,并选择Response标签,可以清楚地看到传输交换的是JSON格式的字符

 

 

代码下载

NBAApp

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
简单快速部署React,上手Web开发更轻松!
React起源于Facebook内部项目,于2013年开源,由于出众的设计思想,以及更加专注于MVC当中的视图层, 使得创建交互式 UI 变得轻而易举。同时React还可以为你应用的每一个组件设计简洁的视图,当数据改变时 React 能有效地更新并正确地渲染组件。
670 0
Python Flask Web 开发入门与项目实战 ——Flask快速入手
Python Flask Web 开发入门与项目实战 Flask快速入手
374 0
使用C++开发的web框架dlagon
本项目仅仅是个人的玩具项目, 其中缺陷很多, 问题也很多. 首先整个网络部分是自己看了两三章UNP自己封出来的. 老版本还有一点点错误处理, 新版本完全忽略了错误处理. 另外就是过度设计, 许多的地方没有必要预留变更空间, 我都预留了.
36 0
Python web开发从入门到放弃
Python web开发从入门到放弃
54 0
Python Web开发全套视频,你拿走吧!
Python Web开发全套视频,你拿走吧!
38 0
第123天: Web 开发 Django 管理工具
第123天: Web 开发 Django 管理工具
56 0
第124天: Web 开发 Django 模板
第124天: Web 开发 Django 模板
33 0
第 82 天:Python Web 开发之 JWT 简介
第 82 天:Python Web 开发之 JWT 简介
180 0
第 87 天:Python Web开发 OAuth2.0 简介
第 87 天:Python Web开发 OAuth2.0 简介
78 0
第47天:Web 开发 RESTful
第47天:Web 开发 RESTful
49 0
+关注
杰克.陈
一个安静的程序猿~
10424
文章
2
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载