.NET Core React 项目中的 MVC 路由没有选择我的控制器

Question

我正在学习如何使用 ASP.NET Core 创建 React 应用程序。作为一个新手，我从一开始就尝试在主页上显示“Hello World”。我已经使用 Visual Studio 的默认 React.js 项目模板来帮助我入门。路由设置为默认值。这是我的文件：

Home.js：

import React, { Component } from 'react';

export class Home extends Component {

    constructor(props) {
        super(props);
        this.state = { message: "" };

        fetch('api/Home/Message')
          .then(response => response.json())
          .then(data => {
          this.setState({ message: data });
        });

    }

  render () {
      return (

            <h1>{this.state.message}</h1>

    );
  }
}

HomeController.cs：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;


namespace TestingReactDotNet.Controllers
{
[Route("api/[controller]")]   
public class HomeController :  Controller
    {
        [HttpGet]
        public async Task<IActionResult> Message()
        {
            var response = "Hello World";
            return Ok(response);
        }
    }
}

问题在于被解析为 Json 的 HTTP 响应不是正确的。我已将其 console.logged 以尝试调试，似乎response.json()) 正在检索模板应用程序附带的默认public/index.html 文件中的所有文本。有谁知道这是为什么？

如果我遗漏了一些非常明显的东西，我深表歉意 - 我使用的是 Mac，因此文件结构和 Visual Studio IDE 完全不同，我已经很难理解其中的很多教程/答案。

Answer 1

要访问您的 Message() 函数，您必须对 'api/Home' 而不是 'api/Home/Message' 进行 HttpGet。

如果您希望端点为 'api/Home/Message'，那么您必须为 Message() 函数指定路由，如下所示：

// api/Home/Message
[HttpGet, Route("Message")]
public async Task<IActionResult> Message()

Answer 2

Controller 类用于生成完整网页的 MVC。

对于 Web API，您需要扩展 ControllerBase。你应该直接返回你的值/对象：

[Route("api/[controller]")]
[ApiController]
public class HomeController :  ControllerBase
{
    [HttpGet, Route("message")]
    public async Task<string> Message()
    {
        var response = "Hello World";
        return response;
    }
}