码迷,mamicode.com
首页 > Web开发 > 详细

【网络开发】WeX5的Ajax和Django服务器json接口对接跨域问题解决

时间:2016-05-16 12:38:08      阅读:201      评论:0      收藏:0      [点我收藏+]

标签:

问题背景

WeX5是典型的html5+js架构。源文件全部放到服务器的UI Server中,使用通用的tomcat,例如使用域名www.wuyoubar.cn:8080/x5。

Android和IOS的服务器端Django已经实现了json的处理,json的主域名www.wuyoubar.cn:80

PC访问WeX5页面。避免重复进行数据处理,WeX5的JS代码里面直接使用Ajax请求Django的json接口数据。这样就出现了跨域的问题,对于客户端来说,请求的源码,页面文件,css和js代码等都从8080端口获取,但json数据从80获取的。

解决办法

1、WeX5的Ajax的POST请求中增加支持跨域的属性xhrFields和crossDomain

$.ajax({

"type":"get",

"async" : true,

"url" : globalNet.getMyClassURL(),

"dataType":"json",

xhrFields: {

withCredentials: true

},

crossDomain: true,

success : function(data) {

//alert(JSON.stringify(data));

if(data){

//数据获取失败,状态是未登陆

if(!globalNet.statusIsOK(data[0])){

//justep.Util.hint(data[0].UserMsg);

//self.toLogin("msgContent");

}

//数据获取成功,装载

else{

myClass.loadData(globalFunc.getListData(

globalFunc.getMyClassUserData(),data)

,true);

//组件刷新

myClass.loaded = true;

myClass.refreshData();

globalFunc.setOnLine(true);

}

//判断是否需要跳转到登录或者绑定页面

//self.initWindows();

}

else{

//登录失败

//justep.Util.hint("数据加载失败");

}

self.initWindows()

},

error : function(){

justep.Util.hint("网络异常");

}

});

2、Django服务器,csrf的response处理process_response,头中添加Origin和Credentials属性即支持跨域

#print request.META

#Support the WeX5 cross domain 

if response.get("Access-Control-Allow-Origin")is None and request.META.get("HTTP_ORIGIN") is not None:

response["Access-Control-Allow-Origin"] = request.META.get("HTTP_ORIGIN")

response["Access-Control-Allow-Credentials"] = "true"

【网络开发】WeX5的Ajax和Django服务器json接口对接跨域问题解决

标签:

原文地址:http://www.cnblogs.com/inns/p/5497532.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!