Question

我正在构建一个简单的chrome扩展，它使用OAuth与Twitter集成。我稍微修改了Chrome OAuth Tutorial以与Twitter集成。扩展是在Reactjs + Flux中构建的。

当用户点击＆＃34;使用Twitter登录＆＃34;按钮，触发动作登录，声明如下：

signin: function(){
    ChromeUtils.connecttotwitter().then(alert("Step After Then"));       
    AppDispatcher.dispatch({actionType:TweetSmartActions.SIGN_IN,signedInTwitterUserId: response.user_id});
},

ChromeUtils.connecttotwitter（）定义如下：

var ChromeUtils = {

    connecttotwitter: function () {

        return new Promise(function(fulfill,reject){
            var request = {
                type : "background.twitterRequestToken",
            };
            alert("Before sendMessage");
            chrome.runtime.sendMessage(request, function(response) {

                if (response)
                {
                    fulfill(response);
                }
                else
                {
                    reject(response);
                }
            });
        });
    },

事件监听器onMessage在background.js中定义为：

chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {

    console.log("background.js: " + JSON.stringify(request));

    var type = request.type;


    if (type == "background.twitterRequestToken")
    {
        oauth.authorize(function(token,secret,userId,screenname){
            sendResponse({success:true,userId:userId,screenName:screenname});
        });
        alert("Alerting before returning true");
        return true;
    }

当我点击＆＃34;使用Twitter登录＆＃34;按钮，验证流程确实启动并打开一个新页面。但是，在我介绍了Promise之后，新页面没有重定向到twitter oauth页面。实际上，为了调试我在chrome_ex_oauth.js中放了以下警告语句：

ChromeExOAuth.prototype.initOAuthFlow = function(callback) {
  if (!this.hasToken()) {
    var params = ChromeExOAuth.getQueryStringParams();
    if (params['chromeexoauthcallback'] == 'true') {
      var oauth_token = params['oauth_token'];
      var oauth_verifier = params['oauth_verifier']
      this.getAccessToken(oauth_token, oauth_verifier, callback);
    } else {
      var request_params = {
        'url_callback_param' : 'chromeexoauthcallback'
      }
      this.getRequestToken(function(url) {
        alert("Url after get request token " + url);
        window.location.href = url;
        alert(window.location.href);
      }, request_params);
    }

此处，第一个提醒中的网址是twitter oauth网址，但第二个提醒是Chrome扩展程序网址 -

chrome-extension://kiekipigbdldhggmlohbnhofnjhcbmem/chrome_ex_oauth.html

为什么url没有被分配到window.location.href？

关于可能发生的事情的任何想法？

Answer 1

问题不是因为我使用的是Promise，而是因为在使用Flux时，在收到Promise的响应之前，Action正在调度，这导致应用程序以某种方式挂起

signin: function(){
    ChromeUtils.connecttotwitter().then(alert("Step After Then"));       
    AppDispatcher.dispatch({actionType:TweetSmartActions.SIGN_IN,signedInTwitterUserId: response.user_id});
},

在上面，应该在当时调用的函数中调用AppDispatcher.dispatch。

使用Promise时OAuth Flow无法正常工作

1 个答案: