如何设置 Google Drive 客户端 ID 以在没有本地服务器的情况下进行访问？答案

【问题标题】：How to set up a Google Drive Client ID for access without a local server?如何设置 Google Drive 客户端 ID 以在没有本地服务器的情况下进行访问？
【发布时间】：2015-03-20 13:16:54
【问题描述】：

我想知道是否可以在随机计算机上打开jsfiddle 并登录并验证并使用驱动器 API，而不必一直运行本地服务器？究竟如何进行设置？如果这是一个简单的问题，我很抱歉，但我有点迷路了，因为到目前为止我发现的说明还不清楚。

编辑：

到目前为止，我有，来自here 和here：

通过Google Developers Console创建了一个项目。
在那里打开该项目，导航到 APIs & auth 下的 API，并确保 Drive API 已启用
进入凭据，然后单击“创建新的客户端 ID”
- 已选择“Web 应用程序”
- 将授权的javascript来源设置为http://localhost:4567
- 删除重定向 URI 中的所有内容并将其留空，然后按“创建客户端 ID”。
获取this、this 或this 之类的样本，并将其存储在名为 index.html 的本地文件中。
- 这不会通过简单地在浏览器中打开来运行，所以我必须托管一个本地服务器
- 我在命令行中导航到该目录，然后键入“python -m SimpleHTTPServer 4567”（不带引号），这托管了一个本地服务器
- 在我的网络浏览器中打开http://localhost:4567，在将新创建的客户端 ID 复制到他们要求的文件中后，所有这些示例都可以正常工作。

我也做了一个python应用，用pydrive我：

单击“创建新的客户端 ID”，然后单击“已安装的应用程序”和“其他”，然后单击“创建客户端 ID”。
接下来我去了Old Google APIs Console，点击API Access，找到那个客户端ID，然后点击下载JSON。
我将此 client_secrets.json 放置在我的 python 应用程序旁边，这允许 pydrive 成功进行身份验证，并且我可以使用该客户端 ID 在任何地方访问和修改我的谷歌驱动器文件。当然，我在将应用程序提供给其他人之前删除了这个 client_secrets.json，并向他们展示了如何执行此过程。

但是，除此之外，我有点不确定，具体来说：

如何在无需设置本地服务器的情况下在 Web 应用程序中使用驱动器 API，例如在 jsfiddle 中运行代码并使用客户端 ID 通过我的项目发送请求，以及
如果设置的本地服务器可供网络上的任何人访问，如何修改上述步骤以允许任何客户端打开该服务器的网页以使用 google drive API？

我知道我很可能需要在开发人员控制台中设置公共 API 访问权限，但我不完全确定我应该使用哪些推荐人。那么有没有一种简单的方法可以做到这一点？

我也知道gspread 只能使用客户的用户名和密码打开 google excel 电子表格，所以我怀疑我正在寻找的东西是可能的，但我不确定。

【问题讨论】：

标签： javascript google-drive-api

【解决方案1】：

好的，所以我找到了一个效果很好的解决方案：

创建一个OAuth.io 帐户（免费）。
登录后，转到您的 oauth.io dashboard。
您应该查看默认应用程序，或者您可以创建另一个并不重要的应用程序。
在“域和 URL 白名单”下，您会看到一个显示“localhost”的小框。输入 ” http://fiddle.jshell.net/"（不带引号）并按回车键。这允许任何 jsfiddle 对您的应用程序进行身份验证
接下来，我们需要启用 Google Drive 支持
- 转到 Google Developers Console
- 和之前一样，导航到 APIs 和 Auth 下的 Credentials。
- 点击“创建新的客户 ID”
- 选择 Web 应用程序
- 在“重定向 URI”下放置“https://oauth.io/auth”和“http://oauth.io/auth”（不带引号，在单独的行中）
- 在“Javascript 起源”下放置“https://oauth.io”和“http://oauth.io”
- 按“创建客户端 ID”
现在转到您的Oauth.io key manager。单击左侧列表中的 Google Drive。按下一步，然后输入您在上一步中创建的 client_id 和 client_secret（通过 Google Developers Console）
1. 选择在线（至少在线是首选，因为离线应该只用于服务器端）
2. 点击范围教科书，然后选择“https://www.googleapis.com/auth/drive（查看和管理您的 google Drive 中的文件）。”
3. 按完。现在点击 Try Auth 按钮，希望你能得到类似的输出

{ “access_token”：“ya29.AwH-1N_gnstLBuZfOR4W9CCcggKrQpMyKYV4QVEtCiIzHozNU5AfUJoYQzukALfjdiw2iOCUve7JbQ”， "token_type": "承载者", “expires_in”：3600， “提供者”：“google_drive” }

要使用它，您可以执行以下操作：

// This only works because we're set to "No wrap - in <head>"
function ShowDriveFileList() {
    var accessToken;
    // Initialize OAuth with our key
    OAuth.initialize('lmGlb8BaftfF4Y5en_c8XYOSq2A');

   // Connect to google drive, and print out file list
    OAuth.popup('google_drive').done(function (result) {
    var xmlHttp = null;
        xmlHttp = new XMLHttpRequest();
        xmlHttp.open("GET", "https://www.googleapis.com/drive/v2/files", false);
        xmlHttp.setRequestHeader("Authorization", "Bearer " + result.access_token);
        xmlHttp.send(null);
        alert(xmlHttp.responseText);
    }).fail(function (err) {
        alert(err);
    });;
}

您可以在http://jsfiddle.net/JMTVz/41/ 找到。这使用了我的 oauth.io 客户端 ID，但您可以将其替换为您的，它应该也可以工作。

【讨论】：

【解决方案2】：

您可以使用 OAuth Playground 做同样的事情。

见How do I authorise an app (web or installed) without user intervention? (canonical ?)

第 11 步将有所不同。您无需将刷新令牌粘贴到您的服务器应用程序（您没有）中，而是将访问令牌粘贴到您的 JS 中，就像您在回答中所做的那样。

【讨论】：