Consume the OrderCloud API in an ASP.NET Core MVC Application

In this blog post, I use the  .NET SDK for OrderCloud to pull a product list from a OrderCloud Market place. I have used a asp.net core MVC web app to consume the OrderCloud API results! Just keep it simple!

My clunky OrderCloudLibrary - this is from my earlier blog - just moved it to a .net core 3.1 Class library:


///////////////////////////////////////////////////////////////////////

 public class APIClientLibrary

    {

        public OrderCloudClient Get()

        {

            return new OrderCloudClient(new OrderCloudClientConfig

            {

                ClientId = "8DD363B7-217B-40F8-96F7-EB961136003D",

                // client credentials grant flow:

                ClientSecret = "ZsCfJKSC79Rn86oQFWuY3Rp8Toe9VidS2aM2rvCgZ0PYOo14hgip3kR8aDxl",

                GrantType = GrantType.ClientCredentials,


                Roles = new[] { ApiRole.FullAccess },

                ApiUrl = "https://sandboxapi.ordercloud.io",

                AuthUrl = "https://sandboxapi.ordercloud.io"

            });


        }

    }

///////////////////////////////////////////////////////////////////////

Client Id and Secret should come from a secret vault rather than litter in the code!

My Clunky Controller methods:

1. Product List method:

The code that does the listing:

public async Task<IActionResult> IndexAsync()

        {

            APIClientLibrary apiClient = new APIClientLibrary();


            var client = apiClient.Get();

            var products = await client.Products.ListAsync(); //love the SDK so useful

            return View(products.Items.ToList());

        }


2. Product Save method:

[HttpPost]

        public async Task<ActionResult> IndexAsync(string name, string desc,int count, decimal width, decimal height, decimal length, decimal weight)

        {

            APIClientLibrary apiClient = new APIClientLibrary();


            var client = apiClient.Get();

            Product product = new Product

            {

                Description = desc,

                Name = name,

                SpecCount=count,

                ShipWeight = weight,

                ShipWidth = width,

                ShipHeight = height,

                ShipLength = length

            };

            var result = await client.Products.CreateAsync(product);


            var products = await client.Products.ListAsync();

            products.Items.Add(product);

            return View(products.Items.ToList());

        }

The Beautiful View: Index.cshtml

@using OrderCloud.SDK;

@model IEnumerable<Product> 

<style>

    thead {

        width: 100%;

        text-align:center;

    }

    td {

        text-align: left;

    }

    th {

        background-color: darkred;

        color:white;

    }

    

</style>


<div class="text-center">

    <h1 class="display-4">Welcome</h1>

    <p>My Product List from OrderCloud MarketPlace</p>

    <form method="post" name="form1" id="form1">

        <table>

            <tr><td>Name: </td><td><input type="text" id="name" name="name" /></td></tr>

            <tr><td>Description: </td><td><input type="text" id="desc" name="desc" /></td></tr>

            <tr><td>Count: </td><td><input type="text" id="count" name="count"  /></td></tr>

            <tr><td>Width: </td><td><input type="text" id="width" name="width" /></td></tr>

            <tr><td>Height: </td><td><input type="text" id="height" name="height" /></td></tr>

            <tr><td>Length: </td><td><input type="text" id="length"  name="length"/></td></tr>

            <tr><td>Weight: </td><td><input type="text" id="weight" name="weight"/></td></tr>

            <tr><td colspan="2"><input type="submit" tex="Submit" style="background-color:darkblue;color:white" /></td></tr>

        </table>

        <table id="example" class="container" style="width:100%">

            <thead>

                <tr>

                    <th>Name</th>

                    <th>Description</th>

                    <th>Count</th>

                    <th>Width</th>

                    <th>Height</th>

                    <th>Length</th>

                    <th>Weight</th>

                </tr>

            </thead>

            <tbody>

                @foreach (Product m in Model)

                {

                    <tr><td>@m.Name</td><td>@m.Description</td><td>@m.SpecCount</td><td>@m.ShipWidth</td><td>@m.ShipHeight</td><td>@m.ShipLength</td><td>@m.ShipWeight</td></tr>


                }

            </tbody>

        </table>

    </form>


</div>



Grid up-to-date on adding data and submit:



GitHub

Comments