authentication - 您如何将 aws-amplify 身份验证与 react-admin 集成？

Question

我正在尝试实现 aws-放大 到我的 react-admin .
特别适用于认证部分。

而不是有这样的事情:
react-admin with Amplify NavBar on top

我希望“aws-amplify”中的“UserName”和“LogOut”按钮与默认 View 非常相似:
default-navbar-screenshot

authProvider <code example> :

const App = () => (
  <Admin
    dashboard={Dashboard}
    authProvider={authProvider}
    dataProvider={dataProvider}
  >
    <Resource name="users" list={UserList} icon={UserIcon} />
    <Resource
      name="posts"
      list={PostList}
      edit={PostEdit}
      create={PostCreate}
      icon={PostIcon}
    />
  </Admin>
);

react-admin有一个我们可以定制的 authProvider Prop ，但我不知道如何创建一个连接到 aws-amplify 的组件。

Answer 1

您需要为 authProvider 创建提供程序和 dataProvider ，这将与 react-admin 兼容.

来自 the official documentation :

What’s an authProvider? Just like a dataProvider, an authProvider is an object that handles authentication logic. It exposes methods that react-admin calls when needed, and that return a Promise. The simplest authProvider is:

const authProvider = {
    login: params => Promise.resolve(),
    logout: params => Promise.resolve(),
    checkAuth: params => Promise.resolve(),
};

现在对于每个方法，我们需要映射来自 aws-amplify 的方法。 :

import {Auth} from 'aws-amplify';

const authProvider = {
    login: ({ username, password }) => Auth.signIn(username, password),
    logout: Auth.signOut,
    checkAuth: Auth.currentAuthenticatedUser,
};