Using Web service REST API in ASP.NET MVC forms 02

ASP.NET MVC – How to Use REST API Webservice

In this post we will see how to consume or use RESTful Web API on ASP.NET MVC Webforms. In my previous post we seen how we can create REST API web services in MVC. In this post we will use the same on to our MVC form. Let’s begin.

DOWNLOAD SOURCE CODE

In the MVC project, create a new Controller with name ProductController.cs and edit it as below:

YourProjectName > Controllers > ProductController.cs:

using RestAPIEx.Models;
using System;
using System.Net.Http;
using System.Web.Mvc;

namespace RestAPIEx.Controllers
{
public class ProductController : Controller
{
// GET: Product
public ActionResult Index()
{
return View();
}

[HttpPost]
public ActionResult Index(Products product)
{
try
{
if(product==null|| String.IsNullOrWhiteSpace(product.productDesc)
|| String.IsNullOrWhiteSpace(product.productName))
{
ViewBag.Info = "Please enter product name and its description.";
return View();
}

using (var client = new HttpClient())
{
client.BaseAddress = new Uri("http://localhost/RestAPIEx/api/");

var postObj = client.PostAsJsonAsync<Products>("AddProduct", product);
postObj.Wait();

var res = postObj.Result;

var result = res.Content.ReadAsAsync<Result>().Result.result;

ViewBag.Info = result;
}

}
catch(Exception ex)
{
ViewBag.Info = ex.Message.ToString();
}
return View();
}
}
}

We are passing our product class object in JSON format to our REST API webservice which will add data into our database table. My webservice URL is :

http://localhost/RestAPIEx/api/AddProduct

and this api accepts Product class object in JSON format, so we are passing the same using HttpClient object like below:

using (var client = new HttpClient())
{
client.BaseAddress = new Uri("http://localhost/RestAPIEx/api/");

var postObj = client.PostAsJsonAsync<Products>("AddProduct", product);
postObj.Wait();

var res = postObj.Result;

var result = res.Content.ReadAsAsync<Result>().Result.result;

ViewBag.Info = result;
}

We are then parsing the response object which is of class Result.

Models>Result.cs:

public class Result
{
public string result { get; set; }
}

Below is the model class used.

YourProjectName > Models > Products.cs:

namespace RestAPIEx.Models
{
public class Products
{
public string productName { get; set; }
public string productDesc { get; set; }
}
}

I will strongly advice to refer the post on How to create HttpGET and HttpPost REST API webservice in ASP.NET MVC, because this post use the webservice made previously.

Add a View for our Index() method on the controller class to create view page.

YourProjectName>Views>Product>Index.cshtml:

@model RestAPIEx.Models.Products

@{
Layout = null;
}

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<style>
body {
padding: 5px;
}

input[type="text"] {
border: 1px solid #000;
padding: 5px;
border-radius: 2px;
width: 150px;
}
</style>
<title>Index</title>
</head>
<body>
<div>

@using (Html.BeginForm())
{
<h2>Consuming REST API:</h2>
<table class="table" style="width:350px;">
<tr>
<td>
Product Name:
</td>
<td>
@Html.TextBoxFor(m => m.productName)
</td>
</tr>
<tr>
<td>
Product Desc:
</td>
<td>
@Html.TextBoxFor(m => m.productDesc)
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input value="submit" type="submit" title="Add" class="btn btn-success" />
</td>
</tr>
</table>
<br /><br />

@ViewBag.Info
}
</div>
</body>
</html>

Now let’s run our project:

Using Web service REST API in ASP.NET MVC forms 01
Using Web service REST API in ASP.NET MVC forms 01
Using Web service REST API in ASP.NET MVC forms 02
Using Web service REST API in ASP.NET MVC forms 02

DOWNLOAD SOURCE CODE