Question

我有一个使用App Service Authentication托管在Azure App Services上的reactjs Web应用程序。

我的应用程序正确验证，并且从应用程序内部尝试获取/.auth/me，以便我可以读取访问令牌以用于将来的某些API请求，但是我收到了302响应。即使第一个请求（加载应用程序）已经过身份验证，响应也会重定向到login.microsoft.com。

const headers = {
    'Accept': 'application/json, text/plain, */*',
    'Content-Type': 'application/json',
    'credentials': 'include'
};

return (dispatch) => {
    const requestOptions = {
        method: 'GET',
        headers: headers,
    };

    return fetch("/.auth/me", requestOptions) 
        .then(parseResponseAndHandleErrors)
        .catch(error => {
            console.error(error)
        });
}

我认为我必须错过GET中的Cookie或标题，但文档不会提供太多信息：https://docs.microsoft.com/en-us/azure/app-service/app-service-authentication-how-to#retrieve-tokens-in-app-code

从您的客户端代码（例如移动应用或浏览器内的JavaScript）中，向/.auth/me发送HTTP GET请求。返回的JSON具有特定于提供者的标记。

我已尝试设置'credentials': 'same-origin'，但这没有任何区别。

Answer 1

我在查看了＆＃39;凭据后更详细地了解了这一点。 fetch() API的选项。

'credentials' : 'same-origin'不应包含在标题中，而应作为单独的请求选项：

const headers = {
    'Accept': 'application/json, text/plain, */*',
    'Content-Type': 'application/json'
};

return (dispatch) => {
    const requestOptions = {
        method: 'GET',
        headers: headers,
        'credentials': 'same-origin'  //credentials go here!!!
    };

    return fetch("/.auth/me", requestOptions) 
        ......
}

Azure App Service身份验证 - 302尝试获取/.auth/me时

1 个答案: