开发者社区> johnwong> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

Sencha Touch跨域问题解决

简介:
+关注继续查看

之前对于跨域问题仅有粗浅的认识,一般是浏览器层面出于安全性的考虑,不允许调用其他页面的对象。这次在Sencha Touch中解决这个问题额外花掉不少时间。

解决的方法大概就是:

  1. 修改服务器的header;
  2. JsonP。JsonP方法是一种非官方的解决方案,只支持Get方法,需要服务器端根据callback参数返回不同的内容。返回的内容不是标准的json格式,对服务器端的改动会比较麻烦。我选择了修改服务器返回的header的方法。

1. 修改header的Access-Control-Allow-Origin

将header的Access-Control-Allow-Origin设为允许的域名列表,我这里直接设置为星号了。项目采用的是SSH的架构。在jsp文件中,可以使用response.addHeader方法修改header,在所有页面都会包含的公共文件中加入即可。更好的办法是写一个Filter,对json请求的路径拦截,修改header:


HttpServletResponse httpResponse = (HttpServletResponse)response;
        httpResponse.addHeader("Access-Control-Allow-Origin", "*");


对于iframe跨域的问题,可以将设置“P3P"为"CP=CAO PSA OUR"。

2. 修改header的Access-Control-Allow-Headers

在新版的Chrome浏览器下,上述方法仍然无法达到目的,需要将header的Access-Control-Allow-Headers设为Origin, X-Requested-With, Content-Type, Accept。

3. 修改Sencha Touch

一般情况下跨域问题已经解决了。在Sencha Touch下发现每一个Ajax请求都发送了两次,其中一次的请求方法为OPTIONS。我只知道常用的Get、Post,听说过Put、Delete。查过后才知道OPTIONS方法是用于获取指定URL能接收的请求方法。我用jQuery发送GET请求没有出现,手写HttpXmlRequest也没有出现。这样的问题在StackOverFlow和Sencha论坛上也看到有不少人遇到。用Web调试工具找发送OPTIONS请求的地方,没有找到。对于jQuery和Sencha的http请求头,发现了问题所在。Sencha发送的头中包含了X-Requested-With的头,jQuery中没有。估计是这个请求头触发了浏览器去探测该URL可用的请求方法。大多服务器都不支持这个方法,觉得Sencha这么做是多此一举了。如果是使用Ext.Ajax.request发送请求,直接在配置中写useDefaultXhrHeader : false就可以了。但是这里是将请求用在Ext.data.Store中,不支持这个配置。懒得该太多源文件支持这个配置,直接将Connection.js中这个配置的默认值改为false。

另外还遇到Sencha Touch编译的坑。特定版本编译报Logger.js不存在,需要将app.json中的buildOptions下logger的值由"no"改为"false"。接下来需要解决的sencha touch的坑是开发环境运行问没问题,编译后界面部分不显示,交互出问题。

感谢IBM实习的机会,让我学会了Web调试。感谢万能的StackOverFlow,能找到各种问题的解决方案。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Spring 全家桶之 Spring Data JPA(五)(上)
Spring 全家桶之 Spring Data JPA(五)
9 0
ssh端口转发(跳板机)详解
如果在工作环境中,被防火墙限制了一些网络端口的使用,但是允许SSH的连接,也能够将通过ssh端口转发来进行通讯。
68 0
成功解决Python中出现的ValueError: not enough values to unpack (expected 2, got 1)的问题
成功解决Python中出现的ValueError: not enough values to unpack (expected 2, got 1)的问题
372 0
flink实战 —— 定时器实现已完成订单自动五星好评
云栖号资讯:【点击查看更多行业资讯】在这里您可以找到不同行业的第一手的上云资讯,还在等什么,快来! 背景需求 在电商领域会有这么一个场景,如果用户买了商品,在订单完成之后,24小时之内没有做出评价,系统自动给与五星好评,我们今天主要使用flink的定时器来简单实现这一功能。
923 0
intellij idea中spring boot properties文件不能自动提示问题解决
idea和sts里面都有对spring boot中properties文件的提示功能,而且可以通过点击属性可以进入到*Properties.java这类文件中。
8339 0
Java并发编程笔记之ThreadLocal内存泄漏探究
使用 ThreadLocal 不当可能会导致内存泄露,是什么原因导致的内存泄漏呢? 我们首先看一个例子,代码如下: /** * Created by cong on 2018/7/14. */ public class ThreadLocalOutOfMemoryTest { stat.
3127 0
Sencha Touch xtype对应的class
Sencha Touch 2的有效xtype   xtype Class ----------------- --------------------- actionsheet Ext.
742 0
sencha touch 学习笔记- 安装与环境(2013网页装在兜里)
sencha touch 是Extjs 的手机版,Extjs是创建富客户端的AJAX应用中的重量级框架,sencha touch当然就是面向触摸设备的重量级js框架, 在做基于桌面的网页时经常用的js库是jquery,Extjs很少用,几乎没用过,1是因为Extjs“重”,加载时间长;2是因为Extjs自称体系学起来难度大,插件没jquery多。
819 0
SSH端口转发内网
ssh -C -f -N -g -R 1080:127.0.0.1:1080 gg@1.1.
464 0
Sencha Touch 2.1 更新
October 24, 2012 | Jamie Avins http://www.sencha.com/blog/whats-new-in-sencha-touch-2.1/ 啥更新了?What’s New? Sencha Touch 2.1 将是 Sencha 移动框架的下一新版本。
800 0
+关注
文章
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载