reactjs - Hot Chocolate API を使用する ApolloProvider が Apollo Client に対して 404 を返す

Question

Hot Chocolate と Apollo を初めて使用すると、作成した Apollo クライアントが常に Hot Chocolate API に対して 404 を返すという問題があります。この API は localhost で実行されており、問題なくクエリを実行できます。

奇妙なのは、 Apollo Client を使用するgetServerSidePropsと、クエリが正常に返されることです。

EGこれは機能しています

export async function getServerSideProps() {
const { data } = await client.query({
    query: gql`
    query {
        rolesQuery {
            roles {
                id
                name
            }
        }
    }
  `,
});

return {
    props: { roles: data.rolesQuery.roles, },
};
}

これはしません

export function createApolloClient() {
const httpLink = createHttpLink({
    uri: process.env.NEXT_PUBLIC_GRAPHQL_API,
    fetchOptions: {
        mode: 'no-cors',
    },
});

const client = new ApolloClient({
    link: httpLink,
    cache: new InMemoryCache(),
});

return client;
}

// Usage of the client
const apolloClient = createApolloClient();
<ApolloProvider client={apolloClient}>...</ApolloProvider>

最初は修正されたCORSの問題がありましたが、コンポーネント内のフックからこれを呼び出すと、まだ404が発生します(graphql-codegenバージョン2.6.1を使用)。

何か案は？

フロント エンド コンポーネント呼び出しミューテーションの編集

import React from "react";
import { gql, useMutation } from '@apollo/client';

const REGISTER = gql`
mutation RegisterUser ($email: String!, $password: String!) {
  usersMutation {
    registerUser (request: { email: $email, password: $password}) {
      id
      firstName
      email
    }
  }
}
`;

const SignUp = () => {
    const [registerUser, { data, loading, error }] = useMutation(REGISTER);
    console.log(registerUser())

    return <div>code removed for brevity </div>;
};

export default SignUp;