您的位置:首页 > Web前端 > JavaScript

JavaScript之Ajax-7 Ajax跨域请求(Ajax跨域概述、Ajax跨域实现)

2016-04-04 18:57 591 查看
一、Ajax跨域概述
同源策略 - 同源策略(Same origin policy)是一种约定,它是浏览器的核心也最最基本的核心。如果少了同源策略,则浏览器的正常功能可能都会收到影响。可以说Web是构建在同源策略基础上的,浏览器只是针对同源策略的一种实现 - 它是由 Netscape 提出的一个著名的安全策略 - 现在所有支持 JavaScript 的浏览器都会使用这个策略 - 所谓同源策略是指,域名、协议、端口相同
域名概述 - 域名(Domain Name) 是由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名字,用于在数据传输时标识计算机的电子方位 - 域名的目的是便于记忆和沟通的一组服务器的地址 - 顶级域名 - 二级域名 - 三级域名
不同的域


跨域概述 - 简单来说,出于安全方面的考虑,页面中的JavaScript无法访问其他服务器上的数据,即"同源策略"。而跨域就是通过某些手段来绕过同源策略限制。实现不同服务器之间的通信的效果。 - 只要协议、域名、端口有任何一个不同,都被当作是不同的域
二、Ajax跨域实现
JSONP概述 - JSONP(JSON with Padding) 是JSON的一种使用模式,可用于解决主流浏览器的跨域数据访问的问题 - 由于同源策略,一般来说位于 server1.example.com的网页无法与不是server1.example.com的服务器沟通,而 HTML 的<script>元素是一个例外。利用<script>元素的这个开放策略,网页可以得到从其他动态产生的JSON资料,而这种使用模式就是所谓的JSONP
$.getJSON() - $.getJSON()方法允许通过使用JSONP形式的回调函数来加载其他网域的JSON数据 - 使用 $.getJSON() 方法实现跨域请求,需要在请求路径的URL后增加"callback=?",jQuery将自动替换"?"为正确的函数名,以执行回调函数


$.ajax() - $.ajax() 方法同样可以利用JSONP实现跨域请求,只需将$.ajax()方法的选项"dataType"的值设置为"jsonp"即可。 - $.ajax() 的选项 - dataType - 设置服务器端返回的数据类型,这里需要设置为"jsonp" - jsonpCallback - 为JSONP请求指定一个回调函数名,这个值将用于替代jQuery自动生成的随机函数名
- jsonp - 在一个JSONP请求中重写回调函数的名字,这个值将用于替代"callback=?"
总结:本章内容主要介绍了 Ajax跨域请求(Ajax跨域概述、Ajax跨域实现)
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息