我对 Google Drive Picker 示例代码做错了什么？答案

【问题标题】：What am I doing wrong with the Google Drive Picker example code?我对 Google Drive Picker 示例代码做错了什么？
【发布时间】：2017-03-28 13:58:56
【问题描述】：

this page 上有一个示例，说明如何在纯 JavaScript 网页中包含 Google Drive Picker。我已将示例代码复制并粘贴到我机器上的文件中，并按照说明将示例字符串替换为我自己的 API 密钥、客户端 ID 和应用 ID。

如果我使用 python -m SimpleHTTPServer 8000 从 localhost 提供页面并访问该页面，它会以两种方式失败。首先，弹出的 Drive 对话框显示“出现错误！API 开发人员密钥无效”。其次，在控制台上，我看到以下错误。搜索网络告诉我，这可能是因为我使用的是非 HTTPS 连接，Google API 尝试通过该连接与 Drive 建立 HTTPS 连接。（与他们的错误似乎所说的相反。）

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://docs.google.com') does not match the recipient window's origin ('http://localhost:8000').
(anonymous) @ cb=gapi.loaded_0:46

Uncaught ReferenceError: init is not defined
    at onload (https://docs.google.com/picker?protocol=gadgets&origin=http%3A%2F%2Flocalho…22%7D))&rpctoken=6pstmf1ss7m2&rpcService=v8gvn97850jj&thirdParty=true:3:54)

如果我使用 this handy python script for an SSL web server 从 localhost 提供页面，并访问该页面，它会以不同的方式失败。弹出的 Drive 对话框显示以下内容。

400. That’s an error.

Error: origin_mismatch
Request Details
        proxy=oauth2relay379676703
        immediate=false
        scope=https://www.googleapis.com/auth/drive
        origin=https://localhost:8000
        response_type=token
        redirect_uri=postmessage
        state=912029351|0.3907265328
        client_id=[REDACTED]
        include_granted_scopes=true
        jsh=m;/_/scs/apps-static/_/js/k=oz.gapi.en.eBn7I_cE2GI.O/m=__features__/am=AQ/rt=j/d=1/rs=AGLTcCNXKKlDNVVUdz0bvaxNh7fYe-hpSQ
        gsiwebsdk=1
That’s all we know.

虽然这似乎表明 Drive API 不想收到来自 localhost 的消息，但我已将应用程序的凭据（在我的 Google Developer Dashboard 中）设置为接受来自 https://localhost:8000/* 和 http://localhost:8000/* 的请求。

我做错了什么？

【问题讨论】：

标签： javascript python google-drive-api localhost

【解决方案1】：

您不能使用 localhost 作为“来源”地址 - 这是 Google API 的限制。要解决此问题，您可能需要选择this 问题中建议的选项之一 - 使用 URL 缩短器或配置您的主机文件以将自定义 URL 解析为 127.0.0.1。

【讨论】：

我不能使用 URL 缩短方法，因为我的 URL 包含 goo.gl 不支持的端口。我按照您链接到的问题中的建议编辑了我的 /etc/hosts 文件，并且该假 URL 现在应该从 localhost 加载，但行为与我仅使用 localhost 时发生的情况相同。换句话说，我原来的问题中的所有错误仍然存在；从 URL 中删除“localhost”并没有改善。
@Nathan 能否提供您在编辑 hosts 文件后看到的错误？
当我尝试通过 URL mydevserver.example.com 访问 localhost 时发生了我原始帖子中的两个错误中的第二个，该 URL /etc/hosts 重新路由到 localhost。我已尝试使用 http 和 https，在您上次发表评论后不久将 mydevserver.example.com 添加到我的 Google API 凭据中，然后等待 30 分钟以确保它已生效。
@Nathan 如果错误消息完全相同并显示 origin=localhost:8000，那么您可能不是通过自定义 url 加载 api，而是通过 localhost .
我很抱歉；我应该更具体。关于该错误的一些事情发生了变化，但除了原点（现在读取 origin=mydevserver.example.com）之外，所有的都是肤浅的（例如状态）。