javascript - AJAX、CORS、Chrome 和 HTTP 错误代码 (401,403,404,500) 的推荐解决方案

标签 javascript google-chrome cors

背景

(如果您熟悉 CORS,可以跳到最后的问题)

CORS [1] 是一种允许浏览器允许从不同域访问资源的解决方案。例如。使用 AJAX 的 REST 数据后端。

在 Internet 上可以很好地观察到,当此类资源需要时,Chrome(和 Webkit friend )不会处理 HTTP 身份验证提示。例如。 [2] (这是为了防止浏览器显示身份验证登录对话框,例如,当图像标签加载失败并显示 401 并且需要凭据时,Web 邮件登录页面。用户可能会被骗输入他们的网络邮件凭据)

Chrome 在这种情况下的行为是放弃响应,几乎是无声地取消请求。

事实上,只有出现 200 时,Chrome 才会让响应正常通过;吞下任何其他状态代码并且 AJAX 调用中止。

如果使用 jQuery 执行 Ajax 请求,并且远程站点以 HTTP 401 状态代码响应,则请求被取消并且 ajax 完成并出现错误,但 401 代码丢失。就好像连接中断或等效的下层问题一样。

我看到的唯一一个专门提到 CORS 警告的网站是 [1]

Browers don't do a good job of reporting what went wrong when there is an error. For example, Firefox reports a status of 0 and an empty statusText for all errors. Browsers also report an error message to the console log, but this message cannot be accessed from JavaScript. When handling onerror, you will know that an error occurred, but not much else.

您可以通过使用 chrome 启动标志来禁用此安全性 - 只是为了测试后端是否“正常”运行,并且一个理智没有因丢失适当的状态代码而受到过度影响。参见[2]

问题

如果后端和前端客户端代码应该使用 401 作为其身份验证过程的一部分怎么办? - 任何失败都只是被破坏成一个“错误”输出。

例如:在发出身份验证请求时 - 例如2 条腿的 OAuth token 请求 - 针对 RESTful 后端 - 使用正确的状态代码 - 客户端不知道是否:

  • 401 用户未通过身份验证。
  • ---连接失败。
  • 400 请求错误。
  • 500 服务器有问题。
  • 207成功后无内容

我们的后端是 非常 RESTfully 编写的,遵循了当时被认为具有成本效益的尽可能多的最佳实践;其中之一是依赖正确的 HTTP 状态代码。 我们使用的 Java REST 客户端运行良好。

现在我已经开始创建一个 Javascript 客户端,用于嵌入网页 - 特别是使用 CORS,我们在 Chrome 等中遇到了这个问题。(注意 Firefox 似乎 很好,但我们通常不会目前关心IE。)

问题

人们做了什么来解决这些问题?
有什么办法可以使 CORS 更适合受信任的后端吗?

链接

  1. CORS 教程:http://www.html5rocks.com/en/tutorials/cors/
  2. Chrome 不允许对资源进行 401 触发的身份验证提示:http://code.google.com/p/chromium/issues/detail?id=81251
  3. --为 Chrome 禁用网络安全:Disable same origin policy in Chrome

最佳答案

刚遇到这个问题。为 401 响应设置 HTTP header 对我有用。如果没有一些自定义,我使用的库无法正确执行此操作。例如:

  self.headers["Access-Control-Max-Age"] = '1728000'
  self.headers["Access-Control-Allow-Origin"] = "http://localhost:3001"
  self.headers["Access-Control-Allow-Methods"] = "ANY"
  self.headers["Access-Control-Allow-Credentials"] = 'true'

关于javascript - AJAX、CORS、Chrome 和 HTTP 错误代码 (401,403,404,500) 的推荐解决方案,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12670851/

相关文章:

javascript - 使用 greensock 为具有相同类 Javascript 的元素独立触发动画

javascript - 选择具有特定 id 和 html 标签值的 html 链接

javascript - 使用 jQuery UI 和 RequireJs 时如何防止用户看到 "ugly"HTML 前兆?

javascript - html 数据列表不显示 chrome 中的选项

html - 为什么这个 css3 标记在我的 chrome 浏览器中不起作用?

javascript - 如何在页面开始加载之前将参数附加到 URL?

ajax - 一个人可以使用 ELB 应用程序负载均衡器(位于 Solr 前面)添加 CORS header 吗?

javascript - CORS 不适用于 jQuery 和 Java

php - 带有 Auth 的 Yii2 CORS 不适用于非 CRUD 操作

javascript - Discord JS Bot 识别特定消息上的特定 react 添加和 react 删除事件