1
私は角度2でoauth2をやっています。oAuth2を実行する方法角度2の基本認証？
ここにPOST URL = "http://localhost:8080/OAuth2Example/oauth/token?grant_type=password&username=bill&password=abc123"があります。
有効なユーザーとアクセストークンのいずれかを使用してフロントエンドでclientIdとクライアントのシークレットを渡す方法はありますか。
angle2やその他の設定で使用できるプラグインがあれば教えてください！
私はポストコールを実行
private getHeaders(){
// I included these headers because otherwise FireFox
// will request text/html
let headers = new Headers();
let auth_data = 'username=my-trusted-client&password=secret';
headers.append('Accept', 'application/json');
headers.append('Authorization', auth_data);
return headers;
}
testRequest() {
let data = 'grant_type=password&username=bill&password=abc123';
let postResponse = this.http
.post(`${this.baseUrl}/oauth/token?`, data, {headers:
this.getHeaders()})
.toPromise()
.then(this.mapResult);
return postResponse;
}、
のXMLHttpRequestが http://localhost:8080/OAuth2Example/oauth/token?/を読み込むことができない、のような
は、私が試してみました。 プリフライト要求への応答がアクセス制御チェックを通過しません。いいえ 要求された リソースに 'Access-Control-Allow-Origin'ヘッダーが存在します。したがって、「 http://localhost:4200」の原点は許可されません。 応答にHTTPステータスコード401がありました。
このエラーはコンソールで確認しました。
私は正確に何が必要なのかを素早く特定するために郵便受けのコレクションを持っていますが、私は以下のように郵便配達員からoauth2を達成しました。
これはまさに私があまりに角度2からそれを取得する必要があります。
おかげで、
実際に表示されるリテラルパスは 'http：// localhost：8080/SpringSecurityOAuth2Example/oauth/token？/'ですか？ 'token？/'部分が間違いのように見えるので。また、質問に表示されている 'http.get'リクエストコードにはまったくマッチしません。そのリクエストコードは、質問の冒頭に表示されている "POST URL"と一致しません。したがって、ここで何が起こっているのか把握することは難しいですが、そのリクエストを送信しているサーバーがそのパスのOPTIONSリクエストに応答する場合は、401を使用することはできませんブラウザにPOSTリクエストを試してもらうようにしてください – sideshowbarker
リクエストがAuthorizationヘッダーを追加するので、クリアするには、コードからPOSTを試みる前にCORSプリフライトOPTIONSリクエストをブラウザに自動的にトリガしてください。そしてエラーメッセージは、OPTIONS要求に対する応答が、プリフライトを成功と見なすためにブラウザが見る必要がある200 OKまたは204ではなく401であるため、プリフライトが失敗していることを示します。 – sideshowbarker
Auth0は、これと他のものを行うためのステップドキュメントでは本当に良いステップを持っています。サードパーティのプラグインを検索する前に必ず読む必要があります：https://auth0.com/blog/angular-2-authentication/、https：// auth0.com/docs/quickstart/spa/angular2/01-login、https://auth0.com/docs/quickstart/spa/angular2/01-login – xzegga