跨源读阻塞（CORB）

Question

我使用jQueryAjax调用了第三方API。控制台中出现以下错误：

跨源读取阻止（CORB）用MIME类型应用程序/json阻止跨源响应MY 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成功方法。

请帮帮我。

Answer 1

返回头为访问-控制-允许-起源：*的响应，请检查下面的Php服务器响应代码。

<?php header('Access-Control-Allow-Origin: *');
header('Content-Type: application/json');
echo json_encode($phparray); 

Answer 2

在大多数情况下，阻塞的响应不应该影响网页的行为，可以安全地忽略CORB错误消息。例如，当阻塞响应的主体已经是空的，或者响应将被传递到无法处理它的上下文（例如，超文本标记语言文档，如正在传递的404错误页面）时，可能会发生警告到标签）。

https://www.chromium.org/Home/chromium-security/corb-for-developers

我必须清理浏览器的缓存，我在这个链接中读到，如果请求得到一个空响应，我们就会得到这个警告错误。我在请求中得到了一些COR，所以这个请求的响应变为空，我所要做的就是清除浏览器的缓存，COR就跑掉了。我收到CORS是因为chrome在缓存中保存了端口号，服务器只接受localhost:3010，而我正在做localhost:3002，因为缓存。

Answer 3

 dataType:'jsonp',

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

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

有关什么是JSONP的更多详细信息，请参见此问题。请注意，在CORS可用之前使用相同的原产地策略，这是一个令人讨厌的黑客行为。CORS是一个更清洁、更安全、更强大的问题解决方案。

看起来你正试图提出一个跨源请求，并在一大堆相互冲突的指令中抛出你能想到的一切。

您需要了解同源策略是如何工作的。

有关详细指南，请参见此问题。

现在，关于您的代码，请注意以下几点：

contentType: 'application/json',

• 当您使用JSONP时，将忽略此选项

去掉那个。

 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权限外，您还需要处理飞行前的请求