Поток учетных данных клиента в надстройках Office

Question

Я разрабатываю надстройку области задач Outlook в Angular, и когда пользователь нажимает кнопку надстройки, я хочу использовать поток учетных данных клиента для вызова защищенного веб-API.

Я попытался использовать обычный httpClient и выполнить запрос POST, как показано ниже

 let body=new HttpParams();
    body=body.set("grant_type","client_credentials");
    body=body.set("client_id","xxxxxxx");
    body=body.set("client_secret","xxxxxx");
    body=body.set("scope","https://xxxxxx/.default");

    const url="https://login.microsoftonline.com/xxxxx/oauth2/v2.0/token";

    this.httpClient.post(url,body)

Я получаю ошибку CORS, как показано ниже

Доступ к XMLHttpRequest по адресу https://login.microsoftonline.com/xxxx/oauth2/v2.0/token из источника https://xxxx.azurewebsites.net/ заблокирован политикой CORS: Нет контроля доступа -Allow-Origin'присутствует в запрошенном ресурсе..

Есть ли способ исправить эту ошибку? Пытался использовать здесь и MSAL, но мне не удалось найти никакой документации по потоку учетных данных клиента для JS. Доступно только для.NET.

Answer 1

1. Никогда не помещайте секрет клиента во внешний интерфейс - это очень небезопасно!

2. Мы предлагаем вам использовать https://github.com/AzureAD/azure-activedirectory-library-for-js. для веб-интерфейса для простой интеграции AAD. Подробности можно найти в заголовке No 'Access-Control-Allow-Origin' с Microsoft Online Auth.

client_credentials grant_type используется только в сценарии приложения. Если вы должны использовать поток учетных данных клиента, вам необходимо получить токен доступа в серверной части приложения и вернуть его во внешний интерфейс.