什么是跨域解决方案有哪些.docx

跨域解决方案有哪些 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源，这里跨域是广义的。广义的跨域包括资源跳转、资源嵌入、脚本请求等。狭义的跨域是由浏览器同源策略限制的一类请求场景。 同源策略/SOP（Same origin policy）是一种约定，由 Netscape 公司 1995 年引入浏览器，它是浏览器最核心也最基本的安全功能。如果缺少了同源策略，浏览器很容易受到 XSS、CSFR 等攻击。同源是指"协议+域名+端口"三者相同，即便两个不同的域名指向同一个 ip 地址，也非同源。 同源策略限制以下几种行为： 1. Cookie、LocalStorage 和 IndexDB 无法读取 2. DOM 和 Js 对象无法获得 3. AJAX 请求不能发送 常见跨域场景： 1. 跨域资源共享（CORS） 2. 通过 jsonp 跨域 3. document.domain + iframe 跨域 4. location.hash + iframe 5. window.name + iframe 跨域 6. postMessage 跨域 7. nginx 代理跨域 8. nodejs 中间件代理跨域 9. WebSocket 协议跨域 一、 通过 jsonp 跨域 通常为了减轻 web 服务器的负载，我们把 js、css，img 等静态资源分离到另一台独立域名的服务器上，在 html 页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许，基于此原理，我们可以通过动态创建 script，再请求一个带参网址实现跨域通信。 1）原生实现： 通过动态创建 script 标签，并将 src 属性设置为请求的 URL，可以实现跨域通信。 2）jquery ajax： 通过 jQuery 的 ajax 方法，可以设置 dataType 为 jsonp，实现跨域通信。 3）vue.js： 通过 Vue.js 的 jsonp 方法，可以实现跨域通信。 后端 node.js 代码示例： 通过 Node.js 可以创建一个 HTTP 服务器，处理跨域请求，并返回 jsonp 数据。 二、 document.domain + iframe 跨域 通过设置 document.domain，可以实现跨域通信。 三、 location.hash + iframe 跨域 通过使用 location.hash，可以实现跨域通信。 四、 window.name + iframe 跨域 通过使用 window.name，可以实现跨域通信。 五、 postMessage 跨域 通过使用 postMessage，可以实现跨域通信。 六、 跨域资源共享（CORS） 通过设置 HTTP 头，可以实现跨域资源共享。 七、 nginx 代理跨域 通过使用 nginx 代理，可以实现跨域通信。 八、 nodejs 中间件代理跨域 通过使用 Node.js 中间件，可以实现跨域通信。 九、 WebSocket 协议跨域 通过使用 WebSocket 协议，可以实现跨域通信。 跨域解决方案有很多，选择合适的解决方案取决于具体的应用场景和需求。