从Dynamics表单调用SharePoint REST API遇CORS问题求助

问题根源 #

你直接在前端（Dynamics CRM页面）调用https://login.microsoftonline.com/{tenant}/oauth2/v2.0/token端点获取令牌的方式不可行——该端点针对密码式/客户端凭据式授权流不支持跨域请求（CORS）。微软出于安全考虑，禁止前端暴露敏感信息（如客户端密钥、用户密码），因此默认关闭了这类授权流的跨域权限。

可行解决方案 #

方案1：使用MSAL.js实现授权码流+PKCE（推荐） #

这是前端单页应用（SPA）调用微软API的标准安全流程，无需在前端存储敏感信息，且微软原生支持跨域。

步骤1：调整Azure应用注册配置

• 将应用类型改为单页应用（SPA）
• 添加重定向URI时，选择SPA类型，填入你的Dynamics CRM地址：https://xxxxx.crm.dynamics.com
• 为应用添加所需的API权限（如Sites.Read.All），并完成管理员同意（若为租户级权限）

步骤2：用MSAL.js实现令牌获取与API调用

引入MSAL.js库（可通过CDN或npm），替换你的原生fetch代码：

// 初始化MSAL实例
const msalConfig = {
    auth: {
        clientId: "你的Azure应用ID",
        authority: "https://login.microsoftonline.com/{你的租户ID}",
        redirectUri: "https://xxxxx.crm.dynamics.com"
    }
};
const msalInstance = new msal.PublicClientApplication(msalConfig);

// 静默获取令牌，失败则弹出登录窗口
async function acquireAccessToken() {
    const request = {
        scopes: ["https://graph.microsoft.com/Sites.Read.All"]
    };
    try {
        return await msalInstance.acquireTokenSilent(request);
    } catch (err) {
        return await msalInstance.acquireTokenPopup(request);
    }
}

// 查询SharePoint站点组成员
async function fetchSiteGroupMembers() {
    const tokenResult = await acquireAccessToken();
    const response = await fetch(
        "https://graph.microsoft.com/v1.0/sites/{站点ID}/groups/{组ID}/members",
        {
            headers: { "Authorization": `Bearer ${tokenResult.accessToken}` }
        }
    );
    const members = await response.json();
    // 处理成员数据
    console.log(members);
}

// 表单加载时触发
document.addEventListener("DOMContentLoaded", fetchSiteGroupMembers);

方案2：通过后端中转请求 #

若你无法使用SPA授权流，可搭建一个后端服务作为中转：

• 后端使用客户端凭据式/授权码式授权流，安全存储客户端密钥并获取令牌
• 前端调用你自己的后端接口，后端负责请求MS Graph/SharePoint API并返回结果
• 此方式下前端与后端同域，完全规避CORS问题

内容的提问来源于stack exchange，提问作者cjanow