MSAL Angular v3 では、Angular ラッパーが最新バージョンの MSAL Browser に対応し、さらに Angular 15、16、17、18 および rxjs 7 を標準でサポートします。
このガイドでは、既存のアプリケーションを @azure/msal-angular v2 から v3 に移行するために必要な変更について説明します。
@azure/msal-angular v1 から移行する場合は、まず v1-v2 移行ガイドを参照して MSAL v2 に移行してください。
ブラウザーのサポートやその他の重要な変更については、 MSAL Browser Migration Doc も参照してください。
の破壊的変更 @azure/msal-angular@3
初期化
リダイレクトを使用するアプリケーション
MSAL v3.x では、アプリケーション オブジェクトの初期化が必要になりました。 初期化は MsalRedirectComponent および handleRedirectObservable API に組み込まれており、リダイレクト戦略を実装したアプリケーションは変更を加える必要はありません。 アプリケーションでスタンドアロン コンポーネントを使用している場合は、追加の変更が必要になる場合があります。
アプリケーションでの リダイレクトの 処理の詳細については、リダイレクトのガイドを参照してください。
ポップアップを使用するアプリケーション
初期化は MsalRedirectComponent と handleRedirectObservableに組み込まれているため、ポップアップのみを使用するアプリケーションでは、 MsalRedirectComponent をブートストラップするか、 handleRedirectObservable を手動で呼び出してアプリケーション オブジェクトを初期化する必要もあります。
設定の詳細については 、リダイレクトのガイド を参照してください。
allowNativeBroker フラグ
構成では、 allowNativeBroker フラグが既定でオンになりました。 B2C 機関を使用している場合は、次のように無効にすることができます。
export function MSALInstanceFactory(): IPublicClientApplication {
return new PublicClientApplication({
auth: {
...
},
cache: {
...
},
system: {
allowNativeBroker: false, // Disables native brokering support
}
});
}
Angular 15、16、17、18、rxjs@7
MSAL Angular は、次の機能を使用してアプリケーションがビルドされることを想定するようになりました。
-
@angular/core@15または@angular/core@16、あるいは@angular/core@17または@angular/core@18 -
@angular/common@15または@angular/common@16、あるいは@angular/common@17または@angular/common@18 rxjs@7
この変更により、MSAL Angular v3 は以前のバージョンの Angular および RxJS と下位互換性がないため、アプリケーションの更新が必要になる場合があります。 Angular Update Guide に従って、アプリケーションを Angular 15、16、17、または 18 に更新してください。
MSAL Angular v2 と同様に、 rxjs-compat は必要ありません。
Samples
次の開発者サンプルが利用可能になりました。
- Angular 15 サンプル
- Angular 16 サンプル
- B2C を使用した Angular 16 サンプル
- Angular スタンドアロン コンポーネントを使用した Angular 16 サンプル
- Angular 17 スタンドアロン サンプル
- Angular 18 スタンドアロン サンプル
サンプルは基本的な構成と使用方法を示しており、改善され、増分的に追加される場合があります。
MSAL Angular v3 サンプルの一覧と、示されている機能については、 こちらを 参照してください。