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

问题背景

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"

时间: 2024-10-07 05:27:02

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

Django框架11 /同源、跨域

目录 Django框架11 /同源.跨域 1.同源 2.CORS 2.1 简单请求 2.2 非简单请求 2.3 两种请求的处理 3.总结 --- 支持跨域,简单/复杂请求 练习代码 Django框架11 /同源.跨域 1.同源 1.同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现. 2.同源是指,域名,协议,端口相同 3.

Ajax跨域问题解决(Ajax JSONP)

因WEB安全原因,Ajax默认情况下是不能进行跨域请求的,遇到这种问题,自然难不倒可以改变世界的程序猿们,于是JSONP(JSON with Padding)被发明了,其就是对JSON的一种特殊,简单来说就是在原有的JSON数据上做了点手脚,从而达到可以让网页可以跨域请求.在现在互联网技术对"前后分离"大规模应用的时期,JSONP可谓意义重大啊. 假设我们原来的JSON数据为 {"hello":"你好","veryGood":

odoo Controller接口开发 POST请求的跨域问题解决方法

odoo Controller接口开发 POST请求的跨域问题解决方法 1.odoo Controller接口开发,前端在请求的时候会发生跨域问题,报错信息如下:Function declared as capable of handling request of type 'json' but called with a request of type 'http' 2.解决方法如下: odoo官网给的参数解释: cors – The Access-Control-Allow-Origin c

AJAX学习笔记2:XHR实现跨域资源共享(CORS)以及和JSONP的对比

1 前言: 首先对参考文章作者表示感谢,你们的经验总结给我们这些新手提供了太多资源.本文致力于解决AJAX的CORS问题,我在逻辑上进行了梳理:首先,系统的总结了CORS问题的起源-同源策略:其次,介绍JSONP这种仅能支持GET请求的跨域方式和CORS作对比:最后,阐述CORS的XHR解决方式和IE中的XDR解决方式,在此基础上提供了工具函数进行跨浏览器的HTTP请求对象创建. 2 跨域问题的源头-同源策略 在客户端编程语言中,如javascript和 ActionScript,同源策略是一个

ajax跨域问题解决思路

ajax跨域问题的解决思路主要分为3种: 1.浏览器限制解决思路:不让浏览器做出限制解决方法:通过指定参数,让浏览器不做跨域校验评价:价值不大,需要每个人都做改动,而且改动是客户端的改动 2.XHR请求解决思路:不使用XHR解决方法:JSONP缺点:无法满足现有的开发要求 3.跨域(重要)解决思路:(1)被调用方修改代码,使其支持跨域(2)调用方隐藏跨域解决思路:(1)被调用方通过修改返回的信息,加入一些字段,允许调用方调用,此时只要通过浏览器跨域校验则允许跨域(2)使用代理,通过指定的url转

在控制台中承载WCF服务,并提供Ajax访问和SOAP访问,以及跨域访问

WCF服务可以承载与iis.winform.console.window服务中,下面重点介绍以console为载体,对外提供服务(服务满足web访问以及soap方式访问) 1.服务类的实现 wcf服务类一般有两种实现方式,下面分别对两种方式进行介绍: 1.1 使用接口进行实现 1 namespace Example 2 { 3 [ServiceContract] 4 public interface IService 5 { 6 7 [OperationContract] 8 string Ge

iis ajax post 跨域问题解决

iis ajax post时会遇到跨域的问题 只需要在IIS中http响应头中增加:Access-Control-Allow-Origin:*,即可解决问题

ajax调用.net API项目跨域问题解决

ajax调用.net API项目,经常提示跨域问题.添加如下节点代码解决:httpProtocol <system.webServer> <handlers> <remove name="ExtensionlessUrlHandler-Integrated-4.0" /> <remove name="OPTIONSVerbHandler" /> <remove name="TRACEVerbHandle

IE9版本号下面ajax 跨域问题解决

ajax跨域请求数据在谷歌火狐我本地IE11都是没问题的. 让測试就发现问题了,IE8下请求不到数据.然后我查看一下自己写的js看有没有不兼容问题.但是都没有啊.为什么就请求不到呢. 我把ajax的error打印出来提示no transport.网上找了资料在js中第一行加这个就能够了jQuery.support.cors = true; 好了这个问题没有了,但是又有还有一个error没有权限.这个问题百度了好多都没有我想要的,最后看了一篇文章让我豁然开朗这是IE浏览器的安全性设置问题, 解决方