将 Chrome 扩展连接到 StackExchange oAuth API

Question

TL;DR - 我正在尝试构建一个 Chrome 扩展程序，用于显示来自 StackOverflow 的用户当前通知的数量。

我正在按照Chrome 扩展程序教程创建利用 oAuth 的扩展程序。将 Google oAuth 位替换为（我认为是）StackExchange API 位，我最终在文件中得到以下内容background.js：

var oauth = ChromeExOAuth.initBackgroundPage({
    //ES6 template strings!
    'request_url'   : `https://stackexchange.com/oauth?client_id=${STACK_APP.id}&scope=read_inbox,no_expiry`, 

    'authorize_url' : 'https://stackexchange.com/oauth/login_success',
    'access_url'    : 'https://stackexchange.com/oauth/access_token',

    'consumer_key'    : STACK_APP.key,
    'consumer_secret' : STACK_APP.secret,

    //'scope'    : '', //not sure I need this...

    'app_name' : 'StackOverflow Notifications (Chrome Extension)'
});

oauth.authorize(function () {
    console.log('authorize...');
});

当我在本地运行扩展程序时，它会尝试打开一个新的浏览器选项卡来完成 oAuth 握手——这很棒，只是我最终到达以下 URL：https: //stackexchange.com/oauth/login_success ?oauth_token=不明确的

浏览器选项卡卡在此处。

我不太确定问题是什么 - 我不知道我的initBackgroundPage()调用中是否列出了错误的 URL，或者我的 StackApp 是否有错误的 oAuth 域（因为它是 Chrome 扩展...这个问题没有真正为我解答问题）。

任何想法将不胜感激！

Answer 1

据我所知，我在 OP 中提到的 oAuth 教程已经过时了——你不再需要任何这些，你可以使用它chrome.identity。

需要明确的是，我必须做一些事情：

STACK_APP = {
    id           : 1234,
    scope        : 'read_inbox,no_expiry',

    request_uri  : 'https://stackexchange.com/oauth/dialog',
    redirect_uri : chrome.identity.getRedirectURL("oauth2")
};

//ES6 template string!
var requestUrl = `${STACK_APP.request_uri}?client_id=${STACK_APP.id}&scope=${STACK_APP.scope}&redirect_uri=${STACK_APP.redirect_uri}`;


//https://developer.chrome.com/extensions/identity
//https://developer.chrome.com/extensions/app_identity#update_manifest
chrome.identity.launchWebAuthFlow({
    url         : requestUrl,
    interactive : true
}, function (url) {
    console.log('redirected to: ' + url);
});

请注意redirect_uri-- 这最终成为 chromiumapp.org 的子域，因此您需要在 StackApps 中将其列为您的应用程序的域（允许 oAuth 继续）。