网站跨域传递的原理+同源策略+src跨域+callback回调函数

一,传输数据的几种数据格式
1,Html
Html由一些普通文本组成。如果服务器通过XMLHTTPRequest发送html,文本将存储在responseText属性中。
从服务器端发送的html的代码在浏览器端不需要用JavaScript进行解析。
可以直接使用innerHTML属性把服务器传输过来的html文本插入到页面中。
2,XML
是一种通用的数据格式
不必把数据强加到已定义好的格式中,而是要为数据自定义合适的标记
利用dom可以完全掌控文档
Xml是当前编程中最为流行的数据交换格式,拥有跨平台,跨语言的优势。

<?xml version=’1.0’ encoding=”utf-8”?> 苏靖凯 http://abs.com/ [email protected] 3,json 什么是json? Json是一种轻量级的数据交换格式,它是基于JavaScript的一个子集。 Json的优点 同xml或html片段相比,json提供更好的间断性和灵活性,在JavaScript地盘内,json毕竟是主战场,其优势当然要远远优越于xml 非常适合服务器于JavaScript的交互

Json数据的数据格式
1)并列数据之间用‘,’分割
2)映射用冒号:分割
3)并列数据的集合用[]表示
4)映射的集合用{}表示

实际上JavaScript是将服务器端返回的json数据赋值给一个js变量,将js变量输出即可在页面中显示服务器端返回的数据。

三者对比
若应用程序不需要与其他应用程序共享数据的时候,使用html片段来返回数据时最简单。
如果数据需要重用,json文件是个不错的选择,其在性能和文件大小方面有优势。
当远程应用程序未知时,xml文档是首选

YAMl(自学)

二,跨域传值的同源策略
同源策略
1)什么是源
源就是协议,域名和端口号。
http://www.baidu.com:80
若地址里面的协议,域名,端口号均相同则属于同源。
对于 http://www.baidu.com/test/a.html 的同源检测
http://www.baidu.com/dir/b.html 成功
http://www.baidubaidu.com/test/a.html 失败 域名不同
https://www.baidu.com/test/a.html 失败 协议不同
http://www.baidu.com:9090/test/b.html 失败 端口号不同
2)什么是同源策略?
同源策略是浏览器的一个安全功能,不同源的客户端脚本在没有明确授权的情况下,不能读写对方的资源。所以a.com下的js脚本采用ajax读取b.com里面的文件数据是会报错的。所谓的同源是指,域名,协议,端口相同。
不受同源策略限制的:
(1)页面中的链接,重定向以及表单提交是不会受到同源策略限制的。
(2)跨域资源的引入是可以的。

跨域实现常用的就是jsonp
Jsonp的基本原理
动态添加一个

Jsonp的实现流程:(举栗子:a.com/jsonp.html想得到b.com/jsonp.php中的数据)
在a.com的jsonp.html里创建一个回调函数XXX,动态添加

json是一种数据交换格式,描述的是信息的格式,json返回的是一串数据,json可以理解为是一种格式,它的键必须用双引号。json格式的对象必须写在{}花括号里面,json格式的数组写在[]大括号里面。
四,ajax的json通信原生的方式获取跨域数据

接口地址
http://www.bejson.com/knownjson/webInterface/

五,Jq框架中jsonp的数据传输
$.ajax
$.getJSON

用户在当前系统登录后,通过跨域访问的方式实现积分系统追加积分功能。
1)用户登录:

用户登录

2)积分列表

积分列表

利用百度开放平台提供的翻译接口,做本地系统的在线翻译功能。实现跨域获取翻译数据的效果。

猜你喜欢

转载自blog.csdn.net/weixin_43243070/article/details/86501839