azure - @azure/msal-browser TypeError : this. startPerformanceMeasurement 不是函数

Question

简介

因为 nuxt 3 的 Auth 库中还没有构建，所以我正在尝试创建自己的可组合项，名为 useAuth。

问题

当我尝试调用 loginRedirect 或 loginPopup 方法时，出现 startPerformanceMeasurement 错误。

Uncaught (in promise) TypeError: this.startPerformanceMeasurement is not a function
    at PerformanceClient2.startMeasurement (PerformanceClient.ts:100:45)
    at BrowserPerformanceClient2.startMeasurement (BrowserPerformanceClient.ts:46:55)
    at RedirectClient2.<anonymous> (StandardInteractionClient.ts:204:64)
    at step (_tslib.js:87:23)
    at Object.next (_tslib.js:68:53)
    at _tslib.js:61:71
    at new Promise (<anonymous>)
    at __awaiter (_tslib.js:57:12)
    at StandardInteractionClient2.getDiscoveredAuthority (StandardInteractionClient.ts:202:115)
    at RedirectClient2.<anonymous> (StandardInteractionClient.ts:142:48)

代码

composables/useAuth.js

import * as msal from '@azure/msal-browser'

let state = {
    authService: null,  
}

export const useAuth = () => {
    // use public configuration from nuxt 
    var config = useAppConfig();
    //create authentication instance
    state.authService = new msal.PublicClientApplication(config.msalConfig);

    //return signIn method
    return {
        signIn
    }
}

const signIn = async () => {
    const tokenRequest = {
        scopes: [
            'openid', 
            'offline_access', 
            'Users.Read'
        ],
    }
    const response = await state.authService
        .loginRedirect(tokenRequest)
        .then(() => {

        })
        .catch(err => {
            console.log(err) //TypeError: this.startPerformanceMeasurement is not a function
        });
}

Index.vue

<script setup>
if(process.client) {
    const auth = useAuth()
    auth.signIn()   
}
</script>

Answer 1

显然这是 MSAL 库中的一个错误。

如 this issue on Github 中所述，他们目前正在修复。

作为临时解决方案，您可以降级到以前的版本。降级可能很简单，只需在引用 package.json 中的版本时删除脱字符号 (^) 即可。

编辑:他们已作为 msal-common v9.1.1 的一部分发布了修复程序。