Lightrun
question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[amazon-cognito-identity-js] Appropriate usage of associateSoftwareToken

See original GitHub issue

Before opening, please confirm:

JavaScript Framework

Angular

Amplify APIs

Authentication, Not applicable

Amplify Categories

auth, Not applicable

Environment information

System:
    OS: macOS 12.4
    CPU: (8) x64 Intel(R) Core(TM) i5-8259U CPU @ 2.30GHz
    Memory: 249.66 MB / 8.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.3.0 - ~/.nvm/versions/node/v16.3.0/bin/node
    npm: 8.15.0 - ~/.nvm/versions/node/v16.3.0/bin/npm
  Browsers:
    Chrome: 104.0.5112.101
    Firefox: 103.0.2
    Safari: 15.5
  npmPackages:
    @angular-devkit/build-angular: ~12.0.5 => 12.0.5 
    @angular/animations: ~12.0.5 => 12.0.5 
    @angular/animations/browser:  undefined ()
    @angular/animations/browser/testing:  undefined ()
    @angular/cdk: ^12.2.13 => 12.2.13 
    @angular/cdk/a11y:  undefined ()
    @angular/cdk/accordion:  undefined ()
    @angular/cdk/bidi:  undefined ()
    @angular/cdk/clipboard:  undefined ()
    @angular/cdk/coercion:  undefined ()
    @angular/cdk/collections:  undefined ()
    @angular/cdk/drag-drop:  undefined ()
    @angular/cdk/keycodes:  undefined ()
    @angular/cdk/layout:  undefined ()
    @angular/cdk/observers:  undefined ()
    @angular/cdk/overlay:  undefined ()
    @angular/cdk/platform:  undefined ()
    @angular/cdk/portal:  undefined ()
    @angular/cdk/scrolling:  undefined ()
    @angular/cdk/stepper:  undefined ()
    @angular/cdk/table:  undefined ()
    @angular/cdk/testing:  undefined ()
    @angular/cdk/testing/protractor:  undefined ()
    @angular/cdk/testing/selenium-webdriver:  undefined ()
    @angular/cdk/testing/testbed:  undefined ()
    @angular/cdk/text-field:  undefined ()
    @angular/cdk/tree:  undefined ()
    @angular/cli: ~12.0.5 => 12.0.5 
    @angular/common: ~12.0.5 => 12.0.5 
    @angular/common/http:  undefined ()
    @angular/common/http/testing:  undefined ()
    @angular/common/testing:  undefined ()
    @angular/common/upgrade:  undefined ()
    @angular/compiler: ~12.0.5 => 12.0.5 
    @angular/compiler-cli: ~12.0.5 => 12.0.5 
    @angular/compiler/testing:  undefined ()
    @angular/core: ~12.0.5 => 12.0.5 
    @angular/core/testing:  undefined ()
    @angular/forms: ~12.0.5 => 12.0.5 
    @angular/material: ^12.2.13 => 12.2.13 
    @angular/material/autocomplete:  undefined ()
    @angular/material/autocomplete/testing:  undefined ()
    @angular/material/badge:  undefined ()
    @angular/material/badge/testing:  undefined ()
    @angular/material/bottom-sheet:  undefined ()
    @angular/material/bottom-sheet/testing:  undefined ()
    @angular/material/button:  undefined ()
    @angular/material/button-toggle:  undefined ()
    @angular/material/button-toggle/testing:  undefined ()
    @angular/material/button/testing:  undefined ()
    @angular/material/card:  undefined ()
    @angular/material/card/testing:  undefined ()
    @angular/material/checkbox:  undefined ()
    @angular/material/checkbox/testing:  undefined ()
    @angular/material/chips:  undefined ()
    @angular/material/chips/testing:  undefined ()
    @angular/material/core:  undefined ()
    @angular/material/core/testing:  undefined ()
    @angular/material/datepicker:  undefined ()
    @angular/material/datepicker/testing:  undefined ()
    @angular/material/dialog:  undefined ()
    @angular/material/dialog/testing:  undefined ()
    @angular/material/divider:  undefined ()
    @angular/material/divider/testing:  undefined ()
    @angular/material/expansion:  undefined ()
    @angular/material/expansion/testing:  undefined ()
    @angular/material/form-field:  undefined ()
    @angular/material/form-field/testing:  undefined ()
    @angular/material/form-field/testing/control:  undefined ()
    @angular/material/grid-list:  undefined ()
    @angular/material/grid-list/testing:  undefined ()
    @angular/material/icon:  undefined ()
    @angular/material/icon/testing:  undefined ()
    @angular/material/input:  undefined ()
    @angular/material/input/testing:  undefined ()
    @angular/material/list:  undefined ()
    @angular/material/list/testing:  undefined ()
    @angular/material/menu:  undefined ()
    @angular/material/menu/testing:  undefined ()
    @angular/material/paginator:  undefined ()
    @angular/material/paginator/testing:  undefined ()
    @angular/material/progress-bar:  undefined ()
    @angular/material/progress-bar/testing:  undefined ()
    @angular/material/progress-spinner:  undefined ()
    @angular/material/progress-spinner/testing:  undefined ()
    @angular/material/radio:  undefined ()
    @angular/material/radio/testing:  undefined ()
    @angular/material/select:  undefined ()
    @angular/material/select/testing:  undefined ()
    @angular/material/sidenav:  undefined ()
    @angular/material/sidenav/testing:  undefined ()
    @angular/material/slide-toggle:  undefined ()
    @angular/material/slide-toggle/testing:  undefined ()
    @angular/material/slider:  undefined ()
    @angular/material/slider/testing:  undefined ()
    @angular/material/snack-bar:  undefined ()
    @angular/material/snack-bar/testing:  undefined ()
    @angular/material/sort:  undefined ()
    @angular/material/sort/testing:  undefined ()
    @angular/material/stepper:  undefined ()
    @angular/material/stepper/testing:  undefined ()
    @angular/material/table:  undefined ()
    @angular/material/table/testing:  undefined ()
    @angular/material/tabs:  undefined ()
    @angular/material/tabs/testing:  undefined ()
    @angular/material/toolbar:  undefined ()
    @angular/material/toolbar/testing:  undefined ()
    @angular/material/tooltip:  undefined ()
    @angular/material/tooltip/testing:  undefined ()
    @angular/material/tree:  undefined ()
    @angular/material/tree/testing:  undefined ()
    @angular/platform-browser: ~12.0.5 => 12.0.5 
    @angular/platform-browser-dynamic: ~12.0.5 => 12.0.5 
    @angular/platform-browser-dynamic/testing:  undefined ()
    @angular/platform-browser/animations:  undefined ()
    @angular/platform-browser/testing:  undefined ()
    @angular/router: ~12.0.5 => 12.0.5 
    @angular/router/testing:  undefined ()
    @angular/router/upgrade:  undefined ()
    @types/jasmine: ~3.6.0 => 3.6.11 
    @types/node: ^12.11.1 => 12.20.55 
    amazon-cognito-identity-js: ^5.2.10 => 5.2.10 
    jasmine-core: ~3.7.0 => 3.7.1 
    karma: ~6.3.0 => 6.3.20 
    karma-chrome-launcher: ~3.1.0 => 3.1.1 
    karma-coverage: ~2.0.3 => 2.0.3 
    karma-coverage-coffee-example:  1.0.0 
    karma-jasmine: ~4.0.0 => 4.0.2 
    karma-jasmine-html-reporter: ^1.5.0 => 1.7.0 
    lib:  0.0.1 
    rxjs: ~6.6.0 => 6.6.7 
    rxjs/ajax:  undefined ()
    rxjs/fetch:  undefined ()
    rxjs/internal-compatibility:  undefined ()
    rxjs/operators:  undefined ()
    rxjs/testing:  undefined ()
    rxjs/webSocket:  undefined ()
    tslib: ^2.1.0 => 2.4.0 (2.2.0, 1.14.1)
    typescript: ~4.2.3 => 4.2.4 
    zone-mix:  undefined ()
    zone-node:  undefined ()
    zone-testing:  undefined ()
    zone.js: ~0.11.4 => 0.11.8 
    zone.js/async-stack-tagging:  undefined ()
    zone.js/async-stack-tagging.min:  undefined ()
    zone.js/async-test:  undefined ()
    zone.js/async-test.min:  undefined ()
    zone.js/fake-async-test:  undefined ()
    zone.js/fake-async-test.min:  undefined ()
    zone.js/jasmine-patch:  undefined ()
    zone.js/jasmine-patch.min:  undefined ()
    zone.js/long-stack-trace-zone:  undefined ()
    zone.js/long-stack-trace-zone.min:  undefined ()
    zone.js/mocha-patch:  undefined ()
    zone.js/mocha-patch.min:  undefined ()
    zone.js/proxy:  undefined ()
    zone.js/proxy.min:  undefined ()
    zone.js/sync-test:  undefined ()
    zone.js/sync-test.min:  undefined ()
    zone.js/task-tracking:  undefined ()
    zone.js/task-tracking.min:  undefined ()
    zone.js/webapis-media-query:  undefined ()
    zone.js/webapis-media-query.min:  undefined ()
    zone.js/webapis-notification:  undefined ()
    zone.js/webapis-notification.min:  undefined ()
    zone.js/webapis-rtc-peer-connection:  undefined ()
    zone.js/webapis-rtc-peer-connection.min:  undefined ()
    zone.js/webapis-shadydom:  undefined ()
    zone.js/webapis-shadydom.min:  undefined ()
    zone.js/wtf:  undefined ()
    zone.js/wtf.min:  undefined ()
    zone.js/zone-bluebird:  undefined ()
    zone.js/zone-bluebird.min:  undefined ()
    zone.js/zone-error:  undefined ()
    zone.js/zone-error.min:  undefined ()
    zone.js/zone-legacy:  undefined ()
    zone.js/zone-legacy.min:  undefined ()
    zone.js/zone-patch-canvas:  undefined ()
    zone.js/zone-patch-canvas.min:  undefined ()
    zone.js/zone-patch-cordova:  undefined ()
    zone.js/zone-patch-cordova.min:  undefined ()
    zone.js/zone-patch-electron:  undefined ()
    zone.js/zone-patch-electron.min:  undefined ()
    zone.js/zone-patch-fetch:  undefined ()
    zone.js/zone-patch-fetch.min:  undefined ()
    zone.js/zone-patch-jsonp:  undefined ()
    zone.js/zone-patch-jsonp.min:  undefined ()
    zone.js/zone-patch-message-port:  undefined ()
    zone.js/zone-patch-message-port.min:  undefined ()
    zone.js/zone-patch-promise-test:  undefined ()
    zone.js/zone-patch-promise-test.min:  undefined ()
    zone.js/zone-patch-resize-observer:  undefined ()
    zone.js/zone-patch-resize-observer.min:  undefined ()
    zone.js/zone-patch-rxjs:  undefined ()
    zone.js/zone-patch-rxjs-fake-async:  undefined ()
    zone.js/zone-patch-rxjs-fake-async.min:  undefined ()
    zone.js/zone-patch-rxjs.min:  undefined ()
    zone.js/zone-patch-socket-io:  undefined ()
    zone.js/zone-patch-socket-io.min:  undefined ()
    zone.js/zone-patch-user-media:  undefined ()
    zone.js/zone-patch-user-media.min:  undefined ()
  npmGlobalPackages:
    @angular/cli: 12.0.5
    gatsby-cli: 4.0.0
    gatsby-source-spotify: 1.3.2
    json-server: 0.17.0
    node-gyp: 8.2.0
    npm: 8.15.0
    serverless: 3.7.1

