Я пытаюсь интегрировать 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, но я борюсь с этой последней частью головоломки.