AadHttpClient无法从使用AAD保护的Azure功能中检索数据

Mor*_*app 5 cors typescript azure-active-directory azure-functions sharepointframework

我正在尝试从用C#编写的自定义Azure函数中检索一些数据

[EnableCors]
[FunctionName("Authenticate")]
public static IActionResult Run([HttpTrigger(AuthorizationLevel.Anonymous, "get")]HttpRequestMessage req, TraceWriter log)
{
    var privateKey = new SHA512CryptoServiceProvider();
    var res = req.CreateResponse(req.Headers);
    res.Headers.Add("Access-Control-Allow-Credentials", "true");
    res.Headers.Add("Access-Control-Allow-Origin", req.Headers.GetValues("Origin").FirstOrDefault());
    return (IActionResult)res;
}
Run Code Online (Sandbox Code Playgroud)

在Azure功能的配置中,我启用了CORS,其中包含一条规则(https:// localhost:4321).这是我本地托管的SharePoint工作台的正确URL.

我按照微软的教程,但是我收到以下错误信息:

sp-http.js:1570 Uncaught (in promise) Error: This operation cannot be performed until the AadTokenProvider is initialized.
    at AadTokenProvider.getToken (sp-http.js:1570)
    at sp-http.js:2414
    at ServiceScope.whenFinished (sp-loader-assembly_en-us.js:9861)
    at sp-http.js:2410
    at new Promise (<anonymous>)
    at AadHttpClient.fetch (sp-http.js:2409)
    at AadHttpClient.get (sp-http.js:2433)
    at AdalWebPart.render (AdalWebPart.ts:23)
    at AdalWebPart.BaseClientSideWebPart._renderWithAccessibleTitle (sp-webpart-base.js:1535)
    at sp-webpart-base.js:1369
Run Code Online (Sandbox Code Playgroud)

这是我用来尝试获取数据的代码:

export default class AdalWebPart extends BaseClientSideWebPart<IAdalWebPartProps> {
    private authenticationClient: AadHttpClient;

    public render(): void {
        this.context.statusRenderer.displayLoadingIndicator(this.domElement, "Authenticating");

        this.authenticationClient.get(
            "https://morganstestauthfunction.azurewebsites.net/api/Authenticate",
            AadHttpClient.configurations.v1
        ).then(res => console.log(res.json()));
    }

    protected onInit(): Promise<void> {
        this.authenticationClient = new AadHttpClient(this.context.serviceScope, "ae63d423-1028-40bd-9032-bdefce20b82d");
        return Promise.resolve();
    }
}
Run Code Online (Sandbox Code Playgroud)

我也尝试过微软本教程中提出的方法

export default class IFrameHandler extends React.Component<any>{
    private remotePartyLoaded: () => void;

    public constructor(public props: any) {
        super(props);
        this.remotePartyLoaded = props.remotePartyLoaded;
    }

    public render() {
        return (
            <iframe
                src={"https://morganstestauthfunction.azurewebsites.net/api/Authenticate"}
                style={{ display: "none" }}
                onLoad={this.remotePartyLoaded.bind(this)}
            />
        )
    }
}


export default class AzureWebPart extends BaseClientSideWebPart<> {

    private azureCallback() {
        this.context.httpClient.get("https://morganstestauthfunction.azurewebsites.net/api/Authenticate",
            HttpClient.configurations.v1, {
                credentials: "include",
            }).then(console.log);
    }


    public render(): void {
        const element: React.ReactElement<any> = React.createElement(
            IFrameHandler,
            {
                remotePartyLoaded: this.azureCallback.bind(this)
            },
        );

        ReactDom.render(element, this.domElement);
    }
}
Run Code Online (Sandbox Code Playgroud)

那个方法抛出这个:

无法加载https://morganstestauthfunction.azurewebsites.net/api/Authenticate:响应中"Access-Control-Allow-Credentials"标头的值为'',当请求的凭据模式为'时,该值必须为'true'包括'.因此,不允许来源" https:// localhost:4321 "访问.

最终的最终目标是使用此Azure功能充当验证SharePoint用户身份的身份验证代理,因此我需要将该功能与Azure AD集成.