您的位置:首页 > 运维架构 > 网站架构

分布式架构项目中各模块中页面发送ajax请求后台json数据的传输问题

2017-12-08 14:14 706 查看
传统的单模块项目中,我们页面通过ajax异步请求可以直接请求到后台返回的json字符串。但是在多模块项目中,由于域名不同,或者是端口不同,向后台发送ajax请求数据时,会产生跨域问题。

例如电商网站的前台系统调用服务系统返回的商品分类导航,前台系统发布在了一台服务器上,服务系统发布在了另一台服务器,所以导致了ajax跨域请求数据失败。

解决方案:

前台系统的入口为:localhost:8082/
服务系统的入口为:localhost:8081/rest


//请求路径
category={
BASE_URL:"http://localhost:8081/rest/category/list?callback=fillCategory"
};


//页面加载调用此方法,向服务系统发送jsonp请求,并传入一个参数(方法名)callback=fillCategory用于服务层封装json数据成 fillCategory(数据),也就是方法名(数据);的形式 用于覆盖前台页面定义好的回调函数。
function ReaderCategory(){
$.ajax({
url:category.BASE_URL,
type: "post",
//指定数据类型为jsonp
dataType: "jsonp",
//指定回调函数为:fillCategory
jsonpCallback: 'fillCategory'

});
}


//定义好回调函数,后台返回的数据会覆盖此方法填充数据
function fillCategory(data){
alert(data);
}


服务系统处理:

package com.ejavashop.rest.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.MediaType;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

import com.ejavashop.common.utils.JsonUtils;
import com.ejavashop.rest.service.CategoryService;

/**
*
* @ClassName: CategoryController
* @Description: TODO(商品分类信息的控制器)
* @author 欧阳理
* @date 2017年12月5日 上午11:22:00
*
*/
@Controller
public class CategoryController {
@Autowired
private CategoryService categoryService;

@RequestMapping(value="/category/list",produces=MediaType.APPLICATION_JSON_VALUE+";charset=utf-8;")
@ResponseBody
public String categorylist(@RequestParam("callback")String callback)throws Exception{
//调用后台mapper查询数据
CategoryResult strJson=categoryService.getCategoryById();
//将数据封装到MappingJackson对象
MappingJacksonValue result = new MappingJacksonValue(strJson);
//封装回调函数方法名+数据
result.setJsonpFunction(callback);

return result;
}
@RequestMapping("/demo")
public String demo(){
return "index";
}

}






内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