Call Rendite Put() in einem Erfolg Callback

Question

Ich bin neu in React und Redux.

Ich verwende react-redux, um den AWS Cognito-Dienst aufzurufen, der ein Objekt mit einem Erfolgs- und Fehlerrückruf entgegennimmt. Ich bekomme meinen JWT von AWS Cognito zurück, wenn ich console.log innerhalb meines Erfolgsrückrufs einsetze. Wie kann ich jedoch yield put() innerhalb dieses Rückrufs, da es keine Generatorfunktion ist (function*).

Hier einige Code:

export function* getAWSToken(){ 
    // username, password and userPool come from react state 
    // not showing code for brevity. 

    const userData = { 
     Username: username, 
     Pool: userPool, 
    }; 
    const authenticationData = { 
    Username : username, 
    Password : password, 
    }; 

    const cognitoUser = new AWSCognito.CognitoIdentityServiceProvider.CognitoUser(userData); 
    const authenticationDetails = new AWSCognito.CognitoIdentityServiceProvider.AuthenticationDetails(authenticationData); 

    // This here is the callback 
    cognitoUser.authenticateUser(authenticationDetails, { 
    onSuccess(result){ 
     yield put(cognitoTokenObtained(result.getIdToken().getJwtToken()) 
    }, 
    onFailure(err){} 
    }); 
} 

Answer 1

Wenn Sie redux-Saga verwenden (was super ist), können Sie die call effect verwenden, um einen asyc Rückruf wie cognitoUser.authenticateUser in eine Reihe von Anweisungen zur Transformation zu sein ausgeführt von der Middlewhere.

Wenn die Middleware den Aufruf auflöst, wird der Generator zur nächsten Yield-Anweisung weitergeleitet. Sie können das Rückgabeergebnis einer Variablen zuweisen, die Sie dann mit einem PUT-Effekt in Ihrem Status platzieren können.

export function* getAWSToken(){ 
    // username, password and userPool come from react state 
    // not showing code for brevity. 

    const userData = { 
     Username: username, 
     Pool: userPool, 
    }; 
    const authenticationData = { 
    Username : username, 
    Password : password, 
    }; 

    const cognitoUser = new AWSCognito.CognitoIdentityServiceProvider.CognitoUser(userData); 
    const authenticationDetails = new AWSCognito.CognitoIdentityServiceProvider.AuthenticationDetails(authenticationData); 

    // Note: since you're invoking an object method 
    // you'll want to pass the object's context (this) with the call via an array 

    const token = yield apply(cognitoUser, cognitoUser.authenticateUser, [authenticationDetails, { onSuccess(response){return response}, onFailure(){} }]); 

    yield put(cognitoTokenObtained(token.getIdToken().getJwtToken()); 
} 

Es gibt auch 10, die ich sehr empfehlen kann.

Edit: Sie haben etwas Code für die Kürze weggelassen, aber ich würde sehr empfehlen, den Code innerhalb des Generators in Try Catch zu wickeln, da Sie auf externe IO von einer API abhängen.