SpringMVC框架 + 客户端 jQuery 跨域请求解决方案之JSONP

做Web开发必然会遇到的一个问题就是跨域，被浏览器的同源策略给拦截，请求根本发不出去。由于用的Spring版本时3.2.13，@CrossOrigin注解还不支持，而且在Response中加Access-Control-Allow-Origin之类Header的方式也不太有效，我就不说了，老夫这里只说的JSONP方式解决跨域问题。

假设用了fastjson库，那么Controller中作如下处理：

if(null != user){//登录成功
	//放入session
	session.setAttribute(Constants.DEV_USER_SESSION, user);
	//页面跳转（main.jsp）
	JSONPObject jsonpObject = new JSONPObject();
	jsonpObject.setFunction(callback);//callback是控制器从请求中接收的参数
	jsonpObject.addParameter(user);
	return jsonpObject;
}

其实用jackson库也可以，巧的是也有一个同名的JSONPObject类，只是封装方式有点不同而已，都可以。

另外就是客户端JS中需要一些修改，发起Ajax请求的代码为：

<script>
	function login(){
		//...省略一些表单验证代码
		var userName = $("[name=devCode]").val();
		var password = $("[name=devPassword]").val();
			$.ajax({
				type:"POST",//请求类型
				url:"http://txtx44.natappfree.cc/AppInfoSystem/dev/dologin",//请求的url
				data:{"devCode":userName,"devPassword":password},//请求参数
				dataType:"jsonp",//jsonp是为了能跨域请求
				jsonp: "callback", //参数名
				jsonpCallback: "handleData", //参数值：回调函数名
				error:function(res){
					alert("请求失败！"+res.toString());
				}
			});
	}
	//独立的函数，处理返回的jsonp数据
	function handleData(res){
		if(res && res.devCode != ""){
			alert("登录成功！");//省略跳到主页的代码。。。
		}else{
			alert("登录失败！")
		}
	}
</script>

顺带卖个广告，我的视频号坚持发布网络科普、揭露各种骗局，关注我，一起来学习奇怪的知识吧！