跨域读阻塞 (CORB)

Question

我已经使用 Jquery AJAX 调用了第三方 API。我在控制台中收到以下错误：

跨域读取阻止 (CORB) 阻止了 MIME 类型为 application/json 的跨域响应 我的 URL 。有关详细信息，请参阅 https://www.chromestatus.com/feature/5629709824032768 。

我为 Ajax 调用使用了以下代码：

$.ajax({
  type: 'GET',
  url: My Url,
  contentType: 'application/json',
  dataType:'jsonp',
  responseType:'application/json',
  xhrFields: {
    withCredentials: false
  },
  headers: {
    'Access-Control-Allow-Credentials' : true,
    'Access-Control-Allow-Origin':'*',
    'Access-Control-Allow-Methods':'GET',
    'Access-Control-Allow-Headers':'application/json',
  },
  success: function(data) {
    console.log(data);
  },
  error: function(error) {
    console.log("FAIL....=================");
  }
});

当我签入 Fiddler 时，我得到了响应数据，但没有在 Ajax 成功方法中。

请帮帮我。

原文由 Jignesh 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

 dataType:'jsonp',

您正在发出 JSONP 请求，但服务器正在使用 JSON 进行响应。

浏览器拒绝尝试将 JSON 视为 JSONP，因为这会带来安全风险。 （如果浏览器 确实 尝试将 JSON 视为 JSONP，那么它充其量只会失败）。

有关 JSONP 是什么的更多详细信息，请参阅 此问题。请注意，绕过 CORS 可用之前使用的同源策略是一种令人讨厌的黑客攻击。 CORS 是一种更清洁、更安全、更强大的问题解决方案。

---

看起来您正在尝试发出跨源请求，并且将您能想到的所有内容都扔进一大堆相互冲突的指令中。

您需要了解同源策略的工作原理。

请参阅 此问题 以获取深入指南。

---

现在关于您的代码的一些注意事项：

 contentType: 'application/json',

• 当您使用 JSONP 时，这将被忽略
• 您正在发出 GET 请求。没有描述类型的请求体。
• 这将使跨源请求变得不简单，这意味着除了基本的 CORS 权限外，您还需要处理飞行前处理。

删除它。

  dataType:'jsonp',

• 服务器未使用 JSONP 进行响应。

删除这个。 （您可以让服务器改为使用 JSONP 进行响应，但 CORS 更好）。

 responseType:'application/json',

这不是 jQuery.ajax 支持的选项。删除这个。

xhrFields: { withCredentials: false },

这是默认设置。除非您使用 ajaxSetup 将其设置为 true，否则请删除它。

   headers: {
    'Access-Control-Allow-Credentials' : true,
    'Access-Control-Allow-Origin':'*',
    'Access-Control-Allow-Methods':'GET',
    'Access-Control-Allow-Headers':'application/json',
  },

• 这些是响应标头。它们属于响应，而不属于请求。
• 这将使跨源请求变得不简单，这意味着除了基本的 CORS 权限外，您还需要处理飞行前处理。

原文由 Quentin 发布，翻译遵循 CC BY-SA 4.0 许可协议