2017年4月5日水曜日

ASP.NET Web API の実装例

ASP.NET Web API の簡単な雛形を作ってみました。

クライアントサイドの実装:
ボタンをクリックして、Web API を呼び出しています。

<input type="button" id="apiButton" class="btn" value="Web Api Test"/>

@section scripts{
    <script>

        function asyncCall() {
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function () {
                if ((xhr.readyState === 4) && (xhr.status === 200)) {
                    var json = xhr.response;
                    console.log(json);
                }
            }
            xhr.open("GET", "/api/items/1", true);
            xhr.send(null);
        }

        var button1 = document.getElementById("apiButton");
        button1.addEventListener("click", asyncCall, false);
        
    </script>
}

サーバーサイドの実装:
ダミーデータからパラメーターとして渡される id からデータを割り出してクライアントへ返します。

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

namespace WebApi.Controllers
{
    public class ItemsController : ApiController
    {
        public IEnumerable<Item> getItem(int id)
        {
            var allItems = getAllItems();
            var item = allItems.Where(x => x.Id == id);
            return item;
        }

        private IEnumerable<Item> getAllItems()
        {
            List<Item> items = new List<Item>();
            items.Add(new Item { Id = 1, Name = "My Item 1", RegisteredOn = DateTime.Today.AddDays(-2), CategoryId = 1 });
            items.Add(new Item { Id = 2, Name = "My Item 2", RegisteredOn = DateTime.Today.AddDays(-3), CategoryId = 2 });
            return items;
        }
    }

    public class Item
    {
        public int Id { get; set; }

        public string Name { get; set; }

        public DateTime RegisteredOn { get; set; }

        public int CategoryId { get; set; }
    }
}

実行結果:

0 件のコメント:

コメントを投稿