Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

URI not considered #308

Closed
ludoblues opened this issue Jun 5, 2024 · 7 comments
Closed

URI not considered #308

ludoblues opened this issue Jun 5, 2024 · 7 comments

Comments

@ludoblues
Copy link

I am trying to config the lib on a brand new project but when i perform a mutation, the request hits localhost (don't consider the uri i pass when configuring the client).

It looks like i am doing like the examples:

ApolloWrapper.tsx

"use client";

import { ApolloLink, HttpLink, concat } from "@apollo/client";
import {
  ApolloNextAppProvider,
  ApolloClient,
  InMemoryCache,
  SSRMultipartLink,
} from "@apollo/experimental-nextjs-app-support";

function makeClient() {
  const httpLink = new HttpLink({
    uri: "http://test.com",
    fetchOptions: { cache: "no-store" },
  });

  return new ApolloClient({
    cache: new InMemoryCache(),
    link: httpLink,
  });
}

export function ApolloWrapper({ children }: React.PropsWithChildren) {
  return (
    <ApolloNextAppProvider makeClient={makeClient}>
      {children}
    </ApolloNextAppProvider>
  );
}

layout.tsx

  return (
    <html suppressHydrationWarning={true} lang="fr">
      <body className={inter.className}>
          <ApolloWrapper>
            <AuthProvider initialUser={user}>
              <ResponsiveAppBar />
              {children}
            </AuthProvider>
          </ApolloWrapper>
      </body>
    </html>
  );
}

folder/page.tsx

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

export default function AddTodoPage() {
  const [addTodo, { data, loading, error }] = useMutation(ADD_TODO);

  try {
    addTodo({}); // localhost instead of test.com
  } catch(e) {
    // ...
  }
}
@phryneas
Copy link
Member

phryneas commented Jun 5, 2024

That's weird.
Is that "http://test.com/" a real code snippet from your experiment or do you maybe use an environment variable there? Could you please show the code you are actually using (or verify that it locally shows the same behaviour if you put "http://test.com/" there in your code)?

@ludoblues
Copy link
Author

ludoblues commented Jun 5, 2024

You are right!

I did test to hardcode "http://test.com" but i think it did not reload well so i thought i didn't work either in the first place.
When i hardcode it, it actually works!

The issue only happens when using an env variable as follow:

   console.log("GRAPHQL URL", process.env.NEXT_PUBLIC_API_URL); // I can see it from here!

  const httpLink = new HttpLink({
    uri: process.env.NEXT_PUBLIC_API_URI,
    fetchOptions: { cache: "no-store" },
  });

However, i can console.log() it just

@phryneas
Copy link
Member

phryneas commented Jun 5, 2024

Phew, that's extremely weird - that code hasn't been touched in years and together with the Apollo Client core library, probably millions of devs are running this. Really all I can think of would be next not correctly bundling the environment variable.

Does is still log correctly of you put that console.log into the makeClient function?

@ludoblues
Copy link
Author

I could have it work by manually rebuild my stack
I definitely have an issue with my hot reload which doesn't affect all the changes

Thanks for your time!

Copy link
Contributor

github-actions bot commented Jun 5, 2024

Do you have any feedback for the maintainers? Please tell us by taking a one-minute survey. Your responses will help us understand Apollo Client usage and allow us to serve you better.

@phryneas
Copy link
Member

phryneas commented Jun 5, 2024

Great to hear that everything worked out :)

@takuyawww
Copy link

the same problem is reproduced in the local environment.
Is there currently no way around this other than hard-coding the specification to the uri?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants