React ASP.NET Core预览项目请求无法路由至自定义WordController

步骤1：修正前端请求路径 #

你的前端代码目前大概率仍在请求/weatherforecast，需要把请求路径改成对应WordController的接口路径。比如控制器里有个GetWord的Action，请求路径要写成/word/GetWord（具体根据控制器路由规则调整）。

步骤2：确认后端WordController的路由配置 #

打开WordController.cs，检查路由特性是否匹配代理规则：

• 如果想让路由直接匹配/word开头的请求，控制器上要添加如下配置：

  [Route("[controller]")]
  [ApiController]
  public class WordController : ControllerBase
  {
      [HttpGet]
      public IActionResult Get()
      {
          return Ok("来自WordController的响应");
      }
  }
  

• 如果控制器用了api前缀（比如[Route("api/[controller]")]），那需要把Vite代理里的^/word改成^/api/word，保证前后端路由规则一致。

步骤3：完善Vite代理配置 #

当前代理缺少changeOrigin: true参数，这会导致后端无法正确识别请求来源，补充后配置如下：

export default defineConfig({
    plugins: [plugin()],
    resolve: {
        alias: {
            '@': fileURLToPath(new URL('./src', import.meta.url))
        }
    },
    server: {
        proxy: {
            '^/word': {
                target: 'https://localhost:7106/',
                secure: false,
                changeOrigin: true // 新增该行，解决跨域标识问题
            }
        },
        port: 5173,
        https: {
            key: fs.readFileSync(keyFilePath),
            cert: fs.readFileSync(certFilePath),
        }
    }
})

步骤4：验证后端Action的HTTP特性 #

确保控制器内的Action方法添加了对应的HTTP特性，比如[HttpGet]、[HttpPost]，否则ASP.NET Core无法正确映射请求。

步骤5：重启前后端服务 #

修改配置后，重启Vite开发服务器和ASP.NET Core后端服务，确保所有配置生效。

额外检查点 #

• 直接在浏览器访问https://localhost:7106/word（对应控制器的Get接口），确认后端服务正常运行且接口能返回响应。
• 打开浏览器开发者工具的Network面板，查看请求路径和响应状态，排查是否存在路径写错或代理未生效的情况。

内容的提问来源于stack exchange，提问作者user2049142