Adding a controller in a React dotnet 7 app

Question

I created my dotnet 7 react application using:

dotnet new react -o my-new-app

Based on: https://learn.microsoft.com/en-us/aspnet/core/client-side/spa/react?preserve-view=true&tabs=netcore-cli&view=aspnetcore-7.0

Now, following:

https://learn.microsoft.com/en-us/aspnet/core/tutorials/first-mvc-app/adding-controller?view=aspnetcore-7.0&tabs=visual-studio-code

I tried to add my controller called UserInfoController.cs (created within the Controllers folder)

using Microsoft.AspNetCore.Mvc;
using System.Text.Encodings.Web;

namespace my-new-app.Controllers;

public class UserInfoController : Controller
{
    public string Index()
    {
        return "Default Action for User Controller";
    }

    public string Welcome()
    {
        return "The is the Welcome Action";
    }
}

Yet, whenever I run the link that makes the call

 https:// ..... /UserInfo

I get the response:

No routes matched location "/UserInfo"

The application is running anyway. I also have:

app.MapControllerRoute(
    name: "default",
    pattern: "{controller}/{action=Index}/{id?}");

Am I missing something?

Try https://.../User instead. If that doesn't work, look at what you have set up for app.MapControllerRoute. — Brian
– Brian, Commented Nov 27, 2023 at 22:23
I changed User to UserInfo and still having this problem (please, see updated question). I wonder if there is a problem with the AppRoutes.js file. — Jose Cabrera Zuniga
– Jose Cabrera Zuniga, Commented Nov 27, 2023 at 22:56

Jerry Fu · Accepted Answer · 2023-11-28 06:50:53Z

2

You need to add the routes to the setupProxy.js in the "clientApp"
For example, I create an api controller to return string with route "/api/values/test"

    [Route("api/[controller]")]
    [ApiController]
    public class ValuesController : ControllerBase
    {
        [HttpGet("test")]
        public string test()
        {
            return "Successfully call the backend controller";
        }
    }

Go to client App open the "setupProxy.js"

Add "/api/values/test" into the "context" Arrary

Now you could visit the route with no problem.

You could also proxy the whole "values" controller like this

answered Nov 28, 2023 at 6:50

Jerry Fu

9,7481 gold badge7 silver badges16 bronze badges

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

Collectives™ on Stack Overflow

Adding a controller in a React dotnet 7 app

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related