我通过使用Cordova的InAppBrowser插件（@awesome-cordova-plugins/in-app-browser）和msal的NavigationClient的自定义实现（@azure/msal-browser）解决了这个问题。
实现如下所示：

import { InAppBrowser } from "@awesome-cordova-plugins/in-app-browser";
import type { IPublicClientApplication } from "@azure/msal-browser";
import { NavigationClient } from "@azure/msal-browser";
import { Capacitor } from "@capacitor/core";

export class NavigationAuthenticationClient extends NavigationClient {
  constructor(private msalInstance: IPublicClientApplication) {
    super();
  }

  async navigateExternal(url: string, options: any): Promise<boolean> {
    if (Capacitor.isNativePlatform()) {
      const browser = InAppBrowser.create(url, "_blank", {
        location: "yes",
        hidenavigationbuttons: "yes",
        clearcache: "yes",
        clearsessioncache: "yes",
        hideurlbar: "yes",
        fullscreen: "yes",
      });
      browser.on("loadstart").subscribe((event: any) => {
        if (event.url.includes("#code")) {
          browser.close();
          const domain = event.url.split("#")[0];
          const url = event.url.replace(domain, "http://localhost/home");

          this.msalInstance
            .handleRedirectPromise(url)
            .then((res) => {
              console.log(res?.account?.name + " has authenticated");
            })
            .catch((err) => {
              console.log(err);
            });
        }
      });
    } else {
      if (options.noHistory) {
        window.location.replace(url);
      } else {
        window.location.assign(url);
      }
    }
    return true;
  }
}

我扩展了LoginButton的代码，首先在msal示例中设置了新的自定义NavigationClient：

import { useMsal } from "@azure/msal-react";
import { IonFabButton, IonIcon } from "@ionic/react";
import { personOutline } from "ionicons/icons";
import { useEffect } from "react";
import { NavigationAuthenticationClient } from "../NavigationAuthenticationClient";

const LoginButton: React.FC = (): JSX.Element => {
  const { instance } = useMsal();

  useEffect(() => {
    instance.setNavigationClient(new NavigationAuthenticationClient(instance));
  }, []);

  const handleSignIn = async () => {
    await instance.loginRedirect({
      scopes: ["..."],
    });
  };

  return (
    <IonFabButton onClick={handleSignIn} id="navigation_button">
      <IonIcon size="small" icon={personOutline}></IonIcon>
    </IonFabButton>
  );
};

export default LoginButton;