在登录中使用react-adal时出错

时间:2019-06-17 09:07:30

标签: reactjs react-redux azure-active-directory react-router-redux

我正在使用react-adal库在前端对用户进行身份验证。我希望用户进入主页,单击登录按钮,然后转到路由/ user。现在,一旦用户单击登录并转到/ user,我将被要求提供确定的登录凭据,当我到达路由/ user时输入详细信息后,它不会显示任何内容,并且在控制台中会给出一个对象 消息:“ AADSTS500011:在名为72f988bf-86f1-41af-91ab-2d7cd011db47的租户中找不到资源主体命名值。如果租户的管理员未安装该应用程序,或者未得到任何用户的同意,则可能会发生这种情况。您可能已将身份验证请求发送给错误的租户。 race跟踪ID:c6f40d40-3bc5-4d56-8257-d5f9492a2d00 ↵关联ID:8109d7cc-a5c7-44f2-94ef-1a20741c4a4b ↵时间戳:2019-06-17 09:01:40Z“ msg:“ invalid_resource”

我正在使用Windows 1-,并且订阅了天蓝色。

App.js

import React from 'react';
import {
    BrowserRouter as Router,
    Route,
    Switch
} from 'react-router-dom';


import User from './User';
import Home from './Home';
import { withAdalLoginApi } from './config/adalConfig';

function App() {
    const ProtectedAppArea = withAdalLoginApi(User, null, null);

    return (
        <Router>
            <div className="App">
                <Switch>
                    <Route exact path="/" component={Home} />
                    <Route path="/user" component={withAdalLoginApi(User)} />
                    />
        </Switch>
            </div>
        </Router>
    );
}

export default App;

index.js

import React from 'react';
import ReactDOM from 'react-dom';

import { runWithAdal } from 'react-adal';
import { authContext } from './config/adalConfig';

import App from './App';

runWithAdal(authContext, () => {
    ReactDOM.render(<App />, document.getElementById('root'));
}, true);

adalConfig.js

import { AuthenticationContext, adalFetch, withAdalLogin } from 'react-adal';

export const adalConfig = {
  tenant: 'MytenantId',
  clientId: 'Mycliend id',
  endpoints: {
    api: 'values',
  },
  cacheLocation: 'localStorage',
};

export const authContext = new AuthenticationContext(adalConfig);

export const adalApiFetch = (url, options) =>
  adalFetch(authContext, adalConfig.endpoints.api, fetch, url, options);

export const withAdalLoginApi = withAdalLogin(authContext, adalConfig.endpoints.api);

user.js

import React, { Component } from 'react';


class User extends Component {
  render() {
    return (
      <div>
        Hello User
      </div>
    );
  }
}

export default User;

预计用户应该登录,输出应该是主屏幕上的Hello用户

0 个答案:

没有答案