Office 中的客户端凭据流 add-ins

Question

我正在 Angular 中开发 Outlook 任务窗格 add-in，当用户单击 add-in 按钮时，我想使用客户端凭据流调用受保护的 Web 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 错误

在“https://login.microsoftonline.com/xxxx/oauth2/v2.0/token' from origin 'https://xxxx.azurewebsites.net”访问 XMLHttpRequest 已被 CORS 策略阻止：请求的资源上不存在 'Access-Control-Allow-Origin' header。.

有什么办法可以解决这个错误吗？也尝试在此处使用 MSAL，但我找不到有关 JS 客户端凭据流的任何文档。它仅适用于 .NET

Answer 1

1.You 永远不要把客户端密码放在前面-end.This 非常不安全！

2.We建议您使用https://github.com/AzureAD/azure-activedirectory-library-for-js. for frontend to integrate AAD with a ease.You can refer to 了解详情。

client_credentials grant_type 仅用于应用场景。如果您必须使用客户端凭据流，则需要在您的应用后端获取访问令牌并将其 return 发送到前端。

Office 中的客户端凭据流 add-ins

Client Credential Flow in Office add-ins

azure-active-directory

outlook-web-addins

clientcredential