javascript - 使用 auth 2.0 从 Chrome 扩展程序发送邮件，但卡在我不知道的地方

Question

我想从 Chrome 扩展程序发送电子邮件，用户必须在扩展程序弹出窗口中输入收件人的电子邮件地址，当前打开的选项卡的链接将发送到输入的电子邮件地址，但我陷入困境身份验证部分，它要求输入我的电子邮件的密码，如所示。

我输入后，它会重新加载同一页面，而不是发送邮件。请帮助我解决我出错的地方。 该代码适用于 popup.js 页面。

document.addEventListener('DOMContentLoaded', function () {
    document.querySelector('button').addEventListener('click', getCurrentTabAndUrl);

});

function getCurrentTabAndUrl() {

  chrome.tabs.getSelected(null, function(tab) {

        var tabId = tab.id;
        var tabTitle=tab.title;
        var tabUrl = tab.url;
        if (tabUrl=="chrome://newtab/") {
          document.getElementById("data").innerHTML="Looks like you opened a new tab, please open a web page and click again to Share.";
        }else {
        document.getElementById("data").innerHTML="subject="+tabTitle+'<br/>'+tabUrl;

        var to=document.getElementById("to").value;


        sendMessage('me',to,tabTitle,tabUrl);

        }
    });
}


function sendMessage(userId,to,subject,email) {

  authUser();

  var base64EncodedEmail = btoa(email);

  var request = gapi.client.gmail.users.messages.send({

    'userId': userId,

    'message': {
      'raw': base64EncodedEmail,

      "headers":[
        {"To":to},
        {"Subject":subject}
          ]
    }
  });

  request.execute();

}

function authUser(){

    chrome.identity.getAuthToken(
    {'interactive': true},
    function(token){
     // load Google's javascript client libraries
     var url="https://www.googleapis.com/gmail/v1/users/me/messages/send?access_token="+token;
        var request = new XMLHttpRequest();

    request.onreadystatechange = function(){
        if(request.readyState !== 4||request.status !== 200) {
            return;
        }

   var response=JSON.parse(request.responseText);
   console.log(response);

    };
    request.open('POST', url,true);

    request.send();
    request.setRequestHeader('Authorization','Bearer ' + token);
    });

}

Answer 1

调用 authUser()(它调用异步 API chrome.identity.getAuthToken)后，您立即发送电子邮件，因此由于尚未获取 token 而失败。

将该部分移动到回调中，该回调将在 getAuthToken 完成后执行:

function sendMessage(userId, to, subject, email) {
    authUser(function() {
        var base64EncodedEmail = btoa(email);
        var request = gapi.client.gmail.users.messages.send({
            'userId': userId,
            'message': {
                'raw': base64EncodedEmail,
                'headers': [
                    {'To': to}, 
                    {'Subject': subject}
                ]
            }
        });
        request.execute();
    });
}

function authUser(callback) {
    chrome.identity.getAuthToken({'interactive': true}, function(token) {
        // load Google's javascript client libraries
        var url = "https://www.googleapis.com/gmail/v1/users/me/messages/send?access_token=" + token;
        var request = new XMLHttpRequest();
        request.onreadystatechange = function() {
            if (request.readyState !== 4 || request.status !== 200) {
                return;
            }
            var response = JSON.parse(request.responseText);
            console.log(response);
            callback();
        }
        ;
        request.open('POST', url, true);
        request.send();
        request.setRequestHeader('Authorization', 'Bearer ' + token);
    });
}