このドキュメントでは、Facebookアクセストークンを取得する手順と、トークンを使用してFBフィードをフェッチする手順について詳しく説明します。
例:
ライブの例はで利用可能です
https://newtonjoshua.com
Graph APIの概要:
Graph APIは、Facebookのプラットフォームにデータを出し入れするための主要な方法です。これは低レベルのHTTPベースのAPIであり、データのクエリ、新しいストーリーの投稿、広告の管理、写真のアップロード、およびアプリが実行する必要のあるその他のさまざまなタスクに使用できます。
FaceBookアプリ:
https://developers.facebook.com
Facebookアプリを作成します。あなたApp_Id
はApp_Secret
グラフAPIエクスプローラー:
https://developers.facebook.com/tools/explorer/{{App_Id}}
/?method=GET&path=me%2Ffeed&version=v2.8
あなたaccess_token
は短命であるを得るでしょう。だからこれは私たちのになりますshort_lived_access_token
。
注:アクセストークンの作成中に、必要なすべてのfbフィールドを選択します。これにより、アクセストークンにそれらのフィールドをフェッチする権限が付与されます。
アクセストークン拡張:
https://graph.facebook.com/oauth/access_token?grant_type=fb_exchange_token&client_id= {{App_Id}}&client_secret = {{App_Secret}}&fb_exchange_token = {{short-lived-access_token}}
有効期間はaccess_token
2ヶ月です。
アクセストークンデバッガー:
https://developers.facebook.com/tools/debug/accesstoken?q= {{ access_token}}&version = v2.8
の詳細を確認できますaccess_token
。
Facebook SDK for JavaScript:
以下のJavaScriptをHTMLに含めて、SDKをページに非同期的にロードします
(function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {
return;
}
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
グラフAPI:
API呼び出しを行って、FB ID、プロフィール写真、カバー写真、フィードを取得しましょう。
window.fbAsyncInit = function () {
FB.init({
appId: '{{App_Id }}',
xfbml: true,
version: 'v2.7'
});
FB.api(
'/me',
'GET', {
fields: 'id,picture{url},cover,feed',
access_token: {{access_token}}
},
function (response) {
if (response.error) {
console.error(response.error.message);
}
if (response.picture.data.url) {
profilePic = response.picture.data.url;
}
if (response.cover.source) {
coverPic = response.cover.source;
}
if (response.feed.data) {
feeds = response.feed.data;
feeds.forEach(function (feed) {
// view each feed content
});
}
if (response.feed.paging.next) {
nextFeedPage = response.feed.paging.next;
// a request to nextFeedPage will give the next set of feeds
}
}
);
};
グラフAPIエクスプローラーを使用して、「フィールド」に入力する必要のあるクエリを設計します(例:「id、picture {url}、cover、feed」)
これで、access_tokenを使用してFacebookGraphAPIからFacebookデータをフェッチできます。
https://developers.facebook.com/docs/graph-api/overview/を参照してください
注:access_token
2か月で有効期限が切れます。その後、新しいaccess_tokenを作成します。