angularjs - IIS 网站文件夹中的 AngularJS/WebAPI 应用程序出现问题

Question

这是我的问题。我有一个 Angular/WebAPI 项目托管在 IIS 8 的域子文件夹中。当我访问文件夹名称后带有尾部斜杠的网站时，一切正常。但是，如果我省略尾部斜杠，当 Angular 为路线添加“#/”时，它就会中断。

Example: http://www.domain.com/folder/ becomes http://www.domain.com/folder/#/ <- OK
         http://www.domain.com/folder becomes http://www.domain.com/folder#/ < - Breaks

我开始使用的 AngularJS 模板没有这个问题。我不明白是什么导致了这个问题，也不知道如何继续。

有关该项目的其他信息 我正在使用 MVC Bundles 来最小化 javascript 和 css 我在同一个项目中有 WebAPI Controller 我在同一项目中使用 Microsoft OWIN 进行身份验证 除了这个初始 URL 问题之外，该项目运行正常。 我无法在 Visual Studio 中重现此问题，但 VS 不在文件夹中运行。 如果需要，我可以发布 Angular 路线。

Answer 1

这是相对路径在 HTML 中如何工作的问题，而不是 Angular 特有的问题。这是在虚拟 URL 概念真正出现之前 URL 和相关链接的原始规范的结果。

HTML 页面上的相对链接与 HTML“文档”本身具有相同的基础。因此，如果 url 是:

http://domain.com/folder/

然后，您的浏览器将相对 URL 锚定在

http://domain.com/folder/[relativePathHere] 

浏览器假定它正在查看该文件夹中的默认文档(index.html、home.htm 等)—— 最初是该目录中文件的索引。但是，如果没有尾部斜杠，浏览器会认为“/folder”实际上是一个名为“folder”的文件，该文件位于服务器的根文档目录中(因为它无法区分 - 它不关心一种方式或其他是否有文件扩展名)。因此，所有相对路径都锚定在

http://domain.com/[relativePathHere]

这就是为什么您在没有尾部斜杠的情况下出现相对路径问题的原因。要纠正此问题，您需要在 IIS 中设置重写规则。这样，在交付默认 HTML 文件之前，您将立即重定向到带有尾部斜杠的版本。这是很常见的事情(不仅仅是对于这种类型的情况 - 这对于 SEO 也很重要，这样爬虫就不会认为有两个不同的页面)。

查看以下链接中的提示#1:http://ruslany.net/2009/04/10-url-rewriting-tips-and-tricks/

按照添加尾部斜杠的说明进行操作，您应该已完成设置。