Next JS and AWS Amplify "No current user" at getServerSideProps

Question

While trying to make an API call from getServerSideProps, I am getting "No current user" error. This is an AWS Amplify+ NextJs project. The API is a REST API protected with AWS Cognito authentication.

export async function getServerSideProps({req}) {
  const { Auth, API } = withSSRContext({req});
 
  try {
    const apiName = "productApi-dev";
    const path = `/products`;
    products = await API.get(apiName, path); // this works perfectly in useEffect hooks
    
  } catch (e) {

    console.log(e);
  }
  return {
    props: {
      products,
       
    },
  };
}

The API call works perfectly from other parts of the code, for example, within useEffect hooks.

I tested the following code from serverSideProps

const user = await Auth.currentAuthenticatedUser();
console.log(user)

It prints the desired output- user information. No error.

And here is the aws amplify configuration

Amplify.configure({
  Auth: {
    mandatorySignIn: true,
    region: "us-east-1",
    userPoolId: *****,
    userPoolWebClientId: *****,
    identityPoolId: i*****,
    signupAttributes: "EMAIL",
    secure: true,
  },

  API: {
    endpoints: [
      {
        name: "*******",
        endpoint: "https://*******.execute-api.us-east-1.amazonaws.com",
        region: "us-east-1",
        custom_header: async () => {
          return {
            Authorization: `Bearer ${(await Auth.currentSession())
              .getIdToken()
              .getJwtToken()}`,
          };
        },
      },
    ],
  },
  ssr: true,
});

In this article AWS Amplify Doc, under "Making an authenticated API request in getServerSideProps" section, it says that "Using the new withSSRContext utility you can make authenticated API calls to GraphQL and REST back ends from these server-rendered routes.". The example is using GraphQL and while making the request, it mentioned the authMode:

  movieData = await API.graphql({
      query: listMovies,
      authMode: "AMAZON_COGNITO_USER_POOLS"
    });

I have not found anything for Rest API.

I will highly appreciate any help.

Did you figure it out? I'm facing the same problem. – Pablo Cantero Sep 04 '22 at 01:09 — Pablo Cantero, Sep 04 '22 at 01:09

score 1 · Accepted Answer · answered Oct 12 '22 at 15:05

The main problem here is withSSRContext doesn't work with custom_header in your Amplify.config. It ends up sending an unresolved Promise to the hook.

To fix this, you should remove the custom_header section from your config:

Amplify.configure({
  Auth: {
    region: "XX-XXXX-X",
    userPoolId: "XX-XXXX-X_abcd1234",
    userPoolWebClientId: "a1b2c3d4e5f6g7h8i9j0k1l2m3",
    identityPoolId: "XX-XXXX-X:XXXXXXXX-XXXX-1234-abcd-1234567890ab",
  },
  API: {
    endpoints: [
      {
        name: "apiName",
        endpoint: "https://12a3bcdefg.execute-api.us-east-1.amazonaws.com/dev/",
        region: "XX-XXXX-X"
      },
    ],
  },
  ssr: true,
});

Then change getServerSideProps like follows:

export async function getServerSideProps({req}) {
  const { Auth, API } = withSSRContext({req});

  const apiName = "productApi-dev";
  const path = `products`;
  const myInit = {
    headers: {
      Authorization: `Bearer ${(await Auth.currentSession())
        .getIdToken()
        .getJwtToken()}`,
    },
  };
 
  try {
    const products = await API.get(apiName, path, myInit); 
  } catch (e) {
    console.log(e);
  }

  return {
    props: {
      products,
    },
  };
}

Next JS and AWS Amplify "No current user" at getServerSideProps

1 Answers1