【问题标题】:AngularJS with MVC 6AngularJS 与 MVC 6
【发布时间】:2015-12-02 19:42:56
【问题描述】:

这是一个 MVC 6/WebApi 应用程序。我正在尝试在后端使用 WebApi,在前端使用 AngularJS。

我有两个静态文件:index.html 和 login.html
(最终会有更多的静态文件。)

我的 Angular 应用程序包含在 index.html 中,而视图(例如 /login)是从静态文件(即 login.html)加载的。

如果我转到我的根 URL,则 index.html 加载得很好。但是,如果我转到 /login,我会收到一个 404 页面未找到。

现在,可以这么说,我想用一堆控制器和视图来拖累我的应用程序,因为没有必要简单地提供静态文件。太夸张了。

我设置了路由来服务 API 调用(即 ~/api/whatever)。如何让 MVC 6 忽略所有其他路由?

仅供参考,似乎 MapPageRoute 在 MVC 6 中已被弃用?

编辑:
我为使其正常工作所做的一件事是添加我自己的中间件来拦截请求。下面的代码是在Configure方法中我所有的默认中间件之后添加的:

app.Use(next => async context =>
{
    if (context.Request.Path.Value.StartsWith("/api"))
        await next.Invoke(context);
    else
        await context.Response.WriteAsync(System.IO.File.ReadAllText("index.html"));
});

这似乎有点多,而且只是一个 hack。它所做的只是允许任何以“/api”开头的请求通过(然后由 MVC 中间件拾取),但任何其他调用都使用 index.html 的内容提供服务.因此,如果我请求的 URL 是“/login”,则提供 index.html 文件,然后 Angular 会查看路由并加载 login.html 文件进入视图。

还有其他建议吗?

【问题讨论】:

  • 你用的是什么路由?内部路由器还是 ui-router?
  • 我正在使用 Angular 的 ui-router。另外,重新检查问题...我添加了一个可行的技巧,但正在寻找替代方案。
  • 就其价值而言,您所描述的“看起来像黑客”并不是,这正是 Html5 推送状态路由的处理方式,几乎在每个框架上。
  • @Claies 我提到它是一种 hack,因为在 MVC 的早期版本中有一个扩展方法 MapPageRoute,我们可以使用 MVC 的内置功能将所有请求映射到 index.html 。不幸的是,该方法在 MVC 6 中不再可用。这似乎是一种 hack,因为我原以为 Microsoft(推动 Angular)会制定某种机制来支持这一点,而不是强迫我们使用控制器和动作。

标签: angularjs asp.net-mvc dnx


【解决方案1】:

好的,既然 MVC 6/ASP.NET 5 框架中不存在某些东西,我创建了自己的中间件,它提供了更大的灵活性。它已添加到 GitHub,可通过 NuGet 获得。

项目页面为:https://github.com/a11smiles/AngularMiddleware

【讨论】:

    【解决方案2】:

    我能够做到你所要求的here。基本上,我在我的索引操作中添加了一条捕获所有路由:

    [路线("{*path}")]

    意思是如果没有 MVC 动作不存在,调用我的索引动作和角度路由将从那里开始

    【讨论】:

    • 感谢您的回复,但您没有错过重点……我不想使用控制器/视图。这是一个与 WebApi 通信的纯客户端应用程序。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-07-06
    • 2017-04-09
    • 2016-01-08
    • 1970-01-01
    • 2018-04-08
    • 2017-06-10
    • 1970-01-01
    相关资源
    最近更新 更多