刷新时没有加载Angular2页面答案

【问题标题】：Angular2 page not loading when refresh刷新时没有加载Angular2页面
【发布时间】：2016-11-01 19:03:04
【问题描述】：

我有问题。当我在锚点上点击我的索引时

<a href ="/month/1">Month</a>

我的应用没有加载，但同时当我点击组件中的锚点时

<a routerLink="/month/1"> Month</a>

我的应用加载页面。这是我的路线。

{ path: 'month/:id', component: MonthComponent },

当我刷新页面时从组件加载页面时，它会引发与我来自索引时相同的错误。在我在 url 中添加参数之前，我没有这个问题。我尝试在索引中使用 routerLink，但它甚至没有加载 url。

【问题讨论】：

我已经写过这个问题了，看看：stackoverflow.com/questions/39649220/…
当你说“它抛出相同的错误”时，你的意思是它正在显示浏览器404页面，还是控制台有错误？

标签： javascript angular routing load

【解决方案1】：

很可能是由于服务器端路由。使用链接 href，浏览器正在向托管您的应用程序的服务器发出请求。如果您还没有设置您的网络服务器将所需路径路由到您的单页应用程序，它将在系统中查找服务器上存储在 where.com/month/1 的内容

如果您使用您的主机类型（例如 ExpressJS、IIS 等）更新您的问题，我可以提供一个具体示例来提供帮助

使用 IIS URL 重写 (web.config) 的示例

<rewrite>
  <rules>
      <rule name="Redirect To Index" stopProcessing="true">
          <match url="(.*)" />
          <conditions>
              <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
          </conditions>
          <action type="Rewrite" url="index.html" />
      </rule>
  </rules>
</rewrite>

【讨论】：

它在 localhost:3000 上。我正在使用 npm
@IoanStoianov 你用什么在本地托管它？
我正在使用 npm lite-server @Fiddles
@IoanStoianov 我很茫然，lite-server 应该按照您的预期执行此操作。您是否进行了任何 bs-config 覆盖？另外，只是检查一下，您的索引页是“index.html”吗？

【解决方案2】：

这是由于服务器被调用（服务器端路由）。您如何解决问题取决于您如何为您的应用程序提供服务。只需 Html 和 JS（来自转译代码），那么上面对 web.config 进行调整的答案就可以了。如果您使用 MVC 来提供应用程序，那么您将需要调整路由以将请求传递回客户端。

.Net Core 示例：

        app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");

            routes.MapSpaFallbackRoute(
                name: "spa-fallback",
                defaults: new { controller = "Home", action = "Index" });
        });

【讨论】：