msal typescript error Свойство accessToken не существует для типа void | TokenResponse '

Question

Приведенный ниже код генерирует следующую ошибку TypeScript для response.accessToken:

TS2339: Свойство 'accessToken' не существует для типа 'void | TokenResponse '.

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

export async function getTokenPopup(request: Msal.TokenExchangeParameters) {
  return await auth.acquireTokenSilent(request).catch(async () => {
    return await auth.acquireTokenPopup(request).catch((error) => {
      console.log('login with popup failed: ', error)
    })
  })
}

const getGraphDetails = async (
  uri: string,
  scopes: Msal.TokenExchangeParameters,
  axiosConfig?: AxiosRequestConfig
) => {
  return getTokenPopup(scopes).then((response) => {
      return callGraph(uri, response.accessToken, axiosConfig)
  })
}

При проверке определения TS TokenResponse четко указано, что свойство accessToken доступно для объекта:

export type TokenResponse = AuthResponse & {
    uniqueId: string;
    tenantId: string;
    scopes: Array<string>;
    tokenType: string;
    idToken: string;
    idTokenClaims: StringDict;
    accessToken: string;
    refreshToken: string;
    expiresOn: Date;
    account: Account;
};

Что я делаю не так?

Answer 1

Просто обратите внимание на ваш catch, хотя вы используете await. Я бы написал этот код так:

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

export async function getTokenPopup(request: Msal.TokenExchangeParameters) {
    try {
        return await auth.acquireTokenSilent(request);
    } catch (error) {
        return await auth.acquireTokenPopup(request);
    }
}

const getGraphDetails = async (
    uri: string,
    scopes: Msal.TokenExchangeParameters,
    axiosConfig?: AxiosRequestConfig
) => {
    try {
        const response = await getTokenPopup(scopes);
        return callGraph(uri, response.accessToken, axiosConfig);
    } catch (error) {
        throw new Error("You could not get a token");
    }
}

Теперь, почему вы получаете void в response. Есть вероятность, что функция getTokenPopup не сработает как для acquireTokenSilent, так и для acquireTokenPopup. Таким образом, функция getTokenPopup выдаст ошибку (или ничего не вернет, зависит от вашей реализации).

TypeScript видит это и добавляет тип void, чтобы указать, что существует возможность не получить ответ.