mootools_带有jQuery,MooTools和Dojo的JSONP

mootools

JSONP MooTools jQuery

We all know that the big limitation of AJAX is that cross-domain requests aren't allowed.  We also know, however, that we skirt around that rule a bit by using JSONP.  JSONP is the process of SCRIPT tag injection, referencing a cross-domain URL and providing a callback function (on your page) that the provider will call so that you can handle the result.  Let's take a look at how JSONP is handled with jQuery, MooTools, and the Dojo Toolkit.  For our examples, we'll pull tweets from Twitter with the term "Arsenal" in them.

我们都知道AJAX的最大局限性是不允许跨域请求。 但是,我们还知道,通过使用JSONP,我们可以略过该规则。 JSONP是SCRIPT标签注入的过程,它引用跨域URL并提供提供程序将调用的回调函数(在页面上),以便您可以处理结果。 让我们看一下如何使用jQuery,MooTools和Dojo Toolkit处理JSONP。 对于我们的示例,我们将从Twitter中提取带有“ Arsenal”一词的推文。

jQuery JSONP (jQuery JSONP)

jQuery uses the same method for JSONP as it does for regular JSON -- the jQuery.getJSON method:

jQuery对JSONP使用与常规JSON相同的方法-jQuery.getJSON方法:


jQuery.getJSON("http://search.twitter.com/search.json?callback=?",{
	q: "Arsenal"
},function(tweets) {
	// Handle response here
	console.info("Twitter returned: ",tweets);
});


As long as a callback parameter is provided to the getJSON method, jQuery will consider the request JSONP.

只要为getJSON方法提供了回调参数,jQuery就会考虑请求JSONP。

MooTools JSONP (MooTools JSONP)

MooTools requires the Request.JSONP Class available in MooTools More.  Armed with Request.JSONP, fetching JSON from another domain is a piece of cake:

MooTools需要MooTools More中提供的Request.JSONP类 。 拥有Request.JSONP,从另一个域获取JSON真是小菜一碟:


new Request.JSONP({
	url: "http://search.twitter.com/search.json",
	data: {
		q: "Arsenal"
	},
	onComplete: function(tweets) {
		// Log the result to console for inspection
		console.info("Twitter returned: ",tweets);
	}
}).send();


Request.JSONP is a super compact class too!

Request.JSONP也是一个超级紧凑的类!

Dojo JSONP (Dojo JSONP)

JSONP with the Dojo Toolkit requires the dojo.io.script resource and its get method:

带有Dojo Toolkit的JSONP需要dojo.io.script资源及其get方法:


// dojo.io.script is an external dependency, so it must be required
dojo.require("dojo.io.script");

// When the resource is ready
dojo.ready(function() {
	
	// Use the get method
	dojo.io.script.get({
		// The URL to get JSON from Twitter
		url: "http://search.twitter.com/search.json",
		// The callback paramater
		callbackParamName: "callback", // Twitter requires "callback"
		// The content to send
		content: {
			q: "Arsenal"
		},
		// The success callback
		load: function(tweetsJson) {  // Twitter sent us information!
			// Log the result to console for inspection
			console.info("Twitter returned: ",tweetsJson);
		}
	});
});


Retrieving JSON with Dojo is usually done with the dojo.xhrGet method, but JSONP request this special method.  The arguments for dojo.io.script.get are the same as dojo.xhrGet with the exception of the callback parameter.

使用Dojo检索JSON通常是通过dojo.xhrGet方法完成的,但是JSONP请求此特殊方法。 dojo.io.script.get的参数与dojo.xhrGet相同,但回调参数除外。

JSONP is a hugely effective, reliable, and easy to implement.  JSONP strategies also allow developers to avoid cumbersome server-side proxy writing to retrieve data.  Each of the JavaScript libraries above have battle-tested methods for retrieving JSON data across domains -- it's up to you to implement them to suit your needs!

JSONP是非常有效,可靠且易于实施的。 JSONP策略还使开发人员可以避免繁琐的服务器端代理编写操作来检索数据。 上面的每个JavaScript库都有经过实践检验的方法来跨域检索JSON数据-您可以根据自己的需要实现它们!

翻译自: https://davidwalsh.name/jsonp

mootools

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值