OAuth - Error handling auth response. TypeError: t.trim is not a function. When using responseType: "code" in oauth config

cmaycumber commented 3 years ago

Before opening, please confirm:

[X] I have searched for duplicate or closed issues and discussions.
[X] I have read the guide for submitting bug reports.
[X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React, React Native

Amplify APIs

Authentication

Amplify Categories

auth

Environment information

``` System: OS: macOS 11.4 CPU: (8) x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz Memory: 526.47 MB / 16.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 15.14.0 - ~/.nvm/versions/node/v15.14.0/bin/node Yarn: 3.0.0 - /usr/local/bin/yarn npm: 7.7.6 - ~/.nvm/versions/node/v15.14.0/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman Browsers: Chrome: 92.0.4515.131 Firefox: 87.0 Safari: 14.1.1 Safari Technology Preview: 15.0 npmPackages: @ampproject/toolbox-optimizer: undefined () @aws-cdk/assert: 1.111.0 => 1.111.0 @aws-cdk/aws-appsync: 1.111.0 => 1.111.0 @aws-cdk/aws-cognito: 1.111.0 => 1.111.0 @aws-cdk/aws-route53: 1.111.0 => 1.111.0 @aws-cdk/aws-route53-targets: 1.111.0 => 1.111.0 @aws-cdk/core: 1.111.0 => 1.111.0 @babel/core: 7.14.6 => undefined (7.14.6, 7.14.8, 7.9.0, 7.12.13, ) @babel/plugin-proposal-class-properties: 7.14.5 => 7.14.5 (7.12.13) @changesets/cli: 2.16.0 => 2.16.0 @expo/html-elements: 0.0.1 => 0.0.1 @expo/next-adapter: 3.0.1 => 3.0.1 @expo/vector-icons: 12.0.0 => 12.0.0 (12.0.5) @hookform/resolvers: 2.0.1 => 2.0.1 @manypkg/cli: 0.17.0 => 0.17.0 @next/bundle-analyzer: 10.1.3 => 10.1.3 @nrwl/cli: 12.6.3 => 12.6.3 @nrwl/next: 12.6.3 => 12.6.3 @nrwl/tao: 12.6.3 => 12.6.3 @nrwl/workspace: 12.6.3 => 12.6.3 @react-native-async-storage/async-storage: 1.15.0 => 1.15.0 @react-native-community/eslint-config: 1.1.0 @react-native-community/eslint-plugin: 1.0.0 @react-native-community/masked-view: 0.1.11 => 0.1.11 @react-native-community/netinfo: 6.0.0 => 6.0.0 @react-native-community/viewpager: 5.0.11 => 5.0.11 @react-navigation/bottom-tabs: 6.0.1 => 6.0.1 @react-navigation/drawer: 6.0.1 => 6.0.1 @react-navigation/elements: 1.0.1 => 1.0.1 @react-navigation/material-top-tabs: 6.0.1 => 6.0.1 @react-navigation/native: 6.0.1 => 6.0.1 (5.9.6) @react-navigation/stack: 6.0.1 => 6.0.1 @serverless-stack/cli: 0.32.0 => 0.32.0 @serverless-stack/resources: 0.32.0 => 0.32.0 (0.32.1) @types/aws-lambda: 8.10.70 => 8.10.70 @types/dagre: 0.7.44 => 0.7.44 @types/faker: 5.5.1 => 5.5.1 @types/jest: 26.0.21 => 26.0.21 (26.0.24) @types/lodash: 4 => 4.14.172 @types/node: 14.14.35 => 14.14.35 (10.17.60, 16.4.10, 12.20.18, 14.17.7) @types/prompt: 1.1.1 => 1.1.1 @types/react: 16.9.35 => 16.9.35 (17.0.15) @types/react-dom: 16.9.8 => 16.9.8 @types/react-native: 0.63.2 => 0.63.2 @types/react-router: 5.1.14 => 5.1.14 @types/styled-components: 5 => 5.1.11 @types/styled-system: 5 => 5.1.12 @types/yaml: 1 => 1.9.6 @typescript-eslint/eslint-plugin: 4.28.4 => 4.28.4 (4.29.0) @typescript-eslint/parser: 4.28.4 => 4.28.4 (4.29.0) HelloWorld: 0.0.1 amphtml-validator: undefined () arg: undefined () async-retry: undefined () async-sema: undefined () aws-amplify: 4.1.0 => 4.1.0 aws-sdk: 2.863.0 => 2.863.0 (2.959.0) axios: 0.21.1 => 0.21.1 babel-plugin-inline-view-configs: 0.0.5 babel-plugin-styled-components: 1.13.2 => 1.13.2 bfj: undefined () cacache: undefined () cdk-triggers: 0.0.52 => 0.0.52 change-case: 4.1.2 => 4.1.2 ci-info: undefined () color: 3.1.3 => 3.1.3 (3.2.1) comment-json: undefined () compression: undefined () concurrently: 6.1.0 => 6.1.0 conf: undefined () content-type: undefined () cookie: undefined () crypto-secure-random-digit: 1.0.9 => 1.0.9 css-loader: undefined () dagre: 0.8.5 => 0.8.5 date-fns: 2.16.1 => 2.16.1 (2.23.0) debug: undefined () depcheck: 1.4.1 => 1.4.1 devalue: undefined () doctoc: 2.0.1 => 2.0.1 envfile: 6.14.0 => 6.14.0 escape-string-regexp: undefined () eslint: 7.31.0 => 7.31.0 (7.32.0) eslint-config-universe: 7.0.1 => 7.0.1 eslint-plugin-unused-imports: 1.1.2 => 1.1.2 expo: 42.0.0 => 42.0.0 expo-analytics-segment: 10.2.1 => 10.2.1 expo-asset: 8.3.2 => 8.3.2 (8.3.3) expo-constants: 11.0.1 => 11.0.1 expo-file-system: 11.1.3 => 11.1.3 expo-font: 9.2.1 => 9.2.1 expo-linear-gradient: 9.2.0 => 9.2.0 expo-linking: 2.3.1 => 2.3.1 expo-next-react-navigation: 1.2.1 => 1.2.1 expo-notifications: 0.12.3 => 0.12.3 expo-splash-screen: 0.11.2 => 0.11.2 expo-status-bar: 1.0.4 => 1.0.4 expo-updates: 0.8.0 => 0.8.0 expo-web-browser: 9.2.0 => 9.2.0 expo-yarn-workspaces: 1.5.2 => 1.5.2 file-loader: undefined () find-cache-dir: undefined () find-up: undefined () fresh: undefined () gzip-size: undefined () hermes-inspector-msggen: 1.0.0 http-proxy: undefined () husky: 7.0.1 => 7.0.1 ignore-loader: undefined () is-animated: undefined () is-docker: undefined () is-wsl: undefined () jest: 26.6.3 => 26.6.3 (25.5.4) jest-expo: 42.0.0 => 42.0.0 joi: 1.0.0 json5: undefined () jsonwebtoken: undefined () libphonenumber-js: 1.9.6 => 1.9.6 libphonenumber-js-core: 1.0.0 libphonenumber-js-max: 1.0.0 libphonenumber-js-min: 1.0.0 libphonenumber-js-mobile: 1.0.0 loader-utils: undefined () lodash: 4.17.21 => 4.17.21 lodash.curry: undefined () lru-cache: undefined () madge: 5.0.1 => 5.0.1 mini-css-extract-plugin: undefined () moti: 0.11.0 => 0.11.0 nanoid: undefined () native-base: 3.0.7 => 3.0.7 neo-async: undefined () next: 11.0.1 => 11.0.1 next-compose-plugins: 2.2.1 => 2.2.1 next-fonts: 1.5.1 => 1.5.1 next-images: 1.8.1 => 1.8.1 next-seo: 4.24.0 => 4.24.0 next-transpile-modules: 8.0.0 => 8.0.0 ora: undefined () patch-package: 6.4.7 => 6.4.7 postcss-flexbugs-fixes: undefined () postcss-loader: undefined () postcss-preset-env: undefined () postcss-scss: undefined () prettier: 2.3.2 => 2.3.2 (1.19.1) prompt: 1.1.0 => 1.1.0 raf: 3.4.1 => 3.4.1 react: 17.0.2 => 17.0.2 react-animated: 0.1.0 react-device-detect: 1.17.0 => 1.17.0 react-devtools: 4.14.0 => 4.14.0 react-div-100vh: 0.6.0 => 0.6.0 react-dom: 17.0.2 => 17.0.2 react-flow-renderer: 9.5.3 => 9.5.3 react-hook-form: 7.0.4 => 7.0.4 react-native: https://github.com/expo/react-native/archive/sdk-42.0.0.tar.gz => 0.63.2 react-native-codegen: 0.0.2 react-native-gesture-handler: 1.10.3 => 1.10.3 react-native-maps: 0.28.0 => 0.28.0 react-native-reanimated: ~2.2.0 => 2.2.0 react-native-safe-area-context: 3.2.0 => 3.2.0 react-native-screens: 3.4.0 => 3.4.0 react-native-svg: 12.1.1 => 12.1.1 react-native-tab-view: 3.0.1 => 3.0.1 react-native-unimodules: 0.14.2 => 0.14.2 react-native-uuid: 2.0.1 => 2.0.1 react-native-web: 0.17.1 => 0.17.1 react-plaid-link: 3.1.0 => 3.1.0 react-query: 3.13.6 => 3.13.6 react-test-renderer: 16.13.1 => 16.13.1 (16.11.0) react-use: 17.2.4 => 17.2.4 recast: undefined () resolve-url-loader: undefined () sass-loader: undefined () schema-utils: undefined () semver: undefined () send: undefined () setimmediate: 1.0.5 => 1.0.5 shade-blend-color: 1.0.0 => 1.0.0 source-map: undefined () string-hash: undefined () strip-ansi: undefined () stub: 1.0.0 styled-components: 5.3.0 => 5.3.0 styled-components/macro: undefined () styled-components/native: undefined () styled-components/primitives: undefined () styled-system: 5.1.5 => 5.1.5 superstruct: 1.0.0 terser: undefined () text-table: undefined () theme-ui: 0.9.1 => 0.9.1 three: 0.127.0 => 0.127.0 ts-jest: 26.5.4 => 26.5.4 (26.5.6) ts-node: 10.1.0 => 10.1.0 (9.1.1, 8.9.1) typescript: 4.3.5 => 4.3.5 (3.9.3, 3.9.10) unistore: undefined () uuid: 8.3.2 => 8.3.2 (3.4.0, 3.3.2, 7.0.3) vercel: 23.0.1 => 23.0.1 vest: 1.0.0 web-vitals: undefined () webpack: undefined () webpack-sources: undefined () worker-loader: 3.0.7 => 3.0.7 (2.0.0) yaml: 1.10.2 => 1.10.2 yup: 0.32.9 => 0.32.9 (1.0.0) zod: 1.0.0 npmGlobalPackages: @aws-amplify/cli: 5.0.0 chalet: 0.9.0 expo-cli: 4.8.1 json-server: 0.16.3 npm: 7.7.6 typescript: 4.3.2 ```

Describe the bug

When using Auth.federeatedSignIn with the responseType: "code" param in the oauth config I get the following error: OAuth - Error handling auth response. TypeError: t.trim is not a function. when switching to responseType: 'token', the error disappears and logs the user in successfully.

Expected behavior

No error, the user is logged in successfully on a redirect from federated sign-in.

Reproduction steps

Change from responseType: "code" to responseType: "token" in oauth config, run Auth.federatedSignIn({ provider: 'Google' })

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

chrisbonifacio commented 3 years ago

Hi @cmaycumber 👋 Can you share how your OAuth is configured in the code? Or what documentation you might have followed to set it up.

https://docs.amplify.aws/lib/auth/social/q/platform/js/#full-samples

chrisbonifacio commented 3 years ago

Also, can you check what your App client settings look like in the Cognito User Pools console? This is the way my app is configured for OAuth with Google.

cmaycumber commented 3 years ago

After digging a bit I did find that what you provided did work for me, however I also expected them to show under the Federation -> Identity Providers section like so:

I ended up using some CDK infrastructure to add the required secrets and client keys. I'm not sure if that could be abstracted in the future.

chrisbonifacio commented 3 years ago

@cmaycumber Awesome! Glad I was able to help 😄 I think the reason those setting are under App integration is because they are particular to the separate clients. In regards to the abstraction of secrets and client keys, if you mean one like the Google Web Client ID or Sign In With Apple service IDs, etc , I believe that could be configured through the Amplify CLI after running amplify add auth/amplify update auth and going through the OAuth/Social Provider settings.

github-actions[bot] commented 2 years ago

This issue has been automatically locked since there hasn't been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server *-help channels or Discussions for those types of questions.

aws-amplify / amplify-js