*

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

Laravelでクラスをnewする

今回はLaravelでのクラスのnewの仕方です。 正確には、Laravelでの他ファイルで作成し

記事を読む

no image

Javascript パターン

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

記事を読む

no image

Laravelでルーティングからview表示をしてみる

Laravelでのroutes.phpの設定と、bladeを利用してview表示を行います。 いろ

記事を読む

no image

Facebookから日本語でデータ取得 (※だたしlocationは除く

Facebook Graph APIを通して取得したデータがローマ字や英語で困ることがあります。

記事を読む

no image

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

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

記事を読む

no image

Laravelでbladeを利用したViewを作成

今回はLaravelで採用されているviewテンプレートのBladeを利用して画面を作成してみます。

記事を読む

no image

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

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

記事を読む

no image

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

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

記事を読む

no image

PHPのcURLを利用してAPIをGET/POSTで叩く

PHPからcURLを利用してhttpのget, postで問い合わせを行ってみます。 今回はYAH

記事を読む

no image

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

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

記事を読む

Message

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

PAGE TOP ↑