Web API in ASP.NET MVC

0
Web API in ASP.NET MVC:-


It is used to contain a set of methods to perform the operation, API means application programming interface which provides a URL to consume functionality from one application to another.

It use HttpPost for data insertion ,HttpGet for data selection ,HttpPut for data updation and HttpDelete for data deletion .

Web API provides a clean, secure, and light-weight URL pattern to access data from .NET MVC application to another MVC application or cross-platform application.

It uses HTTP protocol to communicate data from client to server .we can create REST WEB API using WEB API application which can return data using JSON format or XML format.



API UrlTemplate will be different from normal ASP.NET MVC application because in ASP.NET MVC first, we write controller name/method name/data but in Web API first, we write api/controllername method name will depend on operation.

Syntax of API Controller

 public class ControllernameController : ApiController
    {
        // GET api/values
        public IEnumerable<string> Get()   //Write code for data selection
        {
            return new string[] { "value1", "value2" };
        }

        // GET api/values/5
        public string Get(int id)  //Write code for find record
        {
            return "value";
        }

        // POST api/values
        public void Post([FromBody]string value)  //Write Code for data insertion
        {
        }

        // PUT api/values/5
        public void Put(int id, [FromBody]string value)  //Write Code for data updation
        {
        }

        // DELETE api/values/5
        public void Delete(int id)   //Write Code for delete operation
        {
        }
    }

If we want to create an action method name different then Get, Post, Put and Delete then we will write HttpGET, HttpPost, HttpPut, and HttpDelete Verb.


 // GET api/values
        [HttpGet]
        public IEnumerable<string> ViewValues()
        {
            return new string[] { "value1", "value2" };
        }

        // GET api/values/5
        [HttpGet]
        public string GetValue(int id)
        {
            return "value";
        }


Simple Example of Web API:-

Create Model Class using right-click on model folder:-

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

namespace MvcApplication6.Models
{
    public class PersonModel
    {
        public string Name { get; set; }

        ///<summary>
        /// Gets or sets DateTime.
        ///</summary>
        public string DateTime { get; set; }
    }
}


Create APIController and write the following code:-

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using MvcApplication6.Models;
namespace MvcApplication6.Controllers
{
    public class PersontestController : ApiController
    {
        [HttpPost]
        public PersonModel AjaxMethod(PersonModel obj)
        {
            obj.DateTime = DateTime.Now.ToString();
            return obj;
        }

   
    }
}


Create Another controller to consume web api and call web api url using AJAX:-
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication6.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }
    }
}


Code of index.cshtml to consume web API:-
<html>
    <head>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
        $(function () {
            $("#btnGet").click(function () {
                var person = '{Name: "' + $("#txtName").val() + '" }';
                $.ajax({
                    type: "POST",
                    url: "/api/Persontest/AjaxMethod",
                    data: person,
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        alert("Hello: " + response.Name + ".\nCurrent Date and Time: " + response.DateTime);
                    },
                    failure: function (response) {
                        alert(response.responseText);
                    },
                    error: function (response) {
                        alert(response.responseText);
                    }
                });
            });
        });
    </script>
    </head>
    <body>

    <input type="text" id="txtName"/>
    <input type="button" id="btnGet" value="Get Current Time"/>

    </body>

</html>



Tags

Post a Comment

0Comments

POST Answer of Questions and ASK to Doubt

Post a Comment (0)