JQuery Ajax访问Spring MVC接口解决跨域请求
深山老妖浏览:10852018-12-19 09:00:50本文累计收益:0我也要赚钱

Jquery ajax默认访问Spring MVC接口如果接口返回Json数据就会存在跨域问题(比如www.aaa.com网站需要调用www.bbb.com服务器接口,两个程序不在同一服务器)不能被直接调用,解决方法只需将接口返回json数据改为jsonp即可。

后台代码如:
@RequestMapping(method = RequestMethod.GET, value = "getProjectStatusList", produces = "text/html;charset=UTF-8")
	@ResponseBody
	public String getProjectStatusList(HttpServletRequest request,HttpServletResponse response) {

		Map<String, Object> map = new HashMap<String, Object>();
		try {
			String callback = request.getParameter("callback");
			// System.out.println("token:"+request.getHeader("token"));
			List<Map<String, Object>> list = applyBaseService.getApplyBaseList(map);
			map.put("status", "success");
			map.put("data", list);
			
			JSONObject json = new JSONObject();
			json.put(Oa.RETURN_MESSAGE, Oa.OPERATE_SUCCESS);
			json.put(Oa.RETURN_TIME, DateUtil.convertDateToString(new Date()));
			json.put(Oa.RETURN_CODE, "123131");
			json.put(Oa.RETURN_DATA, list);
			ObjectMapper mapper = new ObjectMapper();
			// 这个拼接是重点。。。
			String result = callback + "(" + mapper.writeValueAsString(json)+ ")";
			System.out.println(result);
			// String result = mapper.writeValueAsString(map);
			return result;
		} catch (Exception e) {
			System.out.println("AAAAA:"+e.getMessage());
			JSONObject json = new JSONObject();
			json.put("status", "fail");
			json.put("data", e.getMessage());
			return json.toString();
		}
	}
2、前端Jquery Ajax请求代码如下:
		<script>
			var api = "http://localhost:8081/AttorWeb/Index/getProjectStatusList";
			var name = $("#firstForm input[name='name']").val();
			$(function() {
				$('#ddddd').on('click', function() {
					$.ajax({
						type: 'post',
						url: api,
						async: false,
						dataType: 'jsonp',
						jsonpCallback: 'callback',
						data: {
							'name': name
						},
						success: function(json) {
							alert(json.message);
							alert(json.code);
							alert(json.data[0].office_name);
								if(success)
									success(res);
							//TODO
							alert(json.weatherinfo.city);
						},
						error: function(XMLHttpRequest, textStatus, errorThrown) {
							//TODO
						}
					});
				});
			});
		</script>

 

评论列表
发表评论
+ 关注