如何在 Google Chrome 扩展中使用 JavaScript 获取 Facebook 的新 OAuth 2.0 access_token? [英] How do I get Facebook's new OAuth 2.0 access_token with JavaScript in Google Chrome Extention?
问题描述
我想创建一个简单的 Google Chrome 扩展来显示来自 Facebook 的新闻.
I want to create simple Google Chrome extention which would display News from Facebook.
可以通过调用以下方法检索新闻提要:
https://graph.facebook.com/me/home?access_token=...
News feed can be retrieved by calling this:
https://graph.facebook.com/me/home?access_token=...
但我需要access_token.
有人可以提示如何定义一个 JavaScript 函数，当给定 YOUR_APP_ID 时，该函数将返回 access_token.这个功能也应该在 Chrome 扩展中工作.
Could someone give a hint how to define a JavaScript function which would return access_token when given YOUR_APP_ID. This function also should work inside Chrome Extention.
互联网上的其他示例不起作用，因为:
Other examples on the internet did not work, because:
- 我没有服务器.
- FB.getLoginStatus 似乎不起作用.
EDIT1:
我已经试过了:
function getAccessToken2(YOUR_APP_ID) {
alert("before FB.init");
FB.init({
appId : YOUR_APP_ID ,
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
alert("before FB.login");
FB.login( function (response) {
alert("response");
if ( response.authResponse ) {
alert("response.authResponse");
var access_token = response.authResponse.access_token;
alert(access_token);
}
} );
}
我有:
- alert("在 FB.init 之前");
- alert("在 FB.login 之前");
弹出窗口已打开.它的 URL 是 这个.内容是:
API Error Code: 191
API Error Description: The specified URL is not owned by the application
Error Message: Invalid redirect_uri: Given URL is not allowed by the Application configuration.
但我已经没有得到:
- 警报(响应")；
- 警报(访问令牌)；
- 在调试模式下未发现其他 JavaScript 错误.
编辑 2这里的问题是我需要像桌面应用程序一样在 Facebook 进行身份验证.恕我直言.
Edit2 The issue here is that I need to authenticate at Facebook like a desktop application. IMHO.
推荐答案
Facebook 确实允许桌面流身份验证，请参阅 本文档
Facebook does allow desktop flow authentication, see this documentation
如果使用 chrome 扩展，您需要指定一个特殊的 return_uri.https://www.facebook.com/connect/login_success.html)
You need to specify a special return_uri if using a chrome extension. https://www.facebook.com/connect/login_success.html)
您还需要将 tabs 和 URL 添加到您的清单权限 - 即:
You also need to add tabsand the URL to your manifest permissions - i.e.:
"permissions": [
"tabs",
"https://facebook.com/connect/*"
]
当用户点击登录/认证按钮时，您需要执行两个步骤:
When a user clicks the login/auth button, you need to perform two steps:
将用户重定向到 OAUTH 页面:
Redirect the user to the OAUTH page:
chrome.tabs.create(
{
'url': "https://www.facebook.com/dialog/oauth?client_id=client_id>&redirect_uri=https://www.facebook.com/connect/login_success.html"
}, null);
步骤 2
向 Tab 更新添加一个侦听器，用于在所有标签中搜索成功 URL:
Step 2
Add a listener to Tab updates that searches all tabs for the success URL:
chrome.tabs.onUpdated.addListener(function() {
var lis = this;
chrome.tabs.getAllInWindow(null, function(tabs) {
for (var i = 0; i < tabs.length; i++) {
if (tabs[i].url.indexOf("https://www.facebook.com/connect/login_success.html") == 0) {
var token = tabs[i].url.match(/[\?&#]auth_token=([^&#])*/i)
chrome.tabs.onUpdated.removeListener(lis);
return;
}
}
});
});
请注意，我有一个相关问题 使用提供的 javascript api 用于桌面流程，因为我总是收到相同的 API 错误 (191)
Note that I've got a related question on using the provided javascript api for desktop flow, as I've always received the same API error (191)
这篇关于如何在 Google Chrome 扩展中使用 JavaScript 获取 Facebook 的新 OAuth 2.0 access_token?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
