aws-amplify / amplify-js

A declarative JavaScript library for application development using cloud services.
https://docs.amplify.aws/lib/q/platform/js
Apache License 2.0
9.43k stars 2.13k forks source link

Serverside fethAuthSession sometimes returns undefined #13472

Closed didemkkaslan closed 5 months ago

didemkkaslan commented 5 months ago

Before opening, please confirm:

JavaScript Framework

Next.js

Amplify APIs

Authentication

Amplify Version

v6

Amplify Categories

auth

Backend

CDK

Environment information

``` # Put output below this line System: OS: macOS 14.5 CPU: (8) arm64 Apple M2 Memory: 143.09 MB / 8.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 18.16.0 - /usr/local/bin/node Yarn: 1.22.19 - /opt/homebrew/bin/yarn npm: 9.5.1 - /usr/local/bin/npm bun: 1.0.2 - ~/.bun/bin/bun Browsers: Chrome: 125.0.6422.142 Safari: 17.5 npmPackages: @amplitude/analytics-browser: ^2.3.3 => 2.4.1 @ampproject/toolbox-optimizer: undefined () @ant-design/cssinjs: 1.20.0 => 1.20.0 @ant-design/icons: ^5.2.6 => 5.3.0 (5.3.7) @ant-design/plots: ^1.2.5 => 1.2.6 @aws-amplify/adapter-nextjs: ^1.0.9 => 1.0.16 @aws-amplify/adapter-nextjs/api: undefined () @aws-amplify/adapter-nextjs/data: undefined () @babel/core: undefined () @babel/runtime: 7.15.4 @edge-runtime/cookies: 4.0.2 @edge-runtime/ponyfill: 2.4.1 @edge-runtime/primitives: 4.0.2 @graphql-codegen/cli: 5.0.0 => 5.0.0 @graphql-codegen/client-preset: 4.1.0 => 4.1.0 @graphql-codegen/introspection: 4.0.0 => 4.0.0 @hapi/accept: undefined () @mantine/hooks: ^7.1.5 => 7.5.2 @microsoft/teams-js: ^2.19.0 => 2.23.0 @mswjs/interceptors: undefined () @napi-rs/triples: undefined () @next/bundle-analyzer: ^13.5.6 => 13.5.6 @next/font: undefined () @next/react-dev-overlay: undefined () @opentelemetry/api: undefined () @react-pdf/renderer: ^3.1.13 => 3.3.8 @segment/ajv-human-errors: undefined () @tailwindcss/typography: ^0.5.10 => 0.5.10 @tanstack/query-codemods: 4.24.3 @tanstack/react-query: ^5.0.5 => 5.20.5 @tanstack/react-query-devtools: ^5.8.9 => 5.20.5 @testing-library/jest-dom: ^6.1.4 => 6.4.2 @testing-library/react: ^14.0.0 => 14.2.1 @testing-library/user-event: ^14.5.1 => 14.5.2 @types/jest: ^29.5.6 => 29.5.12 @types/lodash: ^4.14.200 => 4.14.202 @types/mixpanel-browser: ^2.47.4 => 2.49.0 @types/node: ^20.8.8 => 20.11.17 (16.18.87) @types/react: ^18.2.31 => 18.2.55 @types/react-dom: ^18.2.14 => 18.2.19 @types/react-google-recaptcha: ^2.1.7 => 2.1.9 @types/react-highlight-words: ^0.16.6 => 0.16.7 @types/uuid: ^9.0.7 => 9.0.8 @typescript-eslint/eslint-plugin: ^6.9.0 => 6.21.0 @typescript-eslint/parser: ^6.9.0 => 6.21.0 @vercel/nft: undefined () @vercel/og: undefined () acorn: undefined () amphtml-validator: undefined () anser: undefined () antd: 5.17.0 => 5.17.0 apexcharts: ^3.44.0 => 3.45.2 arg: undefined () assert: undefined () async-retry: undefined () async-sema: undefined () autoprefixer: ^10.4.16 => 10.4.17 aws-amplify: 6.0.15 => 6.0.15 aws-amplify/adapter-core: undefined () aws-amplify/analytics: undefined () aws-amplify/analytics/kinesis: undefined () aws-amplify/analytics/kinesis-firehose: undefined () aws-amplify/analytics/personalize: undefined () aws-amplify/analytics/pinpoint: undefined () aws-amplify/api: undefined () aws-amplify/api/server: undefined () aws-amplify/auth: undefined () aws-amplify/auth/cognito: undefined () aws-amplify/auth/cognito/server: undefined () aws-amplify/auth/enable-oauth-listener: undefined () aws-amplify/auth/server: undefined () aws-amplify/datastore: undefined () aws-amplify/in-app-messaging: undefined () aws-amplify/in-app-messaging/pinpoint: undefined () aws-amplify/push-notifications: undefined () aws-amplify/push-notifications/pinpoint: undefined () aws-amplify/storage: undefined () aws-amplify/storage/s3: undefined () aws-amplify/storage/s3/server: undefined () aws-amplify/storage/server: undefined () aws-amplify/utils: undefined () aws-rum-web: ^1.15.0 => 1.17.0 axios: ^1.5.1 => 1.6.7 babel-packages: undefined () browserify-zlib: undefined () browserslist: undefined () buffer: undefined () bytes: undefined () ci-info: undefined () cli-select: undefined () client-only: 0.0.1 clsx: ^2.0.0 => 2.1.0 comment-json: undefined () compression: undefined () conf: undefined () constants-browserify: undefined () content-disposition: undefined () content-type: undefined () cookie: undefined () cookies-next: ^4.1.1 => 4.1.1 cross-spawn: undefined () crypto-browserify: undefined () css.escape: undefined () data-uri-to-buffer: undefined () dayjs: ^1.11.10 => 1.11.10 debug: undefined () devalue: undefined () docx: ^8.5.0 => 8.5.0 domain-browser: undefined () edge-runtime: undefined () eslint: ^8.52.0 => 8.56.0 eslint-config-airbnb: ^19.0.4 => 19.0.4 eslint-config-airbnb-typescript: ^17.1.0 => 17.1.0 eslint-config-next: ^13.5.6 => 13.5.6 eslint-config-prettier: ^9.0.0 => 9.1.0 eslint-plugin-i18next: ^6.0.3 => 6.0.3 eslint-plugin-import: ^2.29.0 => 2.29.1 eslint-plugin-jest: ^27.4.3 => 27.8.0 eslint-plugin-jest-dom: ^5.1.0 => 5.1.0 eslint-plugin-jsx-a11y: ^6.7.1 => 6.8.0 eslint-plugin-react: ^7.33.2 => 7.33.2 eslint-plugin-testing-library: ^6.1.2 => 6.2.0 events: undefined () find-cache-dir: undefined () find-up: undefined () framer-motion: ^10.16.4 => 10.18.0 fresh: undefined () get-orientation: undefined () glob: undefined () graphql: ^16.8.1 => 16.8.1 (15.8.0) graphql-request: ^6.1.0 => 6.1.0 gzip-size: undefined () http-proxy: undefined () http-proxy-agent: undefined () https-browserify: undefined () https-proxy-agent: undefined () husky: ^8.0.3 => 8.0.3 i18next: ^23.7.15 => 23.8.2 i18next-chained-backend: ^4.5.0 => 4.6.2 i18next-http-backend: ^2.2.2 => 2.4.3 i18next-localstorage-backend: ^4.2.0 => 4.2.0 icss-utils: undefined () ignore-loader: undefined () image-size: undefined () is-animated: undefined () is-docker: undefined () is-wsl: undefined () jest: ^29.7.0 => 29.7.0 jest-environment-jsdom: ^29.7.0 => 29.7.0 jest-worker: undefined () json5: undefined () jsonwebtoken: undefined () jwt-decode: ^3.1.2 => 3.1.2 loader-runner: undefined () loader-utils: undefined () lodash: ^4.17.21 => 4.17.21 lodash.curry: undefined () lru-cache: undefined () micromatch: undefined () mini-css-extract-plugin: undefined () mixpanel-browser: ^2.47.0 => 2.49.0 nanoid: undefined () native-url: undefined () neo-async: undefined () next: ^13.5.6 => 13.5.6 next-i18next: ^15.1.2 => 15.2.0 next-i18next-create-client: undefined () next-seo: ^6.1.0 => 6.4.0 node-fetch: undefined () node-html-parser: undefined () nookies: ^2.5.2 => 2.5.2 ora: undefined () os-browserify: undefined () p-limit: undefined () path-browserify: undefined () platform: undefined () postcss: ^8.4.31 => 8.4.35 (8.4.31) postcss-flexbugs-fixes: undefined () postcss-modules-extract-imports: undefined () postcss-modules-local-by-default: undefined () postcss-modules-scope: undefined () postcss-modules-values: undefined () postcss-preset-env: undefined () postcss-safe-parser: undefined () postcss-scss: undefined () postcss-value-parser: undefined () prettier: ^3.0.3 => 3.2.5 prettier-plugin-tailwindcss: ^0.5.6 => 0.5.11 process: undefined () punycode: undefined () querystring-es3: undefined () raw-body: undefined () react: 18.2.0 => 18.2.0 react-apexcharts: ^1.4.1 => 1.4.1 react-builtin: undefined () react-dom: 18.2.0 => 18.2.0 react-dom-builtin: undefined () react-dom-experimental-builtin: undefined () react-error-boundary: ^4.0.13 => 4.0.13 react-experimental-builtin: undefined () react-google-recaptcha: ^3.1.0 => 3.1.0 react-highlight-words: ^0.20.0 => 0.20.0 react-i18next: ^14.0.0 => 14.0.5 react-icons: ^4.11.0 => 4.12.0 react-infinite-scroll-component: ^6.1.0 => 6.1.0 react-is: 18.2.0 react-refresh: 0.12.0 react-server-dom-turbopack-builtin: undefined () react-server-dom-turbopack-experimental-builtin: undefined () react-server-dom-webpack-builtin: undefined () react-server-dom-webpack-experimental-builtin: undefined () regenerator-runtime: 0.13.4 sass-loader: undefined () scheduler-builtin: undefined () scheduler-experimental-builtin: undefined () schema-utils: undefined () semver: undefined () send: undefined () server-only: 0.0.1 setimmediate: undefined () sharp: ^0.32.6 => 0.32.6 shell-quote: undefined () source-map: undefined () stacktrace-parser: undefined () stream-browserify: undefined () stream-http: undefined () string-hash: undefined () string_decoder: undefined () strip-ansi: undefined () superstruct: undefined () tailwind-merge: ^1.14.0 => 1.14.0 tailwindcss: ^3.3.3 => 3.4.1 tar: undefined () terser: undefined () text-table: undefined () timers-browserify: undefined () tty-browserify: undefined () typescript: ^5.2.2 => 5.3.3 ua-parser-js: undefined () undici: undefined () unistore: undefined () usehooks-ts: ^2.9.1 => 2.14.0 util: undefined () uuid: ^9.0.1 => 9.0.1 (8.3.2) vm-browserify: undefined () watchpack: undefined () web-vitals: undefined () webpack: undefined () webpack-sources: undefined () ws: undefined () zod: ^3.22.4 => 3.22.4 () zustand: ^4.5.2 => 4.5.2 npmGlobalPackages: corepack: 0.17.0 eas-cli: 8.0.0 expo-cli: 6.3.10 npm: 9.5.1 turbo: 1.13.3 ```

