How to chain Http calls for 2 factor authentication getting user input between calls

@deggial wrote:

Hello,

I’m learning Ionic 2 since about a week and I had done quite a good work following the documentations and tutorials. In a week I learnt completely new concepts like rxjs, observables etc.

I stuck at the moment implementing a client app to a backend service which requires 2-factor-authentication. The user first enters his username and password. If successful, then an SMS is sent to the user from the backend, which he must enter for the second step of the authentication.

The backend uses classical cookie based sessions and I’ve successfully achieved to first step of the authentication and stuck at implementing the second step.

I’ve the following code for the first step of the authentication:

export class LoginPage {
    // Credentials are coming from the view in the real implementation
    private credentials = {username: 'john.doe', password: 'MyPass123!'}
    private formUrl = 'https://example.com/login'

    // Constructor has all other necessary dependencies injected
    constructor(private http: Http) {}

    // This method is called from the view after user sends his credentials
    public login() {
        // Get request to the form to parse the CSRF token.
        this.http.get(this.formUrl)
            .map(resp => this.addCsrfToken(credentials, resp.text()))
            .mergeMap(params => this.http.post(this.formUrl, params)
            .map(resp => this.checkLoginResponse(resp.text()))
            // ??? What to do here to start the 2nd step of the authentication
    }

    private addCsrfToken(credentials, html) {
        // Parse the html and add the CSRF token to the credentials
        // In the real implementation a URLSearchParams() object is created
        credentials.token = 'ParsedCsrfTokenFromHtmlForm';
        return credentials;
    }

    private checkLoginResponse(html) {
        // Parse the html to check if the first step was successfull
        return html.indexOf('Success.') !== -1; // Simplified for brevity
    }
}

I want to now prompt the user to enter a PIN number if the login response was true and send the the user input to the backend and check the response again. But I cannot figure it out how to go on.

I’ll be very thankful for any help or recommendation.

Thanks in advance!
Elin

Posts: 2

Participants: 2

Read full topic