有没有办法使用 ADAL.js 在角度 js 代码中将"domain_hint=exampledomain.com"添加到 https://login.microsoftonline.com url？

Question

我们正试图以本文中所示的类似方式，使用Azure AD对自定义应用程序中的用户进行身份验证。(https://github.com/AzureAD/azure-activedirectory-library-for-js)当用户转到该应用程序时，他们将被路由到https://login.microsoftonline.com，他们必须将其放在电子邮件地址中。然后，它们被路由到我们的联邦端点，即PingFederate。然而，我们希望我们的用户直接路由到PingFederate，而不必让他们访问login.microsoftonline.com(https://cloudblogs.microsoft.com/enterprisemobility/2015/02/11/using-azure-ad-to-land-users-on-their-custom-login-page-from-within-your-app/)表示将"&domain_hint=exampledomain.com"附加到login.microsoftonline url，以允许用户跳过在login.microssoftonline页面中输入电子邮件的步骤。我们已经通过手动将"&domain_hint=exampledomain.com"添加到login.microsoftonline.com url来测试了这一点，它是有效的。然而，我们希望有一种方法在代码中添加这个变量，这样就可以自动完成。我们尝试在angular js代码中向adalAuthenticationServiceProvider.init对象添加domain_hint变量和值，但没有成功。我们如何将"domain_hint=exampledomain.com"添加到login.microsoftonline url中，这样用户就不必访问microsoft登录页面，而是直接路由到PingFederate？

Answer 1

我已经使用adal-angular4库(adaljs的Angular 4包装器)为Angular 4实现了这一结果；app.component.ts文件中有以下配置。我非常确信它能适用于所有类似的版本。这里的关键是您需要添加域提示作为额外的查询参数，以配置将发送到请求的adal。

import { Component } from '@angular/core';
import { adal } from 'adal-angular';
import { Adal4Service } from 'adal-angular4';
const config: adal.Config = {                           
tenantId: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
clientId: 'abcdabcd-abcd-abcd-abcd-abcdabcdabcd',
domain: 'my-domain.net',
extraQueryParameter: 'domain_hint=my-domain.co.uk',
}                                                    
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'My Angular 4 App';
constructor(private service: Adal4Service) {    
this.service.init(config);                    
}                                              
}