JavaScript高级主题：解释一下同源策略（Same-Origin Policy）。-阿里云开发者社区

JavaScript高级主题：解释一下同源策略（Same-Origin Policy）。

2023-12-24 33

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： JavaScript高级主题：解释一下同源策略（Same-Origin Policy）。

同源策略（Same-Origin Policy） 是一种安全性措施，被浏览器用于限制一个网页文档或脚本与来自另一个源（域、协议或端口）的资源进行交互的能力。这个策略有助于防止恶意网站利用用户的身份进行跨站请求伪造（CSRF）等攻击。

同源策略的规则包括：

同源策略对以下操作进行了限制：

DOM 访问： 一个页面中的脚本试图访问另一个页面的 DOM 结构时会受到同源策略的限制。
AJAX 请求： 通过 JavaScript 发起的 XMLHttpRequest 或 Fetch 请求也受同源策略的制约。即使两个页面的域名相同，但如果协议或端口不同，同样会被当作不同源。
Cookie、LocalStorage 和 IndexDB： 这些存储机制也受到同源策略的限制。一个页面不能访问另一个页面的 Cookie、LocalStorage 或 IndexDB 数据，除非它们满足同源规则。

为了在跨域的情况下进行数据交互，可以使用以下方法：

JSONP（JSON with Padding）： 通过动态创建 <script> 标签实现跨域请求，但仅支持 GET 请求且存在一些安全性问题。
CORS（Cross-Origin Resource Sharing）： 是一种基于 HTTP 头的机制，允许服务器声明哪些源可以访问其资源，从而在服务器端进行跨域控制。
代理： 在同一域下设置一个代理服务器，用于转发请求。前端请求发送到同一域下的代理服务器，再由代理服务器转发请求到目标服务器。

JavaScript高级主题：解释一下同源策略（Same-Origin Policy）。