ajax跨域请求jsonp完整示例

最经用到jsonp(ajax)的跨域请求,在这分享给大家,有需要用到的一看就能明白。具体步骤如下:

1.首先客户端即页面script中调用代码如下:

        var cardNumber="***********";
    	$.ajax({
    		type:"GET",
    		url:'你请求的服务地址?idCard='+cardNumber,
    		dataType: 'jsonp',
    		jsonp: "callback",
    		data:{},
		async:true,
		error:function(XMLHttpReuqest,textStautus){
		    alert(XMLHttpRequest.status);
		    alert(textStautus);
		},
		success:function(result){
			alert("4444444");
		}
    	});

这个写法需要引用Jquery(<script src="jquery.min.js"></script>)

这个跨域暂时只能用GET方法,post据我所知好像不支持,idCard是你的参数。

2.服务端java的写法及返回示例:

@RequestMapping(value="risk",produces = MediaType.APPLICATION_JSON_UTF8_VALUE,method = RequestMethod.GET)
public String getCredit(){
	String idCard=request.getParameter("idCard");
	String callback=request.getParameter("callback");
	System.out.println("callback==:"+callback);
	System.out.println("idCard===="+idCard);
	Map<String,Object> map=new HashMap<String, Object>();
	map.put("name", "hello word!");
	JSONObject json=JSONObject.fromObject(map);
	String str=callback+"("+json+")";
	return str;
}

记住这里的callback一定要和ajax中的jsonp的值统一,到这基本上就完成了,前端访问,后端输出如下:


一个简单的ajax跨域请求也就完成了,有帮助到你不要忘了点击关注哦!!

我会持续更新一些小技能。。。

猜你喜欢

转载自blog.csdn.net/huxiangen/article/details/80576337
今日推荐