jQuery 如何解决此问题：跨域读取阻塞 (CORB) 阻止了跨域响应
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/55159973/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How To Solve This Problem : Cross-Origin Read Blocking (CORB) blocked cross-origin response
提问by Smit Pipaliya
Warning is :
警告是：
jquery-1.9.1.js:8526 Cross-Origin Read Blocking (CORB) blocked cross-origin response https://www.metaweather.com/api/location/search/?query=lowith MIME type application/json. See https://www.chromestatus.com/feature/5629709824032768for more details.
jquery-1.9.1.js:8526 跨域读取阻止 (CORB) 阻止了跨域响应https://www.metaweather.com/api/location/search/?query=lo与 MIME 类型 application/json。有关更多详细信息，请参阅https://www.chromestatus.com/feature/5629709824032768。
My Code is:
我的代码是：
<!DOCTYPE html>
<html>
<head>
<title> Search API </title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js">
</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="container">
<h2>API Search Whether</h2>
<div class="row">
<div class="col-md-6">
<input type="text" name="name" id="name" class="form-control">
</div>
<div class="col-md-2">
<button type="button" id="search" class="btn btn-primary btn-lg">Search</button>
</div>
</div>
<br><br><br><br>
<div class="row">
<table class="table" border="2px">
<thead>
<tr style="color:blue; font-weight:bold;">
<td >Domain</td>
<td>Suffix</td>
<td>Expiry Date</td>
<td>Created At</td>
<td>Country</td>
</tr>
</thead>
<tbody id="tbody">
</tbody>
</table>
</div>
</div>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js">
</script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>
<script type="text/javascript">
$("#search").click(function ()
{
$("#tbody").html("");
var $this = $(this);
var loadingText = '<i class="fa fa-circle-o-notch fa-spin"></i>Loading...';
$("#search").attr("disabled", true);
if ($(this).html() !== loadingText) {
$this.data('original-text', $(this).html());
$this.html(loadingText);
}
var name = $('#name').val();
var i;
$.ajax({
url: "https://www.metaweather.com/api/location/search/?query="+name,
dataType:'json',
headers: function(xhr){
xhr.setRequestHeader('x-xss-protection' ,'1; mode=block');
xhr.setRequestHeader('Content-Language' ,'en');
xhr.setRequestHeader('x-content-type-options', 'nosniff');
xhr.setRequestHeader('strict-transport- security' , 'max-age=2592000; includeSubDomains');
xhr.setRequestHeader('Vary' , 'Accept-Language, Cookie');
xhr.setRequestHeader('Allow' , 'GET, HEAD,OPTIONS');
xhr.setRequestHeader('x-frame-options' ,'DENY');
xhr.setRequestHeader('Content-Type' , 'application/json');
xhr.setRequestHeader('X-Cloud-Trace-Context' , 'f2dd29a5a475c5489584b993c3ce670d');
xhr.setRequestHeader('Date' , 'Thu, 14 Mar 2019 09:43:04 GMT');
xhr.setRequestHeader('Server' , 'Google Frontend');
xhr.setRequestHeader('Content-Length' , '100');
},
success: function (result) {
var f = result;
var content = '';
var i;
for (i = 0; i <= f[i] ; i++) {
content += "<tr>";
content = content+"<td>"+f[i].title+"</td>";
content = content + "</tr>";
}
$("#tbody").append(content);
$this.html($this.data('original-text'));
$("#search").attr("disabled", false);
}});
});
</script>
</body>
I Tried last 4 Hours But No Solution... Advance Thank You For Help...
我尝试了最后 4 小时但没有解决方案...提前谢谢您的帮助...
采纳答案by Athman
I had this issue too happen our Chrome Extension recently and closed it by moving all HTTP requests to the background page as advised by the Chrome team at 3. Limit Cross-Origin Requests in Background Pages
我最近也遇到了这个问题，我们的 Chrome 扩展程序最近按照 Chrome 团队的建议将所有 HTTP 请求移动到后台页面来关闭它。 限制后台页面中的跨源请求
If an extension's background page simply fetches and relays any URL of a content script's choice (effectively acting as an open proxy), then similar security problems occur. That is, a compromised renderer process can hiHyman the content script and ask the background page to fetch and relay sensitive URLs of the attacker's choosing. Instead, background pages should only fetch data from URLs the extension author intends, which is ideally a small set of URLs which does not put the user's sensitive data at risk.
如果扩展程序的后台页面只是获取并中继内容脚本选择的任何 URL（有效地充当开放代理），则会出现类似的安全问题。也就是说，受损的渲染器进程可以劫持内容脚本并要求后台页面获取和中继攻击者选择的敏感 URL。相反，后台页面应该只从扩展作者想要的 URL 中获取数据，理想情况下，这是一小组 URL，不会将用户的敏感数据置于危险之中。
回答by Samy Baxy
I don't consider this an absolute answer because I am also having the same bug on a chrome extension I built. Now, following the suggestion from CORB (Cross Origin Read Blocking) The Chrome team updated the security of the browser in version 73+ which guards against the spectre and meltdown vulnerability.
我不认为这是一个绝对的答案，因为我在我构建的 chrome 扩展上也有同样的错误。现在，根据 CORB（跨源读取阻止）的建议，Chrome 团队在 73+ 版本中更新了浏览器的安全性，以防范幽灵和崩溃漏洞。
On this link, they provide the means on how developers should go about fixing errors from this update: https://www.chromium.org/Home/chromium-security/corb-for-developers
在此链接上，他们提供了有关开发人员应如何修复此更新中的错误的方法：https: //www.chromium.org/Home/chromium-security/corb-for-developers
The parent resource for this is: https://www.chromestatus.com/feature/5629709824032768when I find my fix, I'll be updating this post with it.
这个的父资源是：https: //www.chromestatus.com/feature/5629709824032768当我找到我的修复程序时，我会用它更新这篇文章。
