Question

我有一个平均堆栈网站，html5mode启用$locationProvider.html5Mode(true)。 index.html如下所示：

<html>
<head>
    <base href="/" />
    ...
</head>
<body ng-app="f">
    <ui-view ng-cloak></ui-view>
</body>
</html>

由于html5mode，我们可以在浏览器中加载，例如。 https://localhost:3000/home，将保持不变;如果没有html5mode，该网址将变为https://localhost:3000/#/home。

现在我希望服务器（除了网站之外）也是一个Office加载项。我需要能够在加载项清单文件中执行<SourceLocation DefaultValue="https://localhost:3000/addin" />。为此，我需要补充一下 <script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>中的index.html。

但是，我发现在网站<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>中添加index.html后，在浏览器中加载https://localhost:3000/home会变为https://localhost:3000/#/home，这意味着添加office.js次禁用html5mode。

有谁知道怎么回事？有没有人有解决方法？

Answer 1

查看office.js文件的调试版本：

https://appsforoffice.microsoft.com/lib/1/hosted/office.debug.js

您将看到窗口的历史记录replaceState和pushState函数设置为null：

window.history.replaceState = null;
window.history.pushState = null;

这会禁用操纵浏览器历史记录的能力，而且似乎Angular认为历史API不可用，因此Angular会回退到主题标签导航。

您可以删除这两行代码以重新启用html5mode，但考虑到历史API绝对是因某种原因而被禁用的，可能会导致office.js插件在启用html5mode时无法正常运行< /强>

Answer 2

修改＆＃34; office.js＆＃34;本身是错误的做法。首先，商店目前要求您参考官方Office.js CDN;所以，这种方法有问题。此外，您不希望自己不得不继续将相同的修补程序应用于经常更改的一组文件，也不要仅仅因为那是旧的版本。你被修改了。

更好的方法是使用填补空白的附加文件，但仅作为附加内容。它的侵入性更小，不易破碎。

特别针对历史问题：请参阅Office.js nullifies browser history functions breaking history usage了解使用polyfill启用历史记录的方法。

Answer 3

将评论作为答案

据我所知，office.js仅适用于办公应用，在这种情况下，不会给你的网络应用程序带来办公室j负担。使用ocLazyLoad（或其他类似的库）仅在需要时可选地/动态加载office.js。

添加office.js会禁用html5mode

3 个答案: