reactjs - TypeError: performanceMeasurement.startMeasurement er ikke en funksjon

Feil oppstod rett og slett når jeg prøvde å trykke på logg inn fra @azure/msal-react i Next 13. Da jeg sjekket feilloggen, kommer den fra kjernelib @azure/msal-react. Jeg prøvde også med påloggings-popup, men feilen er fortsatt den samme.

Jeg har kode, i min auth.ts

export const msalConfig = {
    auth: {
        clientId : "afxxxxx-xxxxxx-xxxxxx",
        authority : "https://login.microsoftonline.com/common/",
        redirectUri : "/",
    }
};

export const loginRequest = {
    scope: ["User.Read"]
};


_app.ts
import { MsalProvider } from '@azure/msal-react'
import { PublicClientApplication, EventType, SilentRequest, AccountInfo } from '@azure/msal-browser'
import  { msalConfig } from '@/services/auth'
import type { AppProps } from 'next/app'
import { useRouter } from 'next/router'
import { CustomNavigationClient } from '@/utils/NavigationClient'

export const msalInstance = new PublicClientApplication(msalConfig);

const accounts = msalInstance.getAllAccounts();

if (accounts.length > 0) {
  msalInstance.setActiveAccount(accounts[0]);
};

msalInstance.addEventCallback((event) => {
  if (event.eventType === EventType.LOGIN_SUCCESS && (event.payload as SilentRequest).account) {
    const account  = (event.payload as SilentRequest).account;

    msalInstance.setActiveAccount(account as AccountInfo);
  }
});

export default function App({ Component, pageProps }: AppProps) {
  const router = useRouter();

  const navigationClient = new CustomNavigationClient(router);;

  msalInstance.setNavigationClient(navigationClient);  

  return (
    <MsalProvider instance={msalInstance}>
      <Component {...pageProps} />
    </MsalProvider>
  )
}

og på sidene mine viser jeg bare påloggings Index.ts

const initializeSignIn = () => {
    instance.loginRedirect();
  };

  return (
  <>
    <UnauthenticatedTemplate>
      <center>Please sign-in to see your profile information.</center>
      <button onClick={initializeSignIn}>Sign In</button>
    </UnauthenticatedTemplate>
  </>
  )

Gikk jeg glipp av noe i konfigurasjonen, eller er det bare en feil i kjernebiblioteket?

Svar #1

OPPDATERING: Som diskutert her i git issue-diskusjonen var problemet med @azure/[email  og det ble fikset i @azure/[email .

Du kan begynne å bruke

"@azure/msal-browser": "^2.32.2",
"@azure/msal-react": "^1.5.2"

På tidspunktet for dette problemet er de siste publiserte versjonene

"@azure/msal-browser": "2.32.2",
"@azure/msal-react": "1.5.2"

Jeg har brukt microsoft-authentication-library-for-js for å få @azure/msal-browser, @azure/msal-react til å kjøre prosjektet mitt ved å bruke kildekoden. Fungerte fint. Det ser ut til at problemet oppsto når koden ble publisert (bundling/minifisering/hvem vet osv.).

inntil den nye utgivelsen kommer ut, for å løse problemet, endre npm-pakkene til

"@azure/msal-browser": "2.32.1",
"@azure/msal-react": "1.5.1"

Svar #2

Jeg støtte på dette problemet også i dag. Dette har sannsynligvis noe å gjøre med at Microsoft ga ut en ny versjon. Jeg nedgraderte bare, og det fungerte igjen.

Relaterte artikler