关于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,对代码进行加密，混淆，尽最大限度地不让竞争对手或者是不法分子难以破解。

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