Casual & Fellow

关于Phonegap,存在跨域吗?

相信很多做Phonegap开发的朋友,都会遇到一个问题,那就是跨域。其实这个并不是一个问题,因为Phonegap本身不存在跨域,我也对这个概念模糊了很久。我一直以为Phonegap存在跨域问题,所以用了很多稀奇古怪的看法。其实一直都是错误的。那么这里到底是怎么引起的呢?又需要我们如何解决呢?好吧,我们一步一步来分析。

首先需求很明确,作为一个Web App就必须要实现局部刷新。那么就需要有Ajax来实现这个功能了。一般来说,地球人都会写简单的Ajax嘛,尤其是调用了jQuery后,就更加简单了。代码如下:

$.ajax({
url : “xxx.com”,
type : “POST”,
dataType: “json”,
data : REQUEST,
success : function (){
console.log(“success”):
}
});

好了,问题就来了。请求后发现浏览器报错,一看console,就发现原来是跨域问题引起的。好吧,跨域问题嘛,我用jsonp,或者是getScript的办法来解决不就好了。但是如果这里面涉及到一些敏感数据的传输,这就危险了,因为我们都知到jsonp或者getScript的f办法都是用GET的办法来传输数据的。那么我硬是用POST的办法来传,怎么办呢?

于是我们就开始查询Phonegap的文档了。找啊找,终于看到Phonegap wiki里面说: “The cross-domain security policy does not affect PhoneGap applications. Since the html files are called by webkit with the file:// protocol, the security policy does not apply.”

对啊!Phonegap本身就没有什么安全问题的限制,是允许跨域请求的啊。这里面到底是出了什么问题呢?于是一连串的调试就开始了。查了好多的文档,问了好多的人。到最后经过Jeff兄的帮忙,看到JQUERY MOBILE的一篇文章,提及到jQuery默认对跨域请求有一定的限制。于是就找到了代码:$.support.cors = true;

设定后,跑动Javascript代码,完事!原来这一切都是因为jQuery引起的。这个小问题困扰了我好几天。有时候再多的聪明也不能够弥补经验上面的缺失啊。所以平时还是要多多练手啊。由于这次的请求我是需要修改header的,所以也把header修改的demo代码在这里和大家分享一下吧。没有经验的朋友赶紧练手哦。

function makeRequest() {
$.support.cors = true;
var settings = {
type: “POST”,
url: URL,
data: REQUEST,
dataType: “json” ,
error: function(XHR,textStatus,errorThrown) {
alert(XHR);
alert(“textStatus: “ + textStatus);
alert(“errorThrown: “ + errorThrown);
//alert (“XHR=”+XHR+”\ntextStatus=”+textStatus+”\nerrorThrown=” + errorThrown);
},
success: function(data) {
//alert(“ok啦”);
//$(“body”).append(data);
alert(JSON.stringify(data));
alert(data.status);
alert(data.message);
},
headers: {
“Access-Control-Allow-Origin” : “xxx.com”,
“Access-Control-Allow-Headers” : “X-Requested-With”,
“X-CASH” : “xxx”,
“X-Lee” : “xxx”,
“X-HELLO” : “xxx”,
“X-WORLD” : “xxx”,
}
};
$.ajax(settings);
}
//执行请求
makeRequest();

这个问题我此前一直有误解。所以在此向看过我PPT分享的朋友说声对不起。大家日后在使用JS库的时候,要看看一些库的默认属性,看看会不会影响到API的调用。不然这会盲目地浪费好多时间在无谓的事情上面。希望大家引以为鉴,我也会好好复习jQuery的。而且Phonegap是一个很强大的框架,可惜的是国内的开发者难以集中起来,出了问题不太好解决,我一般都是上stackoverflow上面咨询的。希望国内的开发者能够踊跃地聚集起来,让这个好的开发工具发扬光大吧。

刚刚提及到安全问题,借此我也说说Phonegap在面对这个问题的时候可能会出现的情况。刚刚解决了跨域问题(实质上并没有跨域,也就是说这样传输数据是安全的),但是不代表没有了安全问题。因为这些应用的逻辑是在JS中实现的,那么核心的代码也会在JS中。这有什么问题呢?问题就在这里了,一般ipa(以ios应用为例),如果被不法分子下载后,反编译去获取ipa文件的代码,可能就可以将js文件重新解析出来。这时候,安全的key等东西就可能会被获取。这个时候一般有几个解决办法:

1,混合到obj-c的代码中(虽然听起来有点高级,不过是可以实现的,这里补充一句,学习obj-c对phonegap开发有莫大的好处);

2,利用一些压缩的技术,混合到一些png文件中,这就好像此前有人压缩js代码一样,混合进取;

3,自己实现一套比较好的加密机制;

4,对代码进行加密,混淆,尽最大限度地不让竞争对手或者是不法分子难以破解。

好的,大概经验就分享到这里了。我遇到问题的时候还会在线上进行提问的。希望大家能够多多交流!:-)