ajax的跨域访问(3种方法)
-
web服务器上的代理文件(代理)
服务器创建一个文件来收集来自远程服务器的数据。网站的其他页面会向这个文件请求数据。这就被称作代理,它实际上扮演了其他的页面。 -
JSONP(JSON with padding 填充)
JSONP需要在页面中添加一个<script>元素,由该元素来从其他服务器加载JSON数据。这种方法有效是因为<script>元素的脚本源并没有受到限制,这里请求的是服务器端的js(脚本)数据。
在使用JSONP时,不需要使用JSON对象的parse()/stringify()方法,因为数据是以脚本文件的形式返回的,会被视为对象。
服务器上的文件通常会被编写为允许指定将要处理返回数据的函数名称。函数名通常以URL的查询字符串来传递
(?callback=showEvents)原理:
首先,页面必须包含一个用来处理JSON数据的函数。然后使用<script>元素来向服务器提交数据。服务器会返回一个文件,调用该函数来处理数据。JSON数据会作为参数传给该函数。
浏览器:
<script>
function showEvent(data){
// 处理数据的代码
//数据不需要进行JSON.parse()进行处理,在for循环中,直接通过参数名称data引用数据就行
}
<script src=“http://example.org/jsonp”> //远程请求地址
</script>
服务器:
showEvent({
“events”:[
{
"location:“nankai University”,
“day”:“4.30”
}
]
})xml和json调用ajax的格式!!!!!!!!!!!
var xhr = new XMLHttpRequest();
xhr.function(){
//判断statue
//语句
//页面实现};
xhr.open(‘GET’,‘文件位置’,是否异步);
xhr.send(); -
跨来源资源共享
通过http头来添加额外信息,借此传递信息。
jquery和ajax
1.需要请求和响应来完成
请求:
.load 可直接加载来自服务器的HTML .load('jq-ajax.html #content') 地址和选择条件间有个空格
$.get()
$.post()
$.getJSON()
$.getScript()
$.ajax() 以上所有方法实际上都是通过这个方法来实现的
响应:JQuery中有个jqXHR的对象,处理从服务器返回的数据。
XHR属性:
responseText
responseXML
statue
statueText 状态描述
XHR方法:
.done() 请求成功后执行的代码
.fail() 请求失败后执行的代码 为了检测ajax请求的成功与否
.always() 无论成功失败都执行
.abort() 挂起通信
2.相对URL
如果ajax加载的内容包括相对URL(图片和链接等),那么这些URL会被视作相对于被加载的来源页面。所以如果ajax调用了链接,则这个链接所指向的文件必须和这个被加载的页面在同一个文件夹中。
使用ajax发送表单
在向服务器发送数据时,通常使用HTTP POST方法。
其中最重要的是Jquery.serialize()。
- 选择表单中的所有信息
- 将他们添加到一个可以发给服务器的字符串中
- 编码不能用于查询字符串的字符
- 它通常用在包含<form>元素的选择器上(也可使用单独的元素或者表单的一部分)
- 仅发送成功的表单控件,不会发送被禁用的,没有选中的控件和提交按钮