Describe the bug

I’m trying to setup TOTP on my Angular application. I do have authentication and password reset flows working. My user pool has mandatory TOTP.

Use case 28 depicts the following code [resumed to what’s interesting]:

cognitoUser.authenticateUser(authenticationDetails, {
     mfaSetup: function(challengeName, challengeParameters) {
          cognitoUser.associateSoftwareToken(this);
     },
}

Reproducing the code above (although in a similar way) on my code doesn’t allow me to call the associateSoftwareToken function in any way. It returns the following:

Argument of type 'IAuthenticationCallback' is not assignable to parameter of type '{ associateSecretCode: (secretCode: string) => void; onFailure: (err: any) => void; }'.

My code:

user.authenticateUser(authDetails, {
     onSuccess: success => {
          s.next(success);
          s.complete();
     },
     mfaSetup: function(_challengeName, challengeParameters) {
          user.associateSoftwareToken(this);
     },
}

Expected behavior

You should be able to build your project without any issues by passing the this parameter to the cognitoUser.associateSoftwareToken() function, and also enable TOTP on your account.

Reproduction steps

  1. Install amazon-cognito-identity-js;
  2. Create a service (or applicable JS file) to handle your authentication flow;
  3. While authenticating the user using cognitoUser.authenticate, use themfaSetup callback as a function (e.g.: mfaSetup: function(challengeName, challengeParameters) and call cognitoUser.associateSoftwareToken(this), as per defined in use case 28 of amazon-cognito-identity-js.

Code Snippet


login(username: string, password?: string, newPassword?: string, mfaCode?: string) {

        const authData: IAuthenticationDetailsData = {
            Username: username,
            Password: password
        }

        const authDetails = new AuthenticationDetails(authData);

        const userData: ICognitoUserData = {
            Username: username,
            Pool: UserPoolX
        }

        const user = new CognitoUser(userData);

        return new Observable(s => {
                user.authenticateUser(authDetails, {

                    onSuccess: success => {
                        
                        s.next(success);
                        s.complete();
                    },
                    mfaSetup: function(_challengeName, challengeParameters) {
                        user.associateSoftwareToken(this);
                    }
                });
        });
}

Log output

error TS2345: Argument of type 'IAuthenticationCallback' is not assignable to parameter of type '{ associateSecretCode: (secretCode: string) => void; onFailure: (err: any) => void; }'.

Property 'associateSecretCode' is missing in type 'IAuthenticationCallback' but required in type '{ associateSecretCode: (secretCode: string) => void; onFailure: (err: any) => void; }'.

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

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:6

github_iconTop GitHub Comments

2reactions
lucassilvagccommented, Aug 19, 2022

I’ve just found the issue and a way to solve it.

Turns out the function asks for a full callback, like this (code adapted for usage w/ an Observable):

user.authenticateUser(authDetails, {
          onSuccess: success => {
                    s.next(success);
                    s.complete();
          }, 
          mfaSetup: mfaSetup => {
                    user.associateSoftwareToken({
                              onFailure: err => {
                                        s.error(err);
                              },
                              associateSecretCode: code => {
                                        s.next(code);
                                        s.complete();
                              }
                    });
          }
});

With that being said, the documentation should reflect the usage of the callback (which is a more common use case after all), rather than what’s already in place.

0reactions
nadetasticcommented, Oct 25, 2022

@lucassilvagc thanks again for the feedback.

Amplify Auth should address your previous problems - but if you encounter any, please open up an issue and I’ll be happy to help.

Read more comments on GitHub >

github_iconTop Results From Across the Web

AssociateSoftwareToken - Amazon ... - AWS Documentation
A unique generated shared secret code that is used in the TOTP algorithm to generate a one-time code. Type: String. Length Constraints: Minimum...
Read more >
AssociateSoftwareTokenComma...
Documentation for Cognito Identity Provider Client - AWS SDK for JavaScript v3. ... You can authorize an AssociateSoftwareToken request with either the ...
Read more >
Get a token to associate an MFA application with an Amazon ...
Get a token to associate an MFA application with an Amazon Cognito user using an AWS SDK. PDF. The following code examples show...
Read more >
Amazon Cognito Identity Provider examples using SDK for ...
Code examples that show how to use AWS SDK for JavaScript V3 with Amazon Cognito Identity Provider.
Read more >
VerifySoftwareToken - Amazon Cognito User Pools
Use this API to register a user's entered time-based one-time password (TOTP) code and mark the user's software token MFA status as "verified"...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found
Previous page

Receiving Notifications in Android 31+ fails because of PendingIntent Flag in RNPushNotificationHelper

Next page

DataStore not syncing on new project