什么是JS跨域访问

一、什么是跨域

跨域是指从一个域名的网页去请求另一个域名的资源。比如:A上的页面获取B上的资源。

概念:只要协议、主机、端口有任何一个不同,都被当作是不同的域。

出于安全考虑,浏览器会限制从脚本内发起的跨域HTTP请求。

二、如何实现跨域访问

解决方案:

  • JSONP
  • CORS
  • postMessage等

比较常用的是CORS(跨域资源共享)

跨域资源共享( CORS )机制允许 Web 应用服务器进行跨域访问控制,从而使跨域数据传输得以安全进行。浏览器支持在 API 容器中(例如 XMLHttpRequest 或 Fetch )使用 CORS,以降低跨域 HTTP 请求所带来的风险。

服务器端对于CORS的支持,主要就是通过前后端HTTP HEADER设置Access-Control-Allow-Origin来进行的。如果浏览器检测到相应的设置,就可以允许Ajax进行跨域的访问。

1. 简单模式(请求方法是 GET / POST / HEAD)

  • 目标服务器在响应头(HTTP HEADER)里添加
    Access-Control-Origin:http://xxx.com
    浏览器就会允许http://xxx.com跨域。

  • 如果添加通配符*Access-Control-Origin:*浏览器就会允许所有其他网站跨域。

2. 复杂模式(请求方法是PUT / DELETE / CONNECT / OPTIONS / TRACE / PATCH)

目标服务器在响应头(HTTP HEADER)里添加

Access-Control-Origin: http://xxx.com
Access-Control-Methods: GET, POST, HEAD, PUT, DELETE, CONNECT, OPTIONS, TRACE, PATCH

浏览器会发两次请求,第一次是OPTIONS请求,询问目标服务器是否允许PUT/PATCH...,如果允许则发真正的请求。

参考链接:

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容