javascript - Making requests to AWS Gateway API React Native - Stack Overflow

admin管理员组

文章数量:1330564

In my app, the user can authenticate via AWS Cognito User Pools or Facebook all managed an AWS identity pool. That's all working correctly, the user can login and authenticate successfully. Now, I need to make authenticated requests to an AWS Gateway API which will then trigger Lambda functions. I'm confused as to what es next. Do I need to write code to sign these requests or does the AWS javascript SDK already have something built in for this? Do I need to create an Authorizer? How do I go from AWS.config.credentials to making successful, authenticated requests to a Gateway API?

I'm using React Native so the auto generated APIs won't work.

EDIT: Here's my request code:

fetch('https://MY_API_GATEWAY_URL/prod/handleMessages/', { method: 'GET', body: null, headers: { Authorization: 'Bearer ' + this.state.token, /* this is the JWT token from AWS Cognito. */ }, }) .then((response) => { alert(JSON.stringify(response, null, 2)) })

I get 403 response from this with the exception: InpleteSignatureException

In my app, the user can authenticate via AWS Cognito User Pools or Facebook all managed an AWS identity pool. That's all working correctly, the user can login and authenticate successfully. Now, I need to make authenticated requests to an AWS Gateway API which will then trigger Lambda functions. I'm confused as to what es next. Do I need to write code to sign these requests or does the AWS javascript SDK already have something built in for this? Do I need to create an Authorizer? How do I go from AWS.config.credentials to making successful, authenticated requests to a Gateway API?

I'm using React Native so the auto generated APIs won't work.

EDIT: Here's my request code:

fetch('https://MY_API_GATEWAY_URL/prod/handleMessages/', { method: 'GET', body: null, headers: { Authorization: 'Bearer ' + this.state.token, /* this is the JWT token from AWS Cognito. */ }, }) .then((response) => { alert(JSON.stringify(response, null, 2)) })

I get 403 response from this with the exception: InpleteSignatureException

• javascript
• amazon-web-services
• react-native
• aws-api-gateway

Share Improve this question Follow edited Sep 5, 2017 at 18:41 tallen11 asked Sep 5, 2017 at 15:47 tallen11tallen11 1,37722 gold badges1717 silver badges3434 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

At this point you should have a valid Cognito issued JWT. To call APIs behind AWS API Gateway you need to pass the JWT along with your API calls. This should go in the Authorization header with type of Bearer. You can determine whether a custom authorizer is necessary or just use the built in authorization with API Gateway.

Additional info can be found here - http://docs.aws.amazon./apigateway/latest/developerguide/apigateway-integrate-with-cognito.html

You also need to ensure IAM rules are in place to allow the UserPool to access the API Gateway endpoints - http://docs.aws.amazon./apigateway/latest/developerguide/permissions.html

You can use the AWS Amplify library's API module which will automatically sign requests: https://github./aws/aws-amplify

For React Native this is available via npm:

npm install aws-amplify-react-native

If using Cognito User Pools link the library as outlined here: https://github./aws/aws-amplify/blob/master/media/quick_start.md#react-native-development

The API module will have you configure a friendly name for your endpoint and also the Invocation URL from an API Gateway stage. Then you simply call the HTTP method and pass optional parameters as options:

import Amplify, {API} from 'aws-amplify-react-native';
Amplify.configure('your_config_file_here');
API.get('apiname', 'invokeURL', options).then(res=>{
    console.log(res);
});

You can generate the JWT token from Server-side, after AWS Cognito UserPools Authentication, using a API Gateway Endpoint. e.g /<stage>/authenticate

var authenticationData = {
    Username : 'username',
    Password : 'password',
};
var authenticationDetails = new AWSCognito.CognitoIdentityServiceProvider.AuthenticationDetails(authenticationData);
var poolData = { UserPoolId : 'us-east-1_TcoKGbf7n',
    ClientId : '4pe2usejqcdmhi0a25jp4b5sh3'
};
var userPool = new AWSCognito.CognitoIdentityServiceProvider.CognitoUserPool(poolData);
var userData = {
    Username : 'username',
    Pool : userPool
};
var cognitoUser = new AWSCognito.CognitoIdentityServiceProvider.CognitoUser(userData);
cognitoUser.authenticateUser(authenticationDetails, {
    onSuccess: function (result) {
        console.log('access token + ' + result.getAccessToken().getJwtToken());
        /*Use the idToken for Logins Map when Federating User Pools with Cognito Identity or when passing through an Authorization Header to an API Gateway Authorizer*/
        console.log('idToken + ' + result.idToken.jwtToken);
    },

    onFailure: function(err) {
        alert(err);
    },

});

For more details, check this example.

After the authentication send the jwtToken back to the React Native app, where it needs to be sent in Authorization header with the token for subsequent API requests.

At API Gateway configure user pool authorizer in integration method configuration, so that it will automatically validate the authorization header and load user context information for the endpoint.

本文标签： javascriptMaking requests to AWS Gateway API React NativeStack Overflow