angular-oauth2 —— NG 的 OAuth2 认证模块

简介:

angular-oauth2 详细介绍
angular-oauth2 是 AngularJS 的 OAuth2 认证模块,使用 ES6 编写。

使用方法:

  1. 引入 js 库:
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-cookie/dist/angular-cookie.min.js"></script>
<script src="bower_components/query-string/query-string.min.js"></script>
<script src="bower_components/angular-oauth2/dist/angular-oauth2.min.js"></script>

2 . 配置 OAuth 和 OAuthToken

angular.module('myApp', ['angular-oauth2'])
  .config(['OAuthProvider', function(OAuthProvider) {
    OAuthProvider.configure({
      baseUrl: 'https://api.website.com',
      clientId: 'CLIENT_ID',
      clientSecret: 'CLIENT_SECRET',
    });
  }]);

3 . 错误处理:

angular.module('myApp', ['angular-oauth2'])
  .run(['$rootScope', '$window', function($rootScope, $window) {
    $rootScope.$on('oauth:error', function(event, rejection) {
      // Ignore `invalid_grant` error - should be catched on `LoginController`.
      if ('invalid_grant' === rejection.data.error) {
        return;
      }

      // Redirect to `/login` with the `error_reason`.
      return $window.location.href = '/login?error_reason=' + rejection.data.error;
    });
  }]);

文章转载自 开源中国社区 [http://www.oschina.net]

相关文章
|
6月前
|
JSON 前端开发 安全
使用 Angular proxy 解决前端跨域问题
使用 Angular proxy 解决前端跨域问题
118 0
|
13天前
|
安全 API 开发者
Angular angular-oauth2-oidc 库的使用概述
Angular angular-oauth2-oidc 库的使用概述
8 0
|
13天前
Angular angular-oauth2-oidc 实战
Angular angular-oauth2-oidc 实战
8 0
|
5月前
Angular 依赖注入系统里 Injection token PLATFORM_ID 的使用场景
Angular 依赖注入系统里 Injection token PLATFORM_ID 的使用场景
22 0
|
5月前
|
移动开发 网络架构 HTML5
Angular 依赖注入系统里 Injection token APP_BASE_HREF 的使用场景
Angular 依赖注入系统里 Injection token APP_BASE_HREF 的使用场景
35 0
|
6月前
|
设计模式 前端开发 JavaScript
Angular 应用开发中 Injection Token 的使用方法介绍
Angular 应用开发中 Injection Token 的使用方法介绍
44 0
|
6月前
|
存储 前端开发 API
Angular APP_INITIALIZER Injection Token 的使用方法介绍
Angular APP_INITIALIZER Injection Token 的使用方法介绍
22 0
|
6月前
关于 Angular 应用开发里 Subject 和 BehaviorSubject 的用法一例
关于 Angular 应用开发里 Subject 和 BehaviorSubject 的用法一例
42 0
|
前端开发 API
Angular 中使用 Api 代理
本文使用 angualr 来讲解代理 api 对接的话题。
Angular 中使用 Api 代理
|
前端开发 数据安全/隐私保护 数据格式
Angular 项目实现权限控制
上一篇文章我们讲到了 Angular 组件通信。本文我们讲讲,在项目开发中,你是否会遇到这样的需求
Angular 项目实现权限控制