phonegap-本地开发如何取服务器数据

phonegap-本地开发如何取服务器数据，这一直是个很让人困扰的问题。

特别是在做本地页面调试和样式修改的时候。

如何在本地浏览器里面获取数据浏览app。

简单的说就是在咱们的api文件里面声明ccess-Control-Allow-Origin。

首先需要在服务器里面开启

Apache：Apache需要使用mod_headers模块来激活HTTP头的设置，它默认是激活的。你只需要在Apache配置文件的<Directory>, <Location>, <Files>或<VirtualHost>的配置里加入以下内容即可：

Header set Access-Control-Allow-Origin *

那么不同的脚本有不同的写法

PHP：只需要使用如下的代码设置即可。

<?php
header(“Access-Control-Allow-Origin:*”);

C#代码

esponse.AppendHeader(“Access-Control-Allow-Origin”, “*”);

Python代码

class CORSEnabledHandler(webapp.RequestHandler):
def get(self):
self.response.headers.add_header(“Access-Control-Allow-Origin”, “*”)
self.response.headers[‘Content-Type’] = ‘text/csv’
self.response.out.write(self.dump_csv())

知识延伸

首先需要了解

CORS其实出现时间不短了，它在维基百科上的定义是：跨域资源共享（CORS ）是一种网络浏览器的技术规范，它为Web服务器定义了一种方式，允许网页从不同的域访问其资源。而这种访问是被同源策略所禁止的。CORS系统定义了一种浏览器和服务器交互的方式来确定是否允许跨域请求。它是一个妥协，有更大的灵活性，但比起简单地允许所有这些的要求来说更加安全。

详细内容

要使用CORS，我们需要了解前端和服务器端的使用方法。

1、前端

以前我们使用Ajax，代码类似于如下的方式：

var xhr = new XMLHttpRequest();
xhr.open(“GET”, “/hfahe”, true);
xhr.send();

这里的“/hfahe”是本域的相对路径。

如果我们要使用CORS，相关Ajax代码可能如下所示：

var xhr = new XMLHttpRequest();
xhr.open(“GET”, “http://blog.csdn.net/hfahe”, true);
xhr.send();

请注意，代码与之前的区别就在于相对路径换成了其他域的绝对路径，也就是你要跨域访问的接口地址。

我们还必须提供浏览器回退功能检测和支持，避免浏览器不支持的情况。

function createCORSRequest(method, url) {
var xhr = new XMLHttpRequest();
if (“withCredentials” in xhr) {
// 此时即支持CORS的情况
// 检查XMLHttpRequest对象是否有“withCredentials”属性
// “withCredentials”仅存在于XMLHTTPRequest2对象里
xhr.open(method, url, true);
} else if (typeof!= “undefined”) {
// 否则检查是否支持XDomainRequest，IE8和IE9支持
// XDomainRequest仅存在于IE中，是IE用于支持CORS请求的方式
xhr = new XDomainRequest();
xhr.open(method, url);
} else {
// 否则，浏览器不支持CORS
xhr = null;
}
return xhr;
}
var xhr = createCORSRequest(‘GET’, url);
if (!xhr) {
throw new Error(‘CORS not supported’);
}