asp jquery ajxs json和jsonp跨域请求

最新推荐文章于 2022-07-05 08:58:56 发布

原创最新推荐文章于 2022-07-05 08:58:56 发布 · 1.8k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#ajxs #json #jsonp #ajxs跨域请求

jquery 专栏收录该内容

17 篇文章

订阅专栏

本文详细探讨了 Ajxs 进行 JSON 数据请求的实现，包括前台带参数的 Ajxs json 请求，以及利用 Jsonp 实现的跨域请求。同时，还介绍了如何处理跨域时的参数传递，并讨论了使用 eval 解析 JSON 对象的安全问题。

一、前台Ajxs json请求带参数

<script type="text/javascript">  
$.getJSON("test.asp",{user:'admin',pass:'123456'}, function(json){
	alert(json[0].user)
	alert(json[0].pass)
});
</script>

后台接收并返回实例

user = request.QueryString("user")
pass = request.QueryString("pass")
add = "[{""user"":"""+ user +""",""pass"":"""+ pass +"""}]"
response.Write(add)

二、前台Ajxs json请求不带参数

<script type="text/javascript"> 
$.getJSON("test.asp", function(json){
	alert(json.length)
	alert(json[0].id)
	alert(json[0].name)
	alert(json[1].id)
	alert(json[1].name)
});
</script>

后台接收并返回实例

dim add
add = "[{""id"":""123"",""name"":""admin""},{""id"":""456"",""name"":""bxsc""}]"
response.Write(add)

三、Ajxs jsonpt跨域请求

<script type="text/javascript">  
    $(document).ready(function(){
        $.ajax({
             url:'http://localhost:8080/test.asp',
             dataType:"jsonp",
             jsonp:"jsonpcallback",
             jsonpCallback: "jsonpcallback",
             success:function(data){
                 var $ul = $("<ul></ul>");
                 $.each(data,function(i,v){
                     $("<li/>").text(v["id"] + " " + v["name"]).appendTo($ul)
                 });
                 $("#res").append($ul);
             }
        });
    });</script><span id="res"></span>

后台

jsonp = request.QueryString("jsonpcallback")
str = "[{""id"":""1"",""name"":""测试1""},{""id"":""2"",""name"":""测试2""}]"
str = jsonp + "(" +str+")"
response.Write(str)

四、跨域带参数请求

<span id="myform"></span>
<script type="text/javascript">  
    $(document).ready(function(){
		$.getJSON("http://localhost:8080/test.asp?jsonpcallback=?",{user:'administrator',pass:'1314778'},function(json){
		    var msg = '';
		    if(json){
			   //msg = "<div id='result'><strong>提交成功！</strong><br/>姓名："+json[0].user+"<br/>密码："+json[0].pass+"</div>"
			   msg = "<div id='result'><strong>提交成功！</strong><br/>姓名："+json.user+"<br/>密码："+json.pass+"</div>"
			}else{
			   msg = "服务器忙，请稍候再试！";
			}
			$("#myform").after(msg);
		});


    });
</script>

jsonp = request.QueryString("jsonpcallback")
user = request.QueryString("user")
pass = request.QueryString("pass")
'str = "[{""user"":"""+ user +""",""pass"":"""+ pass +"""}]"
str = "{""user"":"""+ user +""",""pass"":"""+ pass +"""}"
str = jsonp + "(" +str+")"
response.Write(str)

使用eval解析JSON对象

var json=eval_r("({sitename:'dreamdu',sitedate:new Date(1980, 12, 17, 12, 0, 0)})");
document.write(json.sitename);
document.write(json.sitedate);

结果:
dreamdu
Sat Jan 17 12:00:00 UTC+0800 1981
提示: 由于eval可以任意执行JavaScript代码，因此可能带来安全问题