Ajax的基础请求以及获取JSON的两种解析方式
2017-07-11 19:07
585 查看
作为一个前端,避免不了需要做前后台交互
[html] view
plain copy
/*基础请求*/
var xmlhttp = null;
if(window.XMLHttpRequest){
var xmlhttp = new XMLHttpRequest();
}else{
var xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
}
xmlhttp.open('GET',url,true);//仅仅写出 GET 下的基础请求,POST 需要进行伪装;
xmlhttp.send(null);
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
var str = xmlhttp.responseText;
}
}
在上面我们能看见初步获取了 str,即获取到后台来的数据,有时候后台在数据发过来之前就进行过处理,我们 js 获取到就是对象,这样就很简单省事了。但是有时候后台人员直接传过来的是字符串形式,这样就需要我们苦逼的前端去处理一下数据了。然后问题就来了我们该怎么去处理字符串,哪种处理方式更好;
目前js处理有两种:1、eval()。2、JSON.parse();那么这两种有什么区别呢?
首先我们看看eval();
[html] view
plain copy
var str = '{"name":alert("haha"),"age":18}';
var obj = eval('('+str+')');
console.log(obj.age);
上面这段代码我们会看到页面先弹出了 haha,也就意味着在处理 JSON字符串的时候竟然把字符串里面的代码给解析了。eval()能解析任何字符串并不会对字符串格式进行检查。这样就很可怕了,alert 并没什么,但是可怕的是如果用恶意用户在json字符串中注入了向页面插入木马链接的脚本,用eval也是可以操作的。就问你怕不怕!!!
我们再来看看第二种:JSON.parse()
[html] view
plain copy
var str = 'alert(10)';
console.log(JSON.parse(str));
竟然报错了,意味着并不能解析里面的代码。同样
[html] view
plain copy
var str = '{"name":alert("haha"),"age":18}';
var obj = JSON.parse(str);
console.log(obj.age);
也会报错。JSON.parse()之可以解析json格式的数据,并且会对要解析的字符串进行格式检查,如果格式不正确则不进行解析。
但是如果代码如下
[html] view
plain copy
var str = '{"name":"haha","age":18}';
var obj = JSON.parse(str);
console.log(obj.age);
页面就会正常输出 obj.age 出现了18;
从上面看出来确实JSON.parse()就非常的实用安全了,当然了,一般非常好用的东西都是不兼容了,一些低版本浏览器中是不支持的。望大家斟酌!
[html] view
plain copy
/*基础请求*/
var xmlhttp = null;
if(window.XMLHttpRequest){
var xmlhttp = new XMLHttpRequest();
}else{
var xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
}
xmlhttp.open('GET',url,true);//仅仅写出 GET 下的基础请求,POST 需要进行伪装;
xmlhttp.send(null);
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
var str = xmlhttp.responseText;
}
}
在上面我们能看见初步获取了 str,即获取到后台来的数据,有时候后台在数据发过来之前就进行过处理,我们 js 获取到就是对象,这样就很简单省事了。但是有时候后台人员直接传过来的是字符串形式,这样就需要我们苦逼的前端去处理一下数据了。然后问题就来了我们该怎么去处理字符串,哪种处理方式更好;
目前js处理有两种:1、eval()。2、JSON.parse();那么这两种有什么区别呢?
首先我们看看eval();
[html] view
plain copy
var str = '{"name":alert("haha"),"age":18}';
var obj = eval('('+str+')');
console.log(obj.age);
上面这段代码我们会看到页面先弹出了 haha,也就意味着在处理 JSON字符串的时候竟然把字符串里面的代码给解析了。eval()能解析任何字符串并不会对字符串格式进行检查。这样就很可怕了,alert 并没什么,但是可怕的是如果用恶意用户在json字符串中注入了向页面插入木马链接的脚本,用eval也是可以操作的。就问你怕不怕!!!
我们再来看看第二种:JSON.parse()
[html] view
plain copy
var str = 'alert(10)';
console.log(JSON.parse(str));
竟然报错了,意味着并不能解析里面的代码。同样
[html] view
plain copy
var str = '{"name":alert("haha"),"age":18}';
var obj = JSON.parse(str);
console.log(obj.age);
也会报错。JSON.parse()之可以解析json格式的数据,并且会对要解析的字符串进行格式检查,如果格式不正确则不进行解析。
但是如果代码如下
[html] view
plain copy
var str = '{"name":"haha","age":18}';
var obj = JSON.parse(str);
console.log(obj.age);
页面就会正常输出 obj.age 出现了18;
从上面看出来确实JSON.parse()就非常的实用安全了,当然了,一般非常好用的东西都是不兼容了,一些低版本浏览器中是不支持的。望大家斟酌!
相关文章推荐
- java ajax 请求后获取 json 数据 以及 使用 解析 ,解惑
- jquery多选择动态参数的使用以及ajax异步请求中提交整个form表单中serializeArray()的使用以及后台值得获取方式
- jquery通过ajax方式获取json数据和解析
- JavaWeb将数据包装成JSON以及JSP通过ajax对JSON的获取与解析(代码实例)
- JavaWeb将数据包装成JSON以及JSP通过ajax对JSON的获取与解析(代码实例)
- ajax之(2):json数据解析两种方式
- Java从网络中请求获取JSon数据以及解析JSON数据----(自创,请注明)
- @RequiresPermissions 控制权限的异常处理以及Ajax方式请求时返回json
- Jquery发送ajax请求以及datatype参数为text/JSON方式
- ajax重新认识:(2)json数据解析两种方式
- struts2的配置解释以及使用ajax、创建传输json的两种方式
- jquery通过ajax方式获取json数据和解析
- jquery通过ajax方式获取json数据和解析
- Struts学习_Jquery发送ajax请求以及datatype参数为text/JSON方式
- JavaWeb将数据包装成JSON以及JSP通过ajax对JSON的获取与解析(代码实例)
- JSON与XML的区别比较以及xml两种解析方式的比较
- ajax请求返回json字符串解析方式
- Jquery发送ajax请求以及datatype参数为text/JSON方式
- android网络编程之json传输数据以及解析方式
- Android通过http方式获取JSON字符串并解析的注意事项(乱码,小黑框)