- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
我在 Angular 6 SPA 上使用 msal.js 来处理身份验证,我遇到了一些问题:首先,我找不到关于如何使用 lib 处理错误的明确示例,所以我左右选择了一些东西,然后得出了下一个结果:
@Injectable()
export class AuthenticationService {
_clientApplication: Msal.UserAgentApplication;
_clientApplicationPR: Msal.UserAgentApplication;
private _authority: string;
constructor(private apiService: ApiService, private backendRoutes: BackendRoutes) {
this._authority = `https://login.microsoftonline.com/tfp/${environment.tenant}/${environment.signUpSignInPolicy}`;
this._clientApplication =
new Msal.UserAgentApplication(
environment.clientID,
this._authority,
this._authCallback,
{
cacheLocation: 'localStorage',
redirectUri: window.location.origin
});
}
private _authCallback(errorDesc: any, token: any, error: any, tokenType:
any) {
console.log("in call back");
if (token) {
this.addUser();
} else {
// console.log(`${error} - ${errorDesc}`);
if (errorDesc.indexOf("AADB2C90118") > -1) {
//Forgotten password
this._clientApplicationPR = new Msal.UserAgentApplication(
environment.clientID,
`https://login.microsoftonline.com/tfp/${environment.tenant}/${environment.passResetPolicy}`,
this._authCallback,
{
cacheLocation: 'localStorage',
redirectUri: window.location.origin
});
this._clientApplicationPR.loginRedirect(environment.b2cScopes);
} else if (errorDesc.indexOf("AADB2C90077") > -1) {
//Expired Token
this._clientApplication.acquireTokenRedirect(environment.b2cScopes);
}
}
}
getAuthenticationToken(): Promise<string> {
return
this._clientApplication.acquireTokenSilent(environment.b2cScopes)
.then(token => token)
.catch(error => {
return Promise.reject(error);
});
}
}
我的 httpinterceptor 中使用了 getAuthenticationToken 函数来设置不记名 token 。这工作正常,除非我的 token 过期并发出下一个错误:
main.c20e047e67b91051727f.js:1 AADB2C90077: User does not have an existing session and request prompt parameter has a value of 'None'. Correlation ID: 3a627592-5ab0-4e54-b01d-e4296e4d4002 Timestamp: 2018-11-27 08:30:32Z |interaction_required
在我尝试处理这种情况时,您可以看到回调检查错误代码内容。问题是,我的回调在 acquireTokenSilent 失败后永远不会被调用......我想知道为什么以及我是否做错了什么?对于 acquireTokenSilent,我猜您可以将错误处理为 promise 拒绝。虽然不理想。
其次,回调中的上下文与我的服务不同,我无权访问“this”,据我所知,它已被库覆盖。我对“AADB2C90118 忘记密码错误”的临时破解是用适当的权限肮脏地创建一个新的 userAgentAplication,有没有办法在回调中访问我的服务上下文并避免这样做?
编辑 我设法让事情顺利进行:“this”在回调中引用了 userAgentApplication 本身,因此您可以这样做,而不是创建一个新的回调:
constructor(private apiService: ApiService, private backendRoutes: BackendRoutes) {
this._authority = `https://login.microsoftonline.com/tfp/${environment.tenant}/${environment.signUpSignInPolicy}`;
this._clientApplication =
new Msal.UserAgentApplication(
environment.clientID,
this._authority,
this.msalHandler,
{
cacheLocation: 'localStorage',
redirectUri: window.location.origin
});
}
msalHandler(errorDesc: any, token: any, error: any, tokenType: any) {
let userAgent: Msal.UserAgentApplication = <any>(this);
if (errorDesc.indexOf("AADB2C90118") > -1) {
//Forgotten password
userAgent.authority = `https://login.microsoftonline.com/tfp/${environment.tenant}/${environment.passResetPolicy}`;
userAgent.loginRedirect(environment.b2cScopes);
} else if (errorDesc.indexOf("AADB2C90077") > -1) {
//Expired Token
this.logout();
}
}
或将此绑定(bind)到您的回调:
this._clientApplication =
new Msal.UserAgentApplication(
environment.clientID,
this._authority,
this.msalHandler.bind(this),
{
cacheLocation: 'localStorage',
redirectUri: window.location.origin
});
和我的拦截器:
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return from(this.authenticationService.getAuthenticationToken()
.then(token => {
return req.clone({
setHeaders: {
Authorization: `Bearer ${token}`
}
});
})
.catch(err => {
this.authenticationService.msalHandler(err,null,null,null);
return req;
}))
.switchMap(req => {
return next.handle(req);
});
}
关于信息,我使用最新的“msal”:“^0.2.3”,“typescript”:“~2.7.2”,“@angular/core”:“^6.0.3”。
最佳答案
我的最终版本。工作正常。
import {of, Observable, empty, throwError } from 'rxjs';
import { Injectable } from '@angular/core';
import { environment } from '../../environments/environment';
import * as Msal from 'msal';
import { User } from "msal/lib-commonjs/User";
import { ApiService } from './api.service';
import { BackendRoutes } from './backend.routes';
@Injectable()
export class AuthenticationService {
private _clientApplication: Msal.UserAgentApplication;
private _authority: string;
private _authorityPasseReset: string;
private _authorityEditProfile: string;
private _authoritySignIn: string;
private _authoritySignUp: string;
constructor(private apiService: ApiService, private backendRoutes: BackendRoutes) {
// this._authority = `https://login.microsoftonline.com/tfp/${environment.tenant}/${environment.signInPolicy}`;
this._authority = `https://${environment.tenant}.b2clogin.com/${environment.tenant}.onmicrosoft.com/`;
this._authorityPasseReset = this._authority + `${environment.passResetPolicy}`;
this._authorityEditProfile = this._authority + `${environment.editProfilePolicy}`;
this._authoritySignIn = this._authority + `${environment.signInPolicy}`;
this._authoritySignUp = this._authority + `${environment.signUpPolicy}`;
this._clientApplication =
new Msal.UserAgentApplication(
environment.clientID,
this._authoritySignIn,
this.msalHandler,
{
cacheLocation: 'localStorage',
redirectUri: window.location.origin + '/acceuil',
validateAuthority: false
});
}
init() {
this.refreshToken()
.then(token => console.debug('token refreshed'))
.catch(err => this.msalHandler(err, null, null, null));
}
msalHandler(errorDesc: any, token: any, error: any, tokenType: any) {
let userAgent: Msal.UserAgentApplication = <any>(this);
if (errorDesc.indexOf("AADB2C90118") > -1) {
//Forgotten password
userAgent.authority = this._authorityPasseReset;
userAgent.loginRedirect(environment.b2cScopes);
} else if (errorDesc.indexOf("AADB2C90077") > -1) {
//Expired Token, function call from interceptor with proper context
this.logout();
}
}
login(): void {
this._clientApplication.loginRedirect(environment.b2cScopes);
}
register(): void {
this._clientApplication.authority = this._authoritySignUp;
this._clientApplication.loginRedirect(environment.b2cScopes);
}
logout(): void {
this._clientApplication.logout();
}
editProfile(): void {
this._clientApplication.authority = this._authorityEditProfile;
this._clientApplication.loginRedirect(environment.b2cScopes);
}
refreshToken(): Promise<string> {
return this._clientApplication.acquireTokenSilent(environment.b2cScopes, this._authoritySignIn, this.getUser())
}
getAuthenticationToken(): Promise<string> {
return this._clientApplication.acquireTokenSilent(environment.b2cScopes)
.then(token => token)
.catch(error => {
return Promise.reject(error);
});
}
关于angular - msal.js angular 6 SPA 回调和错误处理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53495732/
我正在看的是在另一个 React 微前端中有一个有角度的微前端,这是我们可以通过 single-spa 实现的吗 最佳答案 是的,这可以通过两种方式完成。这取决于您的应用程序使用的框架。 选项 1:跨
总结:如何在不使用繁重的 JS 框架的情况下处理 PWA 中的导航、历史记录和深度链接? 在领导团队将现有的购物网站从 Angular 1 SPA 转换为多页面应用程序 (MPA) PWA 时,我遇到
我正在尝试使用 Angular.js 和 Express.js 创建 Node.js 应用程序。 我正在做的是使用此代码将客户名称和地址添加到列表(随机)。 var mylist = new gene
关闭。这个问题是opinion-based 。目前不接受答案。 想要改进这个问题吗?更新问题,以便 editing this post 可以用事实和引文来回答它。 . 已关闭 8 年前。 Improv
所以我在 Laravel 5.3 和 Vue 2 中开发一个网站/网络应用程序。SEO 很重要,所以我想在 Laravel + Blade 中保留网站的前端/可抓取部分,并且只保留一些不必要的小部分在
我设置了一个单页应用程序,它使用 Controller (用 PHP 编写)从 API 获取数据。到目前为止,我没有遇到任何问题,数据填充表,在选择表元素时它会使用新的 url 和部分数据(主要是 I
因此,我一直在尝试找出有关如何在 SPA 应用中处理授权(而不是身份验证)的最佳实践。 假设我有一个带有 api 后端的客户端 MVC(Angular、vuejs 等),我们如何管理应用程序的使用授权
SPA 的缺点当然是初始加载时间。 例如,我用 Durandal 创建了 AskACarPro.com。 它目前在加载时有一个“加载”屏幕。但我在想也许这是一个坏主意。它让我想起了一个全闪存网站——漂
我最近一直在阅读有关 SPA 以及它有多好的内容。 我想知道是否有人可以告诉我什么时候应该使用,或者什么时候不应该像常规 MVC 一样使用 SPA 最佳答案 MVC(Rails、MVC4)的工具更加成
基本设置:由Apache 2.4提供的Angular 1.5 SPA由REST api支持,Apache 2.4也提供了REST API。 我已经阅读了在服务器上更改了一些应用程序代码后可以使SPA更
在典型的单页应用程序(SPA,例如:React)中,整个代码包都提供给客户端。这包括应用程序的私有(private)组件,这些组件通常受到客户端授权机制的保护(例如,检查身份验证 token 是否已设
我想单独托管我的 应用程序和 网站 .层次结构如下: example.com - 网站托管在 DigitalOcean example.com/* - SPA 托管在 Firebase Hosting
我正在寻找可重复使用的解决方案,以解决用户执行的某些操作在完成之前可能需要用户进一步确认的问题。 我正在使用 React 前端和 WebAPI 后端开发应用程序。 假设用户正在发起资金转账,并假设我们
我有一个像这样的网站 http://domain/?key=32dxzQW 其中 key 是从每个用户的其他站点自动生成的 我需要知道的是访问量最大的部分,所以我正在考虑使用 GA,并且由于我的网页是
我真的很喜欢GunDb的概念,并且了解如何单独在客户端编写。 现在我使用来自 Github 的 Create-React-App。 有人知道 GunDb 的服务器端吗? 和一个 View [React
假设 ABC 公司有两个团队开发两个 SPA 应用程序:app1、app2 每个应用程序都有自己的 index.html 和关联的静态资源,例如: build / 索引.html 主.js 这是从:h
我一直在使用 AngularJS 开发 SPA,并将用户数据存储在 Angular Value 服务中,但我对此感到不舒服,主要是因为 Angular Value 不在浏览器选项卡之间共享。因此,如果
假设 ABC 公司有两个团队开发两个 SPA 应用程序:app1、app2 每个应用程序都有自己的 index.html 和关联的静态资源,例如: build / 索引.html 主.js 这是从:h
因此,我使用 Gorilla/Mux 在 Go 中设置了我的 SPA,但我想在不同的路由上运行它,这样我就可以将我的两个 Kubernetes 服务连接在一起(2 个不同的 SPA)。 难道我必须将我
我正在创建一个单页应用程序。我试图在 sql 中选择一个表并在字段中搜索特定日期 Date_Due,然后确保另一个字段 Date_Complete 为空。我试图弄清楚如何让隐藏字段填充查询中的 cfp
我是一名优秀的程序员,十分优秀!