我们通常提到跨域问题的时候，相信大家首先会想到的是 CORS(跨源资源共享)，其实 CORS 只是众多跨域访问场景中安全策略的一种，类似的策略还有：

• COEP: Cross Origin Embedder Policy：跨源嵌入程序策略
• COOP: Cross Origin Opener Policy：跨源开放者政策
• CORP: Cross Origin Resource Policy：跨源资源策略
• CORB: Cross Origin Read Blocking：跨源读取阻止

COEP、COOP 这两个新策略我已经在前面的文章中介绍过了，感兴趣的可以看新的跨域策略：使用COOP、COEP为浏览器​ ​前端培训​ ​创建更安全的环境

今天，我来给大家介绍一下 CORB: Cross Origin Read Blocking (跨源读取阻止)

互联网是一个非常复杂多样的环境，我们可以在上面做各种事情，有的时候我们在上面存钱、有的时候在上面看视频，但是你肯定不希望看视频的网站知道你存了多少钱，所以在浏览器中不同来源的站点不能互相访问，我们熟悉的另一个名称是：同源策略。

但是很多恶意网站会通过各种巧妙的手段绕过这个限制，站点隔离是 Chrome 中的一项安全功能，它提供了额外的防护措施，可以降低此类攻击成功的可能性。

它可以确保始终将来自不同网站的页面置于不同的流程中，每个流程都在沙箱中运行，以限制流程的执行范围。它还阻止了从其他站点接收某些类型的敏感数据的过程。

跨域读取阻止

即使所有不同源的页面都处于自己单独的进程中，页面仍然可以合法的请求一些跨站的资源，例如图片和 JavaScript 脚本，有些恶意网页可能通过 <img> 元素来加载包含敏感数据的 JSON 文件：

<img src="https://your-bank.example/balance.json">
<!-- Note: the attacker refused to add an `alt` attribute, for extra evil points. -->
如果没有 站点隔离 ，则 JSON 文件的内容会保存到渲染器进程的内存中，此时，渲染器会注意到它不是有效的图像格式，并且不会渲染图像。但是，攻击者随后可以利用 Spectre 之类的漏洞来潜在地读取该内存块。
 
 
Spectre 漏洞我也在这片文章介绍过了 新的跨域策略：使用COOP、COEP为浏览器创建更安全的环境
 
攻击者可以使用 <img> 而不是使用 <script> 来将敏感数据提交到内存：
 
<script src="https://your-bank.example/balance.json"></script>
跨域读取阻止（CORB）是一项安全功能，它可以根据其 MIME 类型防止 balance 内容进入渲染器进程内存中。
 
我们看一下 CORB 的工作方式。网站可以从服务器请求两种类型的资源：
 
数据资源，例如 HTML，XML 或 JSON 文档
媒体资源，例如图像，JavaScript，CSS或字体
 
使用 CORS 头，如 Access-Control-Allow-Origin: * ，网站能够从自己的来源或其他来源接收数据资源。另一方面，媒体资源可以来自任何来源，即使没有允许的 CORS 头。'
 
如果发生以下情况，CORB 会阻止渲染器进程接收跨域数据资源（即 HTML，XML或JSON）：
 
资源具有 X-Content-Type-Options: nosniff Header
CORS 并未明确允许访问资源
 
如果跨域数据资源未设置 X-Content-Type-Options: nosniff Header，则 CORB 尝试嗅探响应主体以确定它是 HTML，XML 还是 JSON。这是必需要做的的，因为某些 Web 服务器配置不正确，例如将图像配置为 text/html。
 
使用 CORB 策略
 
为了使我们的网站更加安全，建议所有网站都开启 CORB，只需要下面的操作：
 
配置正确的 Content-Type 。（例如，HTML 资源设置 text/html）。
开启 X-Content-Type-Options: nosniff 来防止站点进行自动 MIME 嗅探
                    我们通常提到跨域问题的时候，相信大家首先会想到的是 CORS(跨源资源共享)，其实 CORS 只是众多跨域访问场景中安全策略的一种，类似的策略还有：COEP: Cross Origin Embedder Policy：跨源嵌入程序策略	COOP: Cross Origin Opener Policy：跨源开放者政策	CORP: Cross Origin Resource Policy：跨源资源策略	CORB: Cross Origin Read Blocking：跨源读取阻止COEP、COOP 
				
原文地址：http://my.oschina.net/lichaoqiang/blog/317823
在浏览器请求中，出现跨域访问资源的问题，我们肯定会遇到。如果跨域请求被阻止，有可能导致css、js 、ajax请求、font字体等资源出现无法正常访问的问题。接下来，就介绍下解决同源策略不允许读取远程资源的问题。
  今天就谈下远程字体跨域的问题。
  直接了当了说，解决此类...
handwrite 手写一些常见实现的 demo
angular-module angular1.x 模块依赖
angular-todolist angular1.x 所开发的单页面应用
typescript
cilpboard 粘贴板测试
generator
corb 跨域读取阻止
vue-router
vue-ssr
hmr HMR 源码解析
prerender-spa 预渲染
microfe-single-spa 微前端
koa koa 的一个跨域请求
web-communication Web 端即时通讯技术盘点
canvas canvas 进度
通过将src中的http改为https消除了警告。
PS：以上是我之前遇到该问题的解决办法，但由于对前端接触不多，对于该报错的其他产生情形和解决方法不甚了解，随着阅读量的提升有点慌，还望各位大佬不吝指教。
基于注解的CORS支持基于Spring的项目的方法。
该库在生产站点中已经运行了将近两年，但是可惜， 。 它们的实现部分基于此工作，因此，我建议在可能的情况下在第3方库（如此类）上使用Spring的内置支持。
 如果您无法使用4.2或更高版本的Spring，请随时使用此库来满足您的CORS需求。
浏览器已采用标准，以保护用户免受恶意站点的侵害。 当浏览器检测到当前页面正在向“原点”（而不是该页面的加载位置）发出请求时，浏览器会应用一些规则来决定是否允许该请求。 当页面要求浏览器发送与其他站点关联的任何cookie或在请求上添加自定义标头时，这一点尤其重要。 想象一下，如果您浏览的任何页面都可能要求浏览器向银行发送汇款请求，并且浏览器盲目地将您的会话Cookie随同发送，那将给您带来灾难。
 CrossOrigin是一个小型库，它为CORS请求添加了服务
我的项目用到vue-router实现单页面应用
我配置了一个路由是：http://localhost:8080/user/:id，当访问的时候，还是访问主页，但会根据路由变化加载一个chunk文件来动态加载Vue组件。
但chunk文件的路径如下：
 <script type="text/javascript" src="dist/2.chunk.js"></script>
看清楚了没，没错，就是因为路径开头少了个/，应该是 ...
				
当Java后端返回前端流文件时，前端可以使用JS实现对流文件的读取和处理。
在JavaScript中，可以使用XMLHttpRequest对象来获取返回的文件流，具体的实现方式如下：
（1）获取服务端返回的文件流，并通过responseType属性指定为blob类型，示例代码如下：
function getFile () {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', '/file', true); // 请求服务端返回文件流
  xhr.responseType = 'blob'; // 指定返回的响应类型为blob
  xhr.onload = function () {
    var blob = xhr.response; // 获取返回的blob对象
    // TODO: 对blob对象进行操作，如将其转换为可读的文件流
  xhr.send();
（2）将获取到的blob对象转换为可读的文件流，可以通过创建URL对象、将blob对象转化为URL来实现，示例代码如下：
var url = window.URL.createObjectURL(blob);
（3）最后，使用HTML5的FileSaver.js库实现文件下载，将文件流保存到本地，示例代码如下：
fileSaver.saveAs(url, 'example.pdf');
以上就是将Java返回前端流文件，前端如何读取的完整实现过程。需要注意的是，在多数浏览器中，FileSaver.js库需要手动加载，所以需要在HTML文档中手动导入。