Question

我正在尝试将React-Admin Firebase AuthProvider与Hasura DataProvider集成在一起。只要用户登录，RA Firebase模块就可以提供通过getJWTToken（）函数生成Hasura可以用来进行身份验证的JSON Web令牌（JWT）的功能。但是，我正在努力让事情发生在正确的顺序。

我试图在用户登录后从Firebase Auth模块中调用authProvider.getJWTToken（）函数，但是在调用Hasura dataProvider之前，以便通过HTTP标头将令牌（JWT）传递给Hasura。我必须等到用户登录后才能调用authProvider.getJWTToken（），否则令牌将为null，Hasura将拒绝数据请求，这意味着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的登录 You can see my non-working code in the repo here.此外，您可以在仓库的根目录中使用docker-compose在本地重新创建整个堆栈。

我的目标是让this repository成为Firebase-Hasura-React-Admin堆栈的参考开放实现，但是我正为最后的难题而苦苦挣扎。

如何在authProvider之后但在dataProvider解析之前等待额外的承诺？

0 个答案: