HTML5模式与Hash模式AngularJS的优点/缺点

Question

使用AngularJS 1.3 <base>时,在HTML5模式下需要标记,这让我想到了HTML5模式与Hash模式的优点/缺点.

使用Hash模式时,缺点是如果您希望用户自己键入URL,则URL略显丑陋并且不直观.HTML5模式(1.3)的缺点是需要<base>标签,这可能会产生许多问题(比如使用SVG有点痛苦).

对于这两种模式我还有其他任何缺点吗？

Answer 1

使用历史记录API可使您拥有一个真实的URL，该URL可以具有服务器直接提供的适当内容。

这个：

• 即使用户访问的第一页不是主页，也可以使您以正确的状态加载页面。（这比在首页状态下加载它，然后在读取哈希表之后用JS对其进行更改要快得多）
• 为搜索引擎提供良​​好的内容以进行索引（无需使用Google的（如今已不推荐使用的）哈希爆炸））
• 即使JavaScript 出于任何原因失败，也允许URL工作。

另请参见使用哈希刘海打破网络。

哈希方法：

• 在古代浏览器中工作
• 如果您不花精力在服务器端进行构建，就不要假装有服务器端的后备。

注意：当您使用History API时，古老的浏览器可能会简单地跟随指向服务器生成页面的链接。

也就是说，Angular对History API的使用非常差。

以下引用来自文档：

使用此模式需要在服务器端重写URL，基本上，您必须重写指向应用程序入口点的所有链接（例如index.html）。

这个建议太糟糕了。如果您使用的是历史记录API，则应使用渐进式增强功能编写服务器端代码牢记。通过将每个URL重写为引导Angular并且不执行其他任何操作的HTML文档，您将拥有由服务器处理的不同URL毫无意义。您还完全依赖JS的工作方式，因为没有办法让服务器在失败时交付内容。

简而言之，这种方法出于纯粹的外观原因而使用History API，然后使用肮脏的方法来避免404错误。

对于支持HTML5历史记录API的浏览器，$ location使用HTML5历史记录API编写路径和搜索。如果浏览器不支持历史记录API，则$ location提供一个Hashbang URL。

这是Angular遵循的哲学，即History API出于美观而非实际原因的结果。Angular不会使用服务器提供的常规页面，而是为每个资源使用两个URL（一个历史API和一个Hashbang）。