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; }
}
}
実行結果：
