解码跨域：简单请求与复杂请求
2023-12-14 22:46:46
跨域请求：跨越浏览器壁垒的艺术
在浩瀚的网络世界中，无数的网站和应用程序相互连接，形成一个错综复杂的网络。然而，浏览器为了保护用户隐私和安全，设置了一道坚固的屏障——同源策略 。
同源策略：浏览器设下的屏障
同源策略规定，浏览器仅允许来自同一来源（即相同的协议、域名和端口）的脚本访问页面中的数据。这意味着，来自不同来源的脚本无法读取或修改页面中的 cookie、localStorage 和其他敏感数据。
跨域请求：打破界限
跨域请求，顾名思义，就是突破了同源策略的限制，尝试访问另一个来源的数据。这种行为会被浏览器视为不安全，并会触发跨域错误。
简单请求与复杂请求：跨越界限的方法
为了满足跨域请求的需求，浏览器提供了两种方法来跨越同源策略的界限：
简单请求：
- 请求方法为 GET、POST、HEAD 或 OPTIONS
- 请求头仅包含标准头（如 Accept、Content-Type）
- 请求体为空或只包含 ASCII 字符
简单请求无需额外的步骤即可发送。
复杂请求：
- 请求方法不是 GET、POST、HEAD 或 OPTIONS
- 请求头包含非标准头
- 请求体包含非 ASCII 字符
复杂请求需要通过一个预检请求（OPTIONS 请求）询问服务器是否允许跨域请求。服务器返回的预检响应头决定了浏览器是否允许发送真正的请求。
预检请求：跨域请求的哨兵
预检请求是浏览器在发送复杂请求之前发送的 OPTIONS 请求。它的目的是询问服务器是否允许跨域请求，并指定请求方法、请求头和携带凭据（如 cookie）。
服务器返回的预检响应头包含以下信息：
- 是否允许跨域访问（Access-Control-Allow-Origin）
- 允许哪些请求方法（Access-Control-Allow-Methods）
- 允许哪些请求头（Access-Control-Allow-Headers）
- 是否允许携带凭据（Access-Control-Allow-Credentials）
如果服务器允许跨域请求，浏览器就会发送真正的请求。
Access-Control- 响应头：跨域请求的通行证*
Access-Control-* 响应头是服务器用来控制跨域请求的特殊响应头。它们指定了哪些来源、请求方法和请求头可以跨域访问服务器资源，以及是否允许携带凭据。
最常见的 Access-Control-* 响应头包括：
- Access-Control-Allow-Origin：允许跨域访问的来源
- Access-Control-Allow-Methods：允许的请求方法
- Access-Control-Allow-Headers：允许的请求头
- Access-Control-Allow-Credentials：是否允许携带凭据
跨域请求的艺术：打破界限
跨域请求是突破同源策略限制的一种艺术。通过理解简单请求、复杂请求和预检请求，以及熟练运用 Access-Control-* 响应头，开发者可以跨越来源的界限，安全地访问和修改不同来源的数据。
常见问题解答
-
为什么浏览器需要同源策略？
为了保护用户隐私和安全，防止恶意网站窃取敏感数据。 -
什么类型的请求需要预检？
非简单请求，如带有非标准请求头或包含非 ASCII 字符的请求。 -
Access-Control-Allow-Origin 可以设置为 * 吗？
是的，表示允许所有来源跨域访问。 -
跨域请求是否支持携带凭据？
是的，通过设置 Access-Control-Allow-Credentials 为 true。 -
跨域请求是否会影响性能？
是的，预检请求会增加额外的延迟，特别是对于复杂请求。
