Gmail是最早大规模使用Ajax技术的,所以谷歌浏览器更容易使用这种数据访问技术,这也符合ThingJS的3D开发方法。
00-1010通过XHR进行Ajax通信的主要限制之一来自跨域安全策略。默认情况下,XHR对象只能访问包含它的页面所在域中的资源。此安全策略可以防止一些恶意行为。然而,实现合理的跨域请求对于开发一些浏览器应用程序也非常重要。它允许浏览器向跨域服务器发送XMLHttpRequest请求,从而解决了Ajax跨域数据请求的问题。
为什么Ajax
CORS(Cross-origin resource sharing)是W3C的一个工作草案,它定义了当必须访问跨源资源时浏览器和服务器应该如何通信。CORS背后的基本思想是使用定制的HTTP头让浏览器与服务器通信,从而决定请求或响应应该成功还是失败。例如,GET或POST发送的简单请求没有自定义的头,主要内容是文本/纯文本。发送此请求时,需要附加一个Origin头,其中包含请求页面的源信息(协议、域名和端口),以便服务器根据此头信息决定是否给出响应。以下是“原点”标题的示例:````
出发地: http://www.nczonline.net
````
如果服务器认为这个请求是可接受的,它将在访问控制-允许-源头中回发相同的源。
信息(如果是公共资源,可以回复' * ')。例如:
````
访问控制-允许-来源: http://www.nczonline.net
````
如果没有这样的头,或者如果有这样的头但源信息不匹配,浏览器将拒绝该请求。通常,浏览器会处理该请求。请注意,请求和响应都不包含cookie信息。
00-1010对于前端来说,整个CORS通信过程由浏览器自动完成。对于开发人员来说,前端代码与普通的Ajax代码完全相同。实现CORS的关键是后端。可以通过在服务器端设置响应头的访问控制允许来源属性来启动CORS。该属性指示哪些域名可以访问资源。如果设置了通配符,所有网站都可以访问资源,例如:
````
访问控制允许来源',' *///所有网站都可以访问。
//只能访问ThingJS网站。
//'访问-控制-允许-来源',http://www.thingjs.com
````
如果CORS请求不是简单的跨站点请求,例如:
使用除GET或POST (PUT DELETE等)以外的HTTP请求方法。);
请求的内容类型不属于以下三个类别之一:
application/x-www-form-URL encoded;
文本/纯文本;
多部分/表单数据;
用户定义的请求头信息(如令牌数据)已发送。
然后根据实际情况,在服务器的响应头中设置访问控制允许头和访问控制允许方法的相关属性值,例如:
浏览器Ajax请求是:
````
$.Ajax({ 0
标题' : {
令牌' : '31415926'//请求头携带令牌数据。
},
URL ' : ' http://localhost :3000/getdatabyds ',
键入' : '开机自检',
//向服务器发送数据时使用的内容类型。默认值为:“application/x-www-form-urlencode”,但该方法不会将复杂的JSON组织成键值对。
//因此,将contentType设置为‘application/JSON;Charset=utf-8 ',这是一种文本类型。
contentType': '应用程序/JSON;charset=utf-8 ',
数据类型' : 'json ',
//发送到服务器的数据设置为‘application/JSON;Charset=utf-8 ',其中json对象需要转换为字符串并发送。
data ' : JSON . stringify({ ' ids ' :[1,2,3] }),
成功' :函数(数据){ 0
console.log(数据);
}
});
服务器需要设置:
//配置允许的请求方法。如果写了*的话,所有的都是允许的。
访问控制-允许-方法','放,发布,获取,删除,选项';
//配置允许的自定义请求头。如果写了*的话,所有的都是允许的。
访问控制-允许-标题','内容类型,令牌'
````
ThingJS基于浏览器开发和数据对接。Ajax方法是JS执行异步请求的选择,可移植性更强!