CODEWITHSUNDEEP
angularjsamazon-web-serviceshttp-headersaws-sdkaws-api-gateway
Dmitriy Nevzorov
Dmitriy Nevzorov

Reputation: 6078

AWS API Gateway with Angular native $http service

I have AWS API gateway that uses cognito temporary credentials. I want to setup angular native $http service to use api with required aws4 authentication headers. I tried to use https://github.com/mhart/aws4 but I'm getting InvalidSignatureException

Is there any way to generate aws4 auth headers for front-end applications? Does anyone have experience setting app API Gateway without autogenerated SDK?

Upvotes: 1

Views: 2247

Answers (2)

Dmitriy Nevzorov
Dmitriy Nevzorov

Reputation: 6078

I wrote an angular module - angular-aws-apig on top of aws4 npm package. It provides an interceptor for $http service.

angular.module('app', ['angular-aws-apig'])
.config(function Config($httpProvider, APIGInterceptorProvider) {
    APIGInterceptorProvider.config({
        headers: {},
        region: 'us-east-1',
        service: 'execute-api',
        urlRegex: ''
    })

    /* @ngInject */
    APIGInterceptorProvider.headersGetter = function(myService, request) {
        myService.doSomething();
        return request.headers;
    };

    /* @ngInject */
    APIGInterceptorProvider.credentialsGetter = function(store, request) {
        return store.get('credentials');
    };

    $httpProvider.interceptors.push('APIGInterceptor');
});

It allows to resolve AWS IAM credentials before the request. It could be handy to use with AWS Cognito or Auth0 as they provide temporary IAM Credentials in exchange of user token. Those credentials then could be used to securely access APIGateway.

Upvotes: 1

RyanG
RyanG

Reputation: 4152

I would expect the aws4 library to work - it may be something in the way you are using it. If you can post some code it may help to diagnose.

The easiest way to integrate an API Gateway API is to use the generated JS SDK for your API. If you don't want to use it, you still may be able to re-use some of the SigV4 utilities in the generated SDK and integrate the signing process into your Angular client.

Thanks, Ryan

Upvotes: 0

Related Questions