スポンサーリンク

このドキュメントの内容は、以下の通りです。

JavaScriptライブラリ jQueryJSONPを扱うには、
$.ajaxを利用します。

ajaxの使用例


callback関数は、jQueryが自動的に生成してくれます。

<script type="text/javascript">
$.ajax({
	url: "https://example.com/jsonapi",
	dataType: "jsonp",
	data:{
		param1: value1,
		param2: value2
	},
	success:function(json){
		// 正常時にここが実行されます。
	},
	error:function(){
		alert('error');
	}
});
</script>

callback関数を指定するパラメータがcallbackでない場合は、jsonp
というパラメータで指定してやります。
<script type="text/javascript">
$.ajax({
	url: "https://example.com/jsonapi",
	dataType: "jsonp",
	data:{
		param1: value1,
		param2: value2
	},
	jsonp: "jsonp_callback",
	success:function(json){
		// 正常時にここが実行されます。
	},
	error:function(){
		alert('error');
	}
});
</script>

サンプルプログラム

Google Open Social Graph APIを利用した例です。
<div id="info"></div>
<script src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
function showSocialGraph(url,d){
	var rss = d['nodes'][url]['attributes']['rss'];
	var profile = d['nodes'][url]['attributes']['profile'];
	$('#info').html(rss + '<br>' + profile);
}
function getSocialGraph(url){
	$.ajax({
		url: "https://socialgraph.apis.google.com/lookup",
		dataType: "jsonp",
		data:{
			q: url
		},
		success:function(json){
			showSocialGraph(url,json);
		},
		error:function(){
			alert('error');
		}
	});
}
function init(){
	getSocialGraph("https://twitter.com/whoami");
}
google.load("jquery", "1");
google.setOnLoadCallback(function() {
	init();
});
</script>

実行例


Google+ API のサービスが終了してしまったので、実行例はありません。



jQeuryを使うと簡単に、JSONPを扱うことができますね。

スポンサーリンク
スポンサーリンク
 
いつもシェア、ありがとうございます!


もっと情報を探しませんか?

関連記事

最近の記事

人気のページ

スポンサーリンク
 

過去ログ

2020 : 01 02 03 04 05 06 07 08 09 10 11 12
2019 : 01 02 03 04 05 06 07 08 09 10 11 12
2018 : 01 02 03 04 05 06 07 08 09 10 11 12
2017 : 01 02 03 04 05 06 07 08 09 10 11 12
2016 : 01 02 03 04 05 06 07 08 09 10 11 12
2015 : 01 02 03 04 05 06 07 08 09 10 11 12
2014 : 01 02 03 04 05 06 07 08 09 10 11 12
2013 : 01 02 03 04 05 06 07 08 09 10 11 12
2012 : 01 02 03 04 05 06 07 08 09 10 11 12
2011 : 01 02 03 04 05 06 07 08 09 10 11 12
2010 : 01 02 03 04 05 06 07 08 09 10 11 12
2009 : 01 02 03 04 05 06 07 08 09 10 11 12
2008 : 01 02 03 04 05 06 07 08 09 10 11 12
2007 : 01 02 03 04 05 06 07 08 09 10 11 12
2006 : 01 02 03 04 05 06 07 08 09 10 11 12
2005 : 01 02 03 04 05 06 07 08 09 10 11 12
2004 : 01 02 03 04 05 06 07 08 09 10 11 12
2003 : 01 02 03 04 05 06 07 08 09 10 11 12

サイト

Vim入門

C言語入門

C++入門

JavaScript/Node.js入門

Python入門

FreeBSD入門

Ubuntu入門

セキュリティ入門

パソコン自作入門

ブログ

トップ


プライバシーポリシー