提供来自不同目录的 Web 文件 - 错误 400 错误请求答案

【问题标题】：Serve up web files from different directory - Error 400 Bad Request提供来自不同目录的 Web 文件 - 错误 400 错误请求
【发布时间】：2016-03-23 01:02:53
【问题描述】：

我有一个使用 AngularJS 的 MVC 应用程序。我正在将文件夹结构组织为基于功能而不是基于类型。

现在是一个示例文件夹结构

应用程序（主项目中的文件夹，与视图处于同一级别）
- 资产
  - CSS
  - JS
- 页数
  - 首页
    - home.js
    - home.tests.js
    - home.html
  - 关于（等）

现在的问题是当ui-router 尝试加载home.html 时，Web 服务器会抛出 400 错误。如果我在浏览器中手动访问该文件，它就可以工作。这里有什么问题？为什么我不能从此目录中提供文件。请注意，我实际上是在控制台中右键单击 400 消息并选择在新选项卡中打开。所以我知道我正在查看的文件是从 AngularJS 请求的 URL

这是我的ui-router 设置

.state('home', {
    url: '/home',
    templateUrl: '/app/pages/home/home.html',
    controller: 'mainPageController'
})

注意： 我从同一个目录提供了一个 .js 文件，这似乎工作正常！

【问题讨论】：

如果您使用的是 IIS，您应该在 IIS 日志中看到更详细的错误消息。
这个问题是只存在于生产环境还是所有环境中？
我只在dev atm，所以使用IIExpress..这是错误消息2015-10-14 15:19:16 ::1 GET /app/pages/home/home.html - 1904 - ::1 Mozilla/5.0+(Windows+NT+6.1;+WOW64)+AppleWebKit/537.36+(KHTML,+like+Gecko)+Chrome/45.0.2454.101+Safari/537.36 http://localhost:1904/ 400 0 87 1
尝试删除模板网址中 /app 前面的斜线。
我得到完全相同的错误；/

标签： angularjs asp.net-mvc

【解决方案1】：

我遇到了完全相同的问题，它是由另一个开发人员试图修复 IE 缓存错误引起的。

我在这里找到了 Ben Cull 的解决方案：https://stackoverflow.com/a/30014936/710268。

//initialize get if not there
if (!$httpProvider.defaults.headers.get) {
    $httpProvider.defaults.headers.get = {};
}

//disable IE ajax request caching
$httpProvider.defaults.headers.get["If-Modified-Since"] = "Fri, 01 Jan 2010 00:00:00 GMT";

我的问题是“If-Modified-Since”标头设置为“0”，并且由于某种原因导致 html 模板文件无法加载。

【讨论】：

有趣的一点，谢谢，但是我认为它在任何浏览器中都不起作用！无论如何，我已经相应地更新了我的代码:)
它对我来说也不能在任何浏览器中工作。我刚刚提到了 IE 错误，因为试图修复缓存错误是导致此错误的原因，最终导致所有浏览器都崩溃。

【解决方案2】：

默认情况下，路由器将从 MVC 项目的顶层（即 Views 和 App 文件夹所在的位置）开始，而不是从提供 JavaScript 的文件夹开始。

所以在 Angular 中，你的 templateUrl 需要是 App/Pages/Home/home.html。

因此，在您的角度路由器配置中具有以下属性：

templateUrl: 'App/Pages/Home/home.html'

【讨论】：