平均値を使用したGoogle Oauthの実装

Question

単純なアプリケーションのアーキテクチャーには疑問があります。

マイ残りベースのAPIサーバは、私がhttp://localhost:3000/auth/googleを使用してテストしたパスポートのGoogleの認証を実装することに成功した私の残りのノードAPIサーバーを開発している間http://localhost:3000 で私のクライアントはhttp://localhost:4200

での角度2で書かれているノードでありますそして 私はGoogleログインページにリダイレクトされ、さらにログインした後、私の休憩ノードapiによって提供される私/プロフィールにリダイレクトされます

私は同じことをしようとしていますが、 Googleの認証を呼び出すノードのAPIサーバー。私の最初のリクエストは http://localhost:4200からhttp：// http://localhost:3000/auth/googleにhttp.getします。私が認証するためには、Googleの認証ページが表示されることを望んしかし、私は私が認定JavaScriptの起源 http://localhost:3000 http://localhost:4200 下とにおけるGoogleの認証ページでのポートの両方を持つURLのが含まれている以下のエラー

XMLHttpRequest cannot load https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_ur …=1000090953925-p7jof0qa284ihknb5sor3i4iatnqarvo.apps.googleusercontent.com. Redirect from ' https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_ur …=1000090953925-p7jof0qa284ihknb5sor3i4iatnqarvo.apps.googleusercontent.com' to ' https://accounts.google.com/ServiceLogin?passive=1209600&continue=https://a …sercontent.com%26from_login%3D1%26as%3D60339aeceb428c&oauth=1&sarp=1&scc=1' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

を取得iは

app.getノードAPIサーバーのコード下http://localhost:3000/auth/google/callback

が含まれている許可リダイレクトURIを （ '/ AUT google '、passport.authenticate（' google '、{scope：[' profile '、' email ']}）））; app.get（ '/ AUTH /グーグル/コールバック'、 passport.authenticate（「Googleの、{ successRedirect： '/プロファイル' failureRedirect： '/ユーザー }）、 ）。

すべてのヘルプは

Answer 1

2つのことを感謝：バックエンドとフロントエンドが異なるポート上にあるので、あなたは、あなたのバックエンドがあなたの回答にCORS header 'Access-Control-Allow-Origin'が含まれている必要があります。このような何かあなたが急行使用している場合：// localhostをしていないファイル：// localhostをちょうどブラウザのアドレスは常にHTTPであることを確認して、また

res.header('Access-Control-Allow-Origin', '*'); 

を

Answer 2

あなたがしなければならない$window.location.href="URL"

はそれが

を役に立てば幸い送る です