MSAL Angular v4 から v5 へのアップグレード

MSAL Angular v5 には Angular 19 の最小バージョンが必要であり、Angular 15、16、17、18 のサポートが削除されます。

基になる ライブラリでのブラウザーのサポートとその他の重要な変更については、@azure/msal-browserを参照してください。

@azure/msal-angular@5 での破壊的変更

protectedResourceMap の厳密な照合

msal-angular v5 では、 protectedResourceMap エントリの URL パターン マッチングでは、既定で厳密な照合セマンティクスが使用されます。 厳密一致では、パターンのメタ文字はリテラルとして扱われ、一致対象は URL コンポーネント全体に限定され、ドット区切りをまたがないホストのワイルドカード ルールが適用されます。 v4 構成が緩やかな一致動作に依存している場合は、厳密な一致に合わせて protectedResourceMap パターンを更新するか、レガシ動作を一時的に保持するように strictMatching を false に設定します。 詳細については、 MSAL Interceptor のドキュメント を参照してください。

Warning

この変更は、v5 のマイナー アップグレードにも影響する可能性があります。 当初採用した v5 のマイナーバージョン（例: 5.0.x）では strict matching がまだデフォルトでなかった場合、strict matching がデフォルトになっている後続の v5 のマイナーバージョン（例: 5.1.x）にアップグレードすると、気付かないうちにトークンのアタッチが機能しなくなる可能性があります。 主な症状はまったく同じです: 401 エラー — strictMatching が明示的に設定されていない場合に実行時警告が出力されるようになりましたが、一致失敗自体は依然として通知されず、Authorization ヘッダーも付与されなくなりました。

クイック チェックリスト

  1. protectedResourceMap キーを確認します。 ワイルドカードやサブパスのないベア ベース URL ( https://api.example.com など) のキーは、要求をその URL のサブパスと照合しなくなります。 一般的な障害パターンを参照してください。
  2. 正確なパスまたはワイルドカードを使用するようにキーを更新します。 各キーは、アプリケーションが要求した正確な URL と一致するか、 /* ワイルドカード サフィックスを使用してサブパスに一致させる必要があります。 修正オプションを参照してください。
  3. キーが実行時に動的に読み込まれる場合は、 strictMatching: false を一時的な安全な既定値として設定します。 環境駆動型構成のガイダンスを参照してください。

環境駆動型 protectedResourceMap

protectedResourceMap キーが Angular environment ファイル、APP_INITIALIZER、JSON 構成、またはplatformBrowserDynamicから取得される場合は、移行中にstrictMatching: falseを安全な既定値として設定します。

export function MSALInterceptorConfigFactory(): MsalInterceptorConfiguration {
  const protectedResourceMap = new Map<string, Array<string>>();
  protectedResourceMap.set(environment.apiConfig.uri, environment.apiConfig.scopes);

  return {
    interactionType: InteractionType.Redirect,
    protectedResourceMap,
    // TODO: Remove once protectedResourceMap keys are updated to use
    // exact paths or wildcard patterns (e.g. "https://api.example.com/*").
    strictMatching: false,
  };
}

すべてのキーを正確なパスまたはワイルドカードに移行したら、 strictMatching: false を削除 (または trueに設定) して、より厳密で安全な照合動作の恩恵を受けます。 詳細については 、環境駆動型構成のガイダンス を参照してください。

logout() の削除

logout() は削除されました。 代わりに、logoutRedirect() タグまたは logoutPopup() タグを使用してください。

// BEFORE (v4)
this.authService.logout();

// AFTER (v5)
this.authService.logoutRedirect();
// or
this.authService.logoutPopup();

@azure/msal-angular@5 のその他の変更点

inject(TOKEN) の構文

MSAL_INSTANCE、MSAL_GUARD_CONFIG、MSAL_INTERCEPTOR_CONFIG、および MSAL_BROADCAST_CONFIG は、inject(TOKEN) 構文をサポートするために、文字列ではなく型として解決されるようになりました。 この変更により、明示的な入力なしでアプリケーションで TypeScript エラーが発生する可能性があります。

handleRedirectObservable() のオプション

handleRedirectObservable()では、オプションのHandleRedirectPromiseOptions オブジェクトが受け入れられました。これには、navigateToLoginRequestUrlの構成から移動された@azure/msal-browser@5 オプションが含まれます。 詳細については、 リダイレクトのドキュメント を参照してください。

// BEFORE (msal-browser v4 configuration)
const msalConfig = {
  auth: {
    clientId: 'your-client-id',
    navigateToLoginRequestUrl: false // This option has moved
  }
};

// AFTER (msal-angular v5)
this.authService.handleRedirectObservable({
  navigateToLoginRequestUrl: false
}).subscribe();

Note

ハッシュ文字列を handleRedirectObservable(hash) に直接渡すことは非推奨です。 代わりに options オブジェクトを使用します: handleRedirectObservable({ hash: "#..." })。

Samples

次の開発者サンプルが利用可能になりました。

現在の MSAL Angular サンプルと示されている機能の一覧については、 こちらを 参照してください。

  • Last updated on