*

Facebook APIを試してみました

公開日: : 最終更新日:2015/03/09 投稿者:raru Facebook, web技術

Facebook APIが気になったのでちょっと試してみました。

まず私が勘違いしていたこと
・APIは関数群のjavascriptモジュール
・APIを叩けばすぐにデータが取得出来る
・サーバーが必須
・自分が使おうとしているものはFacebook APIという名前

実際のところ
・Facebook APIはurlを叩くとjsonが返ってくるものらしい
・APIを叩いてもAuth認証が通ってないので、ろくにデータが取れて来ない。(認証はおおむね必須)
・サーバーは別に要らない。jsのみで実装可能。ただし普通に考えてサーバがある方が便利
・どうもFacebook Graph APIというらしい。
※ Facebook APIというもの自体があるかは気にしてなかったので不明

今回ハマったこと
・認証を通すにはFacebook自体にFacebookアプリを登録しないといけない
・認証ページにリダイレクトする必要があるので、その部分に関してはajaxではエラーに成る
※ mime typeがhtmlであるためっぽい。jqueryでエラーになっていたので、生で書けば大丈夫かも……?

というわけで、私が今回動作を確認するまでに行なったことは
1. Facebookアプリ登録。
2. アプリ設定画面でドメインの設定。
設定画面の Add Platform を押下してサイトURLにhttp://localhost/test/を設定後、設定項目のAppDomainsにhttp://localhostを設定。
3. クライアントでhtml, jsを実装
4. 認証を通す
5. 検索

ハイパーざっくりコードに落とすと
1.認証画面に飛ばす

location.href = AUTH_URL + "?redirect_uri=" + REDIRECT_URL + "&client_id=" + CLIENT_ID

2.戻り先で認証トークンをくださいってお願いする

$.ajax({
	url: GRAPH_DOMAIN + "oauth/access_token?redirect_uri=" + REDIRECT_URL + "&client_secret=" + CLIENT_SECRET + "&client_id=" + CLIENT_ID + "&code=" + code,
	type: "get",
	success: function(result){
		// resultになんか入っているので取得してどうにかする
	}
});

3.認証が通ったので検索する

$.ajax({
	url: GRAPH_DOMAIN + "search?q=" + word + "&type=place&access_token=" + token,
	type: "get",
	dataType: "json",
	success: function(json){
		// jsonを使ってなんかする
	}
});

ちなみに私の場合の画面遷移は
index.html -> Facebookの認証画面 -> index.htmlとなっています。
リクエストパラメーターの redirect_uriは一致させないと認証が通らないっぽい気がします。

ざっくりで役に立ちそうにないですが、以外に役に立つかも知れない備忘録でした!

関連記事

no image

IEとchromeでbeforeunloadをaタグのhrefに反応させずに利用……できなかった

今回beforeunloadが面倒な動きをしていたので調査&ある程度都合よくしてみました。 してみ

記事を読む

no image

要求されたアクションを実行するには、WordPress が Web サーバーにアクセスする必要があります。

wordpressの更新を行おうとした時の上記のエラーが発生した場合に、いくつか対策方法があります。

記事を読む

no image

システムの仕様書を作れそうなウェブアプリ

現在サービス開発を本気で取り組もうと思っているraruです。 本気が指すところは、事業として成立す

記事を読む

no image

WebRTC + Node によるルーム機能付きビデオチャット 2

前回の続き こちらは前回の記事の続きになります。 また前回の記事にコメントを頂いたのですが、

記事を読む

no image

MAMPでLaravelを動作させる

先日laravelをMAMPのhtdocsに配置しましたが、当然それでは動かなかったので設定しました

記事を読む

no image

PHPでXMLをnamespaceを利用したxpathでnode取得

PHPでxmlを読み込んでxpathでnodeを取得して見たいと思います。 今回はyahooの形態

記事を読む

no image

Javascript パターン

最近更新を行なえるほど技術を追っていませんが、日々の電車での移動時間に本を読んでいます。 2駅乗っ

記事を読む

no image

Node.jsのSocket.io入門

前置き WebRTCを使用して通信を行なうときに、offerなどの情報を伝える為にサーバサイドのプ

記事を読む

no image

socket.ioとwebRTCでビデオチャット

現在作成したいものがあるために、その予行演習として nodeのsocket.ioとwebRTC機能

記事を読む

no image

Mac OS X (Yosemite) にLaravelをインストール

Max OS 10.10(yosemite)にPHPフレームワークのLaravelをインストールして

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

PAGE TOP ↑