来自 chrome 扩展的 GMail API 访问？ 403 禁止答案

【问题标题】：GMail API access from chrome extension? 403 Forbidden来自 chrome 扩展的 GMail API 访问？ 403 禁止
【发布时间】：2014-11-04 12:20:02
【问题描述】：

我有一个应用程序可以通过此处概述的工作流程从 Chrome 扩展程序中访问 Google API。

Chrome Extensions OAuth Tutorial

工作流的基础是初始化 OAuth 流程

var oauth = ChromeExOAuth.initBackgroundPage({
    'request_url': 'https://www.google.com/accounts/OAuthGetRequestToken',
    'authorize_url': 'https://www.google.com/accounts/OAuthAuthorizeToken',
    'access_url': 'https://www.google.com/accounts/OAuthGetAccessToken',
    'consumer_key': '{MY_CLIENT_ID}',
    'consumer_secret': '{MY_CLIENT_SECRET}',
    'scope': 'https://www.google.com/m8/feeds/ https://apps-apis.google.com/a/feeds/emailsettings/2.0/ https://mail.google.com/',
    'app_name': 'Gmail Plugin',
    'callback_page': 'src/google-oauth/chrome_ex_oauth.html'
});

安装扩展后，用户会被带到对话框页面以进行身份验证并同意我要求的范围。从这里我推断我的消费者密钥和秘密是好的。我已在 Google Developers 控制台中允许访问 GMail、联系人和 Admin SDK。

在此之前，我曾请求使用 Contacts API 和 Admin SDK API。我现在正在尝试添加一些利用 Gmail REST API 的功能。

设置请求的下一步是从后台页面发出请求。

function getSentEmails() {
  var emailCollection; 
  var url = "https://www.googleapis.com/gmail/v1/users/me/messages";
  var request = {
    'method': 'GET',
    'parameters': {
      'labelIds': 'SENT'
    }
  };
  var callback = function(response, xhr) {
    emailCollection = JSON.parse(response);
    console.dir(emailCollection);
  } 
  oauth.sendSignedRequest(url, callback, request);
};

签名请求的工作方式是调用一个方法来完成OAuth舞步的下一步，

oauth.authorize(function() {
    getSentEmails();
  });

这每次都会导致 403 Forbidden。通过此 OAuth 流程访问我提到的其他 API 似乎没有问题。我已在 manifest.json 中允许范围

manifest.json

  "permissions": [
    "tabs",
    "storage",
    "https://mail.google.com/*",
    "https://www.google.com/m8/feeds/*",
    "https://apps-apis.google.com/a/feeds/emailsettings/2.0/*",
    "https://www.googleapis.com/gmail/v1/users/*",
    "https://www.googleapis.com/auth/gmail.modify/*",
    "https://www.googleapis.com/auth/gmail.compose/*",
    "https://www.googleapis.com/auth/gmail.readonly/*",
    "https://www.google.com/accounts/OAuthGetRequestToken",
    "https://www.google.com/accounts/OAuthAuthorizeToken",
    "https://www.google.com/accounts/OAuthGetAccessToken"
  ]

我尝试了另一种构建 HTTP 请求的方法，如上面链接中所述。

function stringify(parameters) {
  var params = [];
  for(var p in parameters) {
    params.push(encodeURIComponent(p) + '=' +
                encodeURIComponent(parameters[p]));
  }
  return params.join('&');
};
function xhrGetSentEmails() {
    var method = 'GET';
    var url = 'https://www.googleapis.com/gmail/v1/users/me/messages';
    var params = {'labelIds': 'SENT'};
    var callback = function(resp, xhr) {
      console.log(resp);
    }
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function(data) {
      callback(xhr, data);
    };
    xhr.open(method, url + '?' + stringify(params), true);

    xhr.setRequestHeader('Authorization', oauth.getAuthorizationHeader(url, method, params));
    xhr.send();
  }

这样做我得到相同的 403。

我相信我的身份验证正确，因为如果我改变了

xhr.setRequestHeader('Authorization', oauth.getAuthorizationHeader(url, method, params));

到

xhr.setRequestHeader('Authorization','foo' + oauth.getAuthorizationHeader(url, method, params));

我得到了 401 Unauthorized 。

同样，访问我提到的其他 API 也没有问题。

任何意见将不胜感激。

【问题讨论】：

标签： javascript google-chrome-extension google-oauth gmail-api

【解决方案1】：

这个问题可能相当模糊，所以我将分享我最终是如何解决它的。

我将我的 chrome 扩展程序 OAuth 2.0 工作流程移到了较新的（自 Chrome 29 起）chrome.identity 应用程序和扩展程序设置。

此处为扩展设置 OAuth 2.0 的详细说明。

Chrome Identity API User Authentication

现在我可以使用了

chrome.identity.getAuthToken(function(token) {
  // Do HTTP API call with token
});

我的任何 HTTP 请求都不再被禁止 (403)。

希望这对扩展构建者有所帮助！

【讨论】：