从angular2调用oauth2登录服务

时间:2018-02-21 11:29:13

标签: angular oauth-2.0

任何人都可以帮助我使用角度2或4来调用oauth2登录服务。

我能够成功地从休息客户端调用它们,但我怎么也没有线索

从角度js调用。

发布请求是:: http://localhost:8989/auth/oauth/token?username=guest&password=guest123&grant_type=password

我必须使用相同的请求设置基本身份验证客户端ID和密码。

提前致谢。

2 个答案:

答案 0 :(得分:1)

经过几个小时的努力,解决了我的问题解决方案,我只是为那些面临同样问题的人发布了答案。确保服务器端的CORS设置。

import {Injectable} from '@angular/core'
import {Http,Headers,RequestOptions } from '@angular/http'

@Injectable()
export class DashBoardService {

constructor(private http :Http){

}
public allCards(){
//?username=guest&password=guest123&grant_type=password
let username: string = 'service-account-1';
let password: string = 'service-account-1-secret';
let data ={"username":"guest","password":"guest123","grant_type":"password","client_id":"service-account-1"};
var headers = new Headers();
headers.append("Authorization", "Basic " + btoa(username + ":" + password));
headers.append("Content-Type", "application/x-www-form-urlencoded");

let options = new RequestOptions({ headers: headers });


return this.http.post("http://localhost:8989/oauth/token?username=guest&password=guest123&grant_type=password",
"",options);

}



}

答案 1 :(得分:0)

我假设您正在编写一个调用API的单页应用程序 - 是吗?

有关单页应用程序登录的详细信息

我一直在编写一个基于教程的博客,您可能会发现它很有用。博客非常详细,但首先要了解的是移动部分:

  • Angular App 使用OAuth 2.0隐式流程记录用户
  • 授权服务器将SPA的安全性外部化
  • 您的SPA在登录后调用 OAuth 2.0安全API 并访问令牌

了解上述分离后,接下来需要了解OAuth消息。也许首先浏览此页面:

SPA Overview

如果您觉得它很有用,请按照有关如何运行我的示例的页面,OAuth消息的详细信息等进行操作。