Describe the bug

We are using session?.tokens?.idToken?.payload?.scope?.split(' ') ?? [], for feature toggling. I'm calling getScopes on pages getServerSideProps to enable/disable some app features. But sometimes scopes returns undefined. So the feature toggling is broken. I really don't know why it happens, maybe refresh token related?


import { runWithAmplifyServerContext } from '../utils/amplifyServerUtils';
import { fetchAuthSession } from 'aws-amplify/auth/server';
import { GetServerSidePropsContext } from 'next';

export const getServerSession = async (ctx: GetServerSidePropsContext) => {
  const { req, res } = ctx;
  const session = await runWithAmplifyServerContext({
    nextServerContext: { request: req, response: res },
    operation: (contextSpec) => fetchAuthSession(contextSpec, {}),
  });

  return {
    session,
  };
};

import { getServerSession } from './getServerSession';
import { GetServerSidePropsContext } from 'next';

export const getScopes = async (ctx: GetServerSidePropsContext) => {
  const { session } = await getServerSession(ctx);

  return {
    scopes: session?.tokens?.idToken?.payload?.scope?.split(' ') ?? [],
  };
};

export const getServerSideProps: GetServerSideProps = async (
  ctx: GetServerSidePropsContext,
) => {
  const locale = getLocale(ctx);
  const { scopes } = await getScopes(ctx);

  return {
    props: {
      ...(await serverSideTranslations(locale, [
        'common',
        'meetings',
        'settings',
      ])),
      scopes,
    },
  };
};

Expected behavior

idToken.payload shouldnt be undefined

Reproduction steps

Use fetchAuthSession serverside to get the session inside pages getServerSideProps. Sometimes its just undefined

Code Snippet

// Put your code below this line.

Log output

``` // Put your logs below this line ```

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

mehrdad-shokri commented 5 months ago

I also noticed this behaviour upgrading from "@aws-amplify/adapter-nextjs": "^1.0.21" and "aws-amplify": "^6.0.20" to the latest version. i think the fetchAuthSession, fetchUserAttributes, getCurrentUser fails to fetch latest values when accessToken is expired.

didemkkaslan commented 5 months ago

Hello @mehrdad-shokri thanks for the comment. Do you think using the exact @aws-amplify/adapter-nextjs: "^1.0.21" aws-amplify: "^6.0.20"

versions would solve the problem

mehrdad-shokri commented 5 months ago

I'm not sure. it wasn't happening for me on 6.0.20 now have downgraded to it but still happening.

didemkkaslan commented 5 months ago

I got some more context: So the app waits in the background like 15min or so and I saw ERR_CONNECTION_CLOSED on the console and then UserUnAuthenticatedException error. Finally scopes became empty

Screenshot 2024-06-07 at 19 16 23 Screenshot 2024-06-07 at 19 18 26
israx commented 5 months ago

hello everyone. This issue is solved on the latest version of the library. Can you please upgrade and let us know if you are still having issues ?

didemkkaslan commented 5 months ago

Hello, sure I've updated the versions to latests. I'll update here if the issue persists thank you

israx commented 5 months ago

Apologies there was a confusion, the change is not yet out. We have a fix PR that is on its way. I'll update the ticket when the change is released to npm.

HuiSF commented 5 months ago

Hi @didemkkaslan we've released the fix to resume the token refresh on the server side when it's necessary.

Please upgrade @aws-amplify/adapter-nextjs to version 1.2.4.

cwomack commented 5 months ago

Linking this to the related #13456 as well.

mehrdad-shokri commented 5 months ago

It's fixed now. thank you <3

didemkkaslan commented 5 months ago

Hello, thanks everyone its fixed. ❤️

cwomack commented 5 months ago

@mehrdad-shokri and @didemkkaslan, thank you for the confirmations! We'll close this issue out as resolved then.