跨域和安全

Cross-site scripting

• 跨站脚本攻击（Cross-site scripting，XSS）是一种安全漏洞，攻击者可以利用这种漏洞在网站上注入恶意的客户端代码。
• 他们通常都会：将 cookies 或其他隐私信息发送给攻击者，将受害者重定向到由攻击者控制的网页，或是经由恶意网站在受害者的机器上进行其他恶意操作。
• 在以下 2 种情况下，容易发生 XSS 攻击：
  • 数据从一个不可靠的链接进入到一个 Web 应用程序。
    • 注释：同源策略解决的问题
  • 没有过滤掉恶意代码的动态内容被发送给 Web 用户。
    • 注释：后端对用户提交内容的检查
• 恶意内容一般包括 JavaScript，但是，有时候也会包括 HTML，FLASH 或是其他浏览器可执行的代码。
• XSS 攻击的形式千差万别，但他们通常都会
  • 将 cookies 或其他隐私信息发送给攻击者
  • 将受害者重定向到由攻击者控制的网页
    • 注释：重定向到攻击者控制的网页可能会使window.domain被指向安全页面
  • 或是经由恶意网站在受害者的机器上进行其他恶意操作
• XSS 攻击可以分为 3 类
  • 存储型 XSS 注入型脚本永久存储在目标服务器上。当浏览器请求数据时，脚本从服务器上传回并执行。
    • 注释：恶意脚本被用户上传到安全服务器上，当其他用户访问该页面时会触发该脚本。例如论坛。
  • 反射型 XSS 当用户点击一个恶意链接，或者提交一个表单，或者进入一个恶意网站时，注入脚本进入被攻击者的网站。Web 服务器将注入脚本，比如一个错误信息，搜索结果等 返回到用户的浏览器上。由于浏览器认为这个响应来自"可信任"的服务器，所以会执行这段脚本。
    • 注释：只是一个恶意链接被上传到服务器上，用户点击这个链接，访问恶意服务器。恶意服务器通过修改原页面来注入恶意脚本，这时候浏览器觉得这个脚本是当前安全页面所有的就会放心执行。
  • 基于 DOM 的 XSS 通过修改原始的客户端代码，受害者浏览器的 DOM 环境改变，导致有效载荷的执行。也就是说，页面本身并没有变化，但由于 DOM 环境被恶意修改，有客户端代码被包含进了页面，并且意外执行。
    • 注释：感觉像是第一种和第二种中的一种手段，通过修改dom来注入恶意代码

CSRF

• 跨站请求伪造（CSRF）是一种冒充受信任用户，向服务器发送非预期请求的攻击方式。例如，这些非预期请求可能是通过在跳转链接后的 URL 中加入恶意参数来完成：
  • 注释：和 XSS 得区别主要在于一个靠伪造，一个靠漏洞。

<img src="https://www.example.com/index.php?action=delete&id=123">

• 即使这个标签根本不在 https://www.example.com 内亦可
• 有很多预防 CSRF 的方法，比如实现 RESTful API，增加 secure token 等等
• 注释：xss 是注入恶意代码，CSRF 是伪造用户操作。实际上 CSRF 是目的，xss 是手段。

同源

• 如果两个 URL 的 protocol(协议)、port (端口) 和 host（主机） 都相同的话，则这两个 URL 是同源。
• 在页面中通过 about:blank 或 javascript: URL 执行的脚本会继承打开该 URL 的文档的源，因为这些类型的 URLs 没有包含源服务器的相关信息。
  • 疑问：javascript:URL 是指什么？
  • 注释：通过 window.open 打开空白页 document.domain 会指向执行 open 命令得域名，但是打开非空白页则不会。相同 在已打开得空白页进行 location.href 跳转，domain 也将改变。
• 满足某些限制条件的情况下，页面是可以修改它的源。脚本可以将 document.domain 的值设置为其当前域或其当前域的父域。如果将其设置为其当前域的父域，则这个较短的父域将用于后续源检查。
  • 注释： 较短的父域是指主机名的一部分，例如document.domain = "company.com";相对于 http://store.company.com/dir/other.html
• 任何对 document.domain 的赋值操作，包括 document.domain = document.domain 都会导致端口号被重写为 null
  • 因此 company.com:8080 不能仅通过设置 document.domain = "company.com" 来与company.com 通信。必须在他们双方中都进行赋值，以确保端口号都为 null 。

同源策略

• 用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互
  • 注释：这是客户端的一种主动保护，如果用了非法的客户端，将会造成安全隐患。
  • 注释：同源策略可以保护本地数据不被恶意网站盗用，因为请求大多都不是用户主动发起的，这些请求要访问本地用户数据时就需要同源策略对数据进行保护。
    • 例如 cookie支持同域策略，所以只能包含域才能读取对应的cookie，避免身份冒充
    • 同源策略包括对本地不同源 dom 的保护，其实包括所有获取到本地的资源，应该都是受保护的。
  • 注释：对非同源请求的限制是为了保护用户的数据不被非法获取。
    • 当在合法的浏览器中，用户被恶意链接欺骗，使域a冒充域b用户从域b获取数据时，域a是拿不到域b返回的数据的，需要域b同意。
• 跨源写操作（Cross-origin writes）一般是被允许的。例如链接（links），重定向以及表单提交。特定少数的 HTTP 请求需要添加预检请求
  • 注释：链接应该是指 a 标签
  • 注释：写操作是指当前域名对本地写入信息，例如页面跳转、重定向等
  • 注释：读操作是指读取本地的信息，例如获取cookie，就会严格受同源策略限制
• 跨源资源嵌入（Cross-origin embedding）一般是被允许
  • 注释：CSP 用来解决该问题
  • <script src="..."></script> 标签嵌入跨源脚本。语法错误信息只能被同源脚本中捕捉到。
  • <link rel="stylesheet" href="...">标签嵌入 CSS。由于 CSS 的松散的语法规则，CSS 的跨源需要一个设置正确的 HTTP 头部 Content-Type 。不同浏览器有不同的限制
  • 通过 <img> 展示的图片
  • 通过 <video> 和 <audio> 播放的多媒体资源
  • 通过 <object>、 <embed>和 <applet> 嵌入的插件
  • 通过 @font-face 引入的字体。一些浏览器允许跨源字体，一些需要同源字体
  • 通过 <iframe> 载入的任何资源。站点可以使用 X-Frame-Options 消息头来阻止这种形式的跨源交互
• 跨源读操作（Cross-origin reads）一般是不被允许的，但常可以通过内嵌资源来巧妙的进行读取访问。
  • 注释：读操作包括，跨域接口返回得数据不允许读，跨域保存在浏览器本地的cookie、storage等不允许读等。
• 可以使用 CORS 来允许跨源访问。CORS 是 HTTP 的一部分，它允许服务端来指定哪些主机可以从这个服务端加载资源
• 如何阻止跨源访问
  • 阻止跨源写操作，只要检测请求中的一个不可推测的标记 (CSRF token) 即可，这个标记被称为 Cross-Site Request Forgery (CSRF) 标记。你必须使用这个标记来阻止页面的跨源读操作。
    • 注释：原文翻译有问题。为了阻止跨源写操作，请求中会带有一个不可访问的 CSRF 标记。要防止跨源写操作，就要防止这个 标记 被跨源读取。
    • 注释：可能是指 内嵌 script 上的 nonce 标志。该标志是不允许被跨源读取的。
  • 阻止资源的跨源读取，需要保证该资源是不可嵌入的。阻止嵌入行为是必须的，因为嵌入资源通常向其暴露信息。
    • 注释：如果资源是可嵌入的，那么可以通过嵌入 script 等方式来读取服务器发送过来的资源。jsonp就是靠这个实现的。
  • 阻止跨源嵌入，需要确保你的资源不能通过以上列出的可嵌入资源格式使用。
    • 浏览器可能不会遵守 Content-Type 头部定义的类型。例如，如果您在 HTML 文档中指定 <script> 标记，则浏览器将尝试将标签内部的 HTML 解析为 JavaScript。
    • 当您的资源不是您网站的入口点时，您还可以使用 CSRF 令牌来防止嵌入。
• 当两个文档的源不同时，这些引用方式将对 Window 和 Location对象的访问添加限制

CORS

• CORS（Cross-Origin Resource Sharing，跨源资源共享）是一个系统，它由一系列传输的 HTTP 标头组成，这些 HTTP 标头决定浏览器是否阻止前端 JavaScript 代码获取跨源请求的响应。

  • 允许服务端来指定哪些主机可以从这个服务端加载资源
  • 注释：允许服务器决定它的资源可以供哪些域名使用，避免了跨域的严格限制

• Access-Control-Allow-Origin 指示响应的资源是否可以被给定的来源共享。

• Access-Control-Allow-Credentials 告知浏览器是否可以将对请求的响应暴露给前端 JavaScript 代码

• Access-Control-Expose-Headers 通过列出标头的名称，指示哪些标头可以作为响应的一部分公开。

• Origin 指示获取资源的请求是从什么源发起的。

• Access-Control-Max-Age 指示预检请求的结果能被缓存多久。

• Access-Control-Allow-Methods 指定对预检请求的响应中，哪些 HTTP 方法允许访问请求的资源。

• Access-Control-Allow-Headers 用在对预检请求的响应中，指示实际的请求中可以使用哪些 HTTP 标头。

• Access-Control-Request-Headers 用于发起一个预检请求，告知服务器正式请求会使用哪些 HTTP 标头。

• Access-Control-Request-Method 用于发起一个预检请求，告知服务器正式请求会使用哪一种 HTTP 请求方法。

CSP

• 内容安全策略（CSP）用于检测和减轻用于 Web 站点的特定类型的攻击，例如 XSS (en-US) 和数据注入等。
• 该安全策略的实现基于一个称作 Content-Security-Policy 的 HTTP 首部。
  • 允许站点管理者控制用户代理能够为指定的页面加载哪些资源。除了少数例外情况，设置的政策主要涉及指定服务器的源和脚本结束点
• 注释：有两种使用方式，一种是在html的响应头部中返回，要求浏览器启用CSP。一种实在 html 的 meta 标签中使用，用以限定内嵌资源的规则

Content-Security-Policy-Report-Only

• 注释：用来要求浏览器发现违反 CSP 规则时，向指定的服务器发起一个请求，用来检测 CSP 的影响情况。

nonce

• 注释：
  • script 标签上的一个属性
  • nonce 属性返回只使用一次的加密数字，被内容安全政策用来决定这次请求是否被允许处理
  • Content-Security-Policy 会返回 哪些 nonce 被允许使用