ajaj简介
1. 什么是ajax?
ajax的全称 Asynchronous(异步) JavaScript and XML。
ajax是一种用于创建快速动态网页的技术。
主要用于前后台的交互,在前后台的交互中还有一种表单提交,不过现在表单已经被废弃了。
ajax并不是一种全新的语言,而是一种使用现有标准的一种方法。
ajax最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。
2. ajax的提交方式
提交方式有8中,其中最常用的只有2种,分别是GET和POST,两者最大的区别是,get提交的参数在地址栏中,post提交的参数在请求体中,两者相比,post的安全性高于get。
get的参数有限制,大约是2000个字符左右,而post的参数在网速良好的情况下,可以达到无限。
3. 原生ajax
XMLHttpRequest 是 AJAX 的基础,
所有现代浏览器均支持 XMLHttpRequest 对象(IE5 和 IE6 使用 ActiveXObject)。
XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
因此,在创建ajax对象-xmlhttprequest对象的时候,我们的考虑兼容性的问题
ajaxget提交:
ajaxpost提交:
get和post提交的区别就在于提交时参数的位置,
get是在第三步的时候
xhr.open('POST','http://localhost:8888/0220ajax/09.php',true); 在09.php后面添加参数。
而post是在最后一步的时候,将参数拼接上去。 xhr.send('strName=' + uname.value + '&strScore=' + score.value);
4. jQuery的ajax
$("#btn").click(function(){$.ajax({type : "POST", //提交的类型url : "http://192.168.9.154:8888/0221ajax/01.php", //地址data : { 参数uname : $("#username").val()},success : function(data){ //data就是原生的xhr.responseTextconsole.log(data);},error : function(err){ //错误的console.log(err)}})
})
5. 跨域问题
在ajax的提交中出现跨域时,如何解决?
跨域,首先要明白浏览器同源策略机制,那什么是同源策略机制?
同源策略阻止从一个源加载的文档或脚本中获取或设置另一个源加载的文档的属性。
在控制台出现类似的错误 :No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8888' is therefore not allowed access.
基本上都是跨域问题。
有时端口号没有写的都是80端口,也就是用的最多的端口。
http:// www.bailiban.com : 8888 /img/01.jpg?name=jackhttps:协议 域名 端口号 请求的资源路径协议,子域名,主域名,端口号,只要有一个不同就是跨域,资源就不能通过ajax进行访问
解决方法:
1.代理服务器
2.设置请求头 在服务端语言增加两行代码
res.setHeader("Access-Control-Allow-Origin","*");
res.setHeader("Access-Control-Allow-Methods","DELETE,PUT,POST,GET,OPTIONS");
3.JSONP
JSONP原理上是利用 script 标签的 src 属性,因为同源策略对 scropt 的 src 属性不起作用。
转载于:https://www.cnblogs.com/mercy-up/p/10439699.html
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
