Googleドライブピッカーのサンプルコードで何が間違っていますか？

Question

this pageには、Googleドライブピッカーを平易なJavaScriptウェブページに含める方法の例があります。サンプルコードをコピーして自分のマシン上のファイルに貼り付け、サンプルの文字列を独自のAPIキー、クライアントID、およびアプリケーションIDに置き換える手順に従っています。

python -m SimpleHTTPServer 8000を使用してlocalhostからページを提供し、そのページにアクセスすると、2つの方法で失敗します。まず、表示されるドライブのダイアログに「エラーがありました！API開発者キーが無効です」というメッセージが表示されます。次に、コンソールで、私は以下のエラーが表示されます。ウェブを検索すると、おそらく私はHTTPS以外の接続を使用しているため、Google APIがドライブへの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を使用してローカルホストからページを提供し、ページを訪問した場合、それは別の方法で失敗した（彼らのエラーが言っているように見えるものを。に反して）。ドライブのダイアログが表示され、以下のように表示されます。

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. 

これはドライブのAPIは、ローカルホストから聞きたくないことを示唆していると思われるが、私はhttps://localhost:8000/*とhttp://localhost:8000/*からの要求を受け入れるように設定します（私のGoogleデベロッパーダッシュボードで）アプリの資格情報を持っています。

私は間違っていますか？

Answer 1

「origin」アドレスとしてlocalhostを使用することはできません。これはGoogle APIの制限です。この問題に対処するには、thisの質問に示唆されているオプションのいずれかを試してみるとよいでしょう。URL短縮名を使用するか、ホストファイルを構成してカスタムURLを127.0.0.1に解決してください。