Как ждать дополнительного обещания после authProvider, но до разрешения dataProvider? - PullRequest
0 голосов
/ 01 апреля 2020

Я пытаюсь интегрировать React-Admin Firebase AuthProvider с Hasura DataProvider . Модуль RA Firebase предоставляет возможность создавать JSON Web Token (JWT), который Hasura может использовать для аутентификации, через функцию getJWTToken (), пока пользователь вошел в систему. Однако я изо всех сил стараюсь, чтобы что-то происходило в правильном порядке.

Я пытаюсь вызвать функцию authProvider.getJWTToken () из модуля Firebase Auth, ПОСЛЕ того, как пользователь входит в систему, но ДО вызова вызывающего пользователя Hasura dataProvider для передачи токена (JWT) в Hasura через HTTP заголовки. Я должен подождать, пока пользователь войдет в систему, чтобы вызвать authProvider.getJWTToken (), иначе токен будет нулевым, а Хасура отклонит запрос данных, что означает, что React-Admin загрузит меня обратно на экран входа в систему.

Мой код:

import React from "react";
import { fetchUtils, Admin, Resource } from "react-admin";
import { TodoCreate, TodoEdit, TodoList } from "./todos";
import { UserList, UserShow } from "./users";
import hasuraDataProvider from "ra-data-hasura";
import { FirebaseAuthProvider } from "react-admin-firebase";

// Define Firebase auth provider
const firebaseConfig = {
  apiKey: "AIzaSyDL9pXM6XuKDKs-jcCuZuc263t6yAHk7xc",
  authDomain: "react-admin-low-code.firebaseapp.com",
  databaseURL: "https://react-admin-low-code.firebaseio.com",
  projectId: "react-admin-low-code",
  storageBucket: "react-admin-low-code.appspot.com",
  messagingSenderId: "477028362078",
  appId: "1:477028362078:web:9ab7803d11783132f6d1cf"
};
const firebaseOptions = { logging: true, persistence: "local"};
const authProvider = FirebaseAuthProvider(firebaseConfig, firebaseOptions);

// Hasura definitions start here
const hasuraUri = "http://localhost:8081";
// This is the section I am trying to 'block' until authProvider resolves
const JWT = authProvider.getJWTToken().then(function (JWT) {return JWT});
const httpClient = (url, options = {}) => {
      options.headers = new Headers({ Accept: 'application/json' });
      options.headers.set('Authorization', `Bearer ${JWT}`);
  return fetchUtils.fetchJson(url, options)
};
const dataProvider = hasuraDataProvider(hasuraUri, httpClient);

const App = () => {
  return (
    <Admin
      dataProvider={dataProvider}
      authProvider={authProvider}
    >
      <Resource
        name="todos"
        list={TodoList}
        edit={TodoEdit}
        create={TodoCreate}
      />
      <Resource name="users" list={UserList} show={UserShow} />
    </Admin>
  );
};

export default App;

В этом примере Firebase настроен на прием логинов с именем пользователя: test@example.com и паролем: bigpassword Вы можете увидеть мой нерабочий код в репозитории здесь . Кроме того, вы можете локально воссоздать весь стек с помощью docker -compose в каталоге root хранилища.

Моя цель - чтобы этот репозиторий стал эталонная открытая реализация стека Firebase-Hasura-React-Admin, но я борюсь с этой последней частью головоломки.

...