How to consume an API from MVC view in .NET Core api?

Question

I'm building a web API and I want to consume it through an MVC view. The API controller is to insert the user data and the MVC controller is to create the view. I have been looking for information and this is what I have been able to do with that information.

So, the API controller, simply inserts the data to the database through an stored procedure, I've tested with Postman and works fine:

[Route("api/[controller]")]
[ApiController]

public class UserController : ControllerBase
{
    [HttpPost]
    public IActionResult post(Models.Request.UserModel model)
    {
        using (Models.AdminOrchardContext db = new Models.AdminOrchardContext())
        {
            Models.UserModel oUsuar = new Models.UserModel();

            Models.OrchardTable tOrchard = new Models.OrchardTable();

            oUsuar.Name = model.Name;
            oUsuar.Email = model.Email;
            tOrchard.OrchardLocation = model.OrchardLocation;

            var uName = new SqlParameter("@name", oUsuar.Name);
            var uEmail = new SqlParameter("@email", oUsuar.Email);
            var hOrchardLocation = new SqlParameter("@OrchardLocation", tOrchard.OrchardLocation);

            var idUserReg = db.Usuarios.FromSqlRaw("Exec UserAndOrchardInsert @name, @email" +
                "@OrchardLocation",
                new[] { uName, uEmail, hOrchardLocation});

            db.SaveChanges();

        }
        return Ok();
    }
 }

The MVC controller where the view is added, from here the API is used with the user data on the view:

    [HttpPost]
    public IActionResult post(Models.Request.User model)
    {
        HttpClient hc = new HttpClient();
        hc.BaseAddress = new Uri("https://localhost:44325/api/User");

        var addRecToDB = hc.PostAsJsonAsync<Models.Request.User>("User", model);

        addRecToDB.Wait();

        ViewBag.message = "Ok!";

        return View();
    }

And the view:

@model Huerbog.Models.Request.User

@{
    ViewData["Title"] = "post";
 }

<h1>User registration</h1>
<hr />
<div class="row">
    <div class="col-md-4">
        <form asp-action="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Name" class="control-label"></label>
                <input asp-for="Name" class="form-control" />
                <span asp-validation-for="Name" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Email" class="control-label"></label>
                <input asp-for="Email" class="form-control" />
                <span asp-validation-for="Email" class="text-danger"></span>
            </div>
            <h4>Orchard-related field</h4>
            <div class="form-group">
                <label asp-for="OrchardLocation" class="control-label"></label>
                <input asp-for="OrchardLocation" class="form-control" />
                <span asp-validation-for="OrchardLocation" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
            </div>
        </form>
    </div>
    <h4>@ViewBag.message</h4>
</div>

<div>
    <a asp-action="Index">Back to List</a>
</div>

@section Scripts {
     @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

Now, the problem is that when I open the view, even when the API is running, on the page appears the Error 405, I don't know what or where exactly is the error.

have you debug the MVC controller and check the response from the API? — Annamalai D
– Annamalai D, Commented Apr 2, 2021 at 4:58

Fei Han · Accepted Answer · 2021-04-02 07:42:28Z

1

the problem is that when I open the view, even when the API is running, on the page appears the Error 405, I don't know what or where exactly is the error.

Please note that your action post contains the [HttpPost] attribute, which constrains matching to HTTP Post request(s) only.

While you enter URL to access https://xxx/controller_name/post from browser side, browser would help make HTTP Get request to server, which cause 405 Method Not Allowed error.

To fix it, you can try to add a HttpGet post method to make the endpoint support HTTP Get method request(s), like below.

[HttpGet]
public IActionResult post()
{
    return View();
}

[HttpPost]
public IActionResult post(Models.Request.User model)
{
    //...

edited Apr 2, 2021 at 7:42

answered Apr 2, 2021 at 7:28

Fei Han

28k1 gold badge35 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Daniel Over a year ago

So, for every request, like PUT or DELETE it should have an HttpGet? sorry if the question is very dumb, but I'm new with this.

Collectives™ on Stack Overflow

How to consume an API from MVC view in .NET Core api?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related