在使用 Auth 安装组件后立即发送 Mutation？

如何解决在使用 Auth 安装组件后立即发送 Mutation？

我正在尝试编写一个组件，在用户通过 AUTH0 的身份验证过程后，在我的数据库中创建一个用户。应用程序的生命周期是：用户正在登陆呈现此内容的登陆组件：

 export default function Landing() {
        return (
            <div>
                <LoginButton /> //is a component that implements loginWithRedirect function from useAuth
                <logoutButton />
            </div>
        )
    }

在用户按下登录按钮后，他被重定向到 auth0 登录表单，他在那里输入他的凭据，在提交和验证后，他被发送到我的应用程序中的一个路由，称为 AuthMiddle。这个 AuthMiddle 位于我的应用程序的身份验证和仪表板之间，负责在我的数据库中创建用户。 AuthMiddle 的逻辑是，它应该在组件渲染后立即调用 graphql 突变，并在我的数据库中创建一个用户。这是代码

const AuthMiddleware = () => {
  const {isAuthenticated,loading } = useAuth0;
  const client = useApolloClient();
  const [load,setLoaded] = useState(loading);
  const [createuser,{ data,error }] = useMutation(CREATE_USER,{
    onCompleted(data) {
      console.log(data)
    }
  });
  useEffect(() => {
    async function creatingUser() {
      try {
        await createuser();
      } catch(error) {
        console.warn(error)
      }
      setLoaded(false);
    }
    creatingUser()
  },[loading]);
  if(loading) {
    return (<div>Loading ....</div>)
  }
  if (data) {
    return(<div className="finally">
      ReadyToRedirect
    </div>)
  }
  return (<div>{error && error.message}</div>);
};

export default AuthMiddleware;

这是我的 apollo 包装器，它随每个 graphql 请求发送身份验证令牌。

function ApolloWrapper({children}) {
    const {isAuthenticated,getAccesstokenSilently} = useAuth0();
    const [bearerToken,setBearerToken] = useState("");

    useEffect(() => {
        const getToken = async() => { 
            const token = isAuthenticated ? await getAccesstokenSilently() : "";
            setBearerToken(token);
         };
        getToken();
    },[getAccesstokenSilently,isAuthenticated]);
    const cache = new InMemoryCache();
    const link = createHttpLink({
      // uri: "https://go-study-backend.herokuapp.com/",uri: "http://localhost:5000/",});
    const authLink = setContext((_,{headers,...rest}) => {
      if(!bearerToken) {
        return {headers,...rest};
      }
      console.warn("token" + bearerToken);
      return{
          ...rest,headers: {
              ...headers,authorization: `Bearer ${bearerToken}`
          }
      }
    })
    const client = new ApolloClient({
      cache,link: authLink.concat(link),});
    return <ApolloProvider client={client}>{children}</ApolloProvider>
}
export default ApolloWrapper

我遇到的问题是，在用户完成身份验证过程并被重定向到 authMiddle 组件后，自动中间组件在呈现后立即发送的更改不包含授权标头，因此我的后端服务器发送了一个未经授权的回应。如何更改身份验证中间，以便在用户从身份验证页面重定向后发送带有授权标头的变异请求？