amazon-archives/aws-cognito-angular-quickstart

An Angular(v5)-based QuickStart single-page app utilizing Amazon Cognito, S3, and DynamoDB (Serverless architecture)

Cognito Quickstart

Creator: Vladimir Budilov

• YouTube
• LinkedIn
• Medium

Note: This repo is deprecated. It was created before the Amplify SDK was available which performs a lot of the plumbing for you. Please use the Amplify SDK going forward. Here's an example of its use with ReactJS as well.

What does this app do?

Tech Stack

Required Tools

• aws cli
• eb cli
• npm
• angular-cli

Frameworks

• AWS JavaScript SDK
• Angular 2
  • TypeScript
• Bootstrap

AWS Setup

Install the required tools (the installation script only runs on Linux and Mac)

• Create an AWS account
• Install npm
• Install or update your aws cli
• Install or update your eb cli
• Install angular-cli

Getting the code and running it locally

This uses the pre-configured AWS resources hosted by AWS

# Clone it from github
git clone --depth 1 [email protected]:awslabs/aws-cognito-angular2-quickstart.git

# Install the NPM packages
cd aws-cognito-angular2-quickstart
npm install

# Run the app in dev mode
npm start

Creating AWS Resources

This sample application can be deployed to either Elastic Beanstalk or S3. S3 will host this application as a static site while Elastic Beanstalk gives you the capability of adding backend operations to the application.

• What is Elastic Beanstalk
• What is S3

createResources.sh requires your aws cli to be configured for JSON output.

# Install the AWS resources and deploy your application to either Elastic Beanstalk or S3
cd aws
./createResources.sh

Running the above command will create the necessary AWS resources and build & deploy your code to AWS. It will prompt you to choose your deployment target (S3 or Elastic Beanstalk). Choosing 'S3' makes your deployment completely serverless, while choosing Elastic Beanstalk will create an EC2 instance that will host this NodeJS app.

Caution: You might incur AWS charges after running the setup script

After initially running the createResources.sh script, use the below commands to rebuild and redeploy

S3: Update, Build and Deploy

# Build the project and sync the output with the S3 bucket
npm run build; cd dist; aws s3 sync . s3://[BUCKET_NAME]/

# Test your deployed application
curl –I http://[BUCKET_NAME].s3-website-[REGION].amazonaws.com/

NOTE: You might want to reshuffle some of the "package.json" dependencies and move the ones that belong to devDependencies for a leaner deployment bundle. At this point of time, AWS Beanstalk requires all of the dependencies, including the devDependencies to be under the dependencies section. But if you're not using Beanstalk then you can optimize as you wish.

or

Beanstalk: Update, Build and Deploy

# Commit your changes in order to deploy it to your environment
git add .
git commit
eb deploy

# View your deployed application in a browser
eb open

Local Testing

This section contains instructions on how to test the application locally (using mocked services instead of the real AWS services).

LocalStack

To test this application using LocalStack, you can use the awslocal CLI (https://github.com/localstack/awscli-local).

pip install awscli-local

Simply parameterize the ./createResources.sh installation script with aws_cmd=awslocal:

cd aws; aws_cmd=awslocal ./createResources.sh

Once the code is deployed to the local S3 server, the application is accessible via http://localhost:4572/cognitosample-localapp/index.html (Assuming "localapp" has been chosen as resource name in the previous step)

aws-cognito-angular-quickstart's Issues

Requesting instructions

Where can I find instructions or a tutorial to get this to work?

(NotAuthorizedException) when calling the SetIdentityPoolRoles operation

I ran into this error:
An error occurred (NotAuthorizedException) when calling the SetIdentityPoolRoles operation: Access to Role 'arn:aws:iam::180971085012ole/quantumjs-unauthenticated-role' is forbidden.
When running

# Update cognito identity with the roles
# If this command gives you an error, associate the roles manually
aws cognito-identity set-identity-pool-roles --identity-pool-id $identityPoolId --roles authenticated=arn:aws:iam::$AWS_ACCOUNT:role/$ROLE_NAME_PREFIX-authenticated-role,unauthenticated=arn:aws:iam::$AWS_ACCOUNT:role/$ROLE_NAME_PREFIX-unauthenticated-role --region $REGION

Can someone explain how to do this in a bit more detail?

What is best solution to process facebook data?

I'd like to invoke function from frontend to fetch facebook comments, process them and send to s3. What Is best solution? Do you have any docs about using facebook api with lambda/kinesis?

Angular 1?

Are you planning to release an Angular 1 version as well?

That would be helpful. Because, the Cognito SDK is in JavaScript not TypeScript.
Angular 2 is still in beta and constantly changing even for the latest release candidates.
That mean, few persons would right now jump on the Angular 2 band wagon for a production strength mission critical app.

Error on loginComponent

We're able to register, and confirm. When we attempt login however, we're getting the following:

EXCEPTION: Error in ./LoginComponent class LoginComponent - inline template:18:12 caused by: Cannot read property 'hex' of undefined

Issue seems to hit at this line:
cognitoUser.authenticateUser(authenticationDetails, {

Replace callbacks with Behavioral Subjects

You create a lot of tight coupling and testability woes by using callbacks. A more angular way would be to use Observables, probably based on Behavioral Subjects.

You might also want to look into Guarding routes, making use of modules and adhere to the one component per file convention.

That said thanks for posting this.

Solved: DynamoDB (LoginTrail table) not working

Solution: Manually update the trust-policies in IAM for each role under the tab Trust Relationships.

I can register a user and it will appear in my user pool. The problem is, the LoginTrail table is not allowed access and I so I'm not seeing any entries being added:

aws.service.js:123 Unable to query the table. Error JSON: {
  "message": "Missing credentials in config",
  "code": "CredentialsError",
  "time": "2016-09-08T18:00:19.290Z",
  "requestId": "1ab822fd-75ee-11e6-a29a-8b8828c45dd6",
  "statusCode": 400,
  "retryable": false,
  "retryDelay": 69.53922312168217,
  "originalError": {
    "message": "Could not load credentials from constructor",
    "code": "CredentialsError",
    "time": "2016-09-08T18:00:19.289Z",
    "requestId": "1ab822fd-75ee-11e6-a29a-8b8828c45dd6",
    "statusCode": 400,
    "retryable": false,
    "retryDelay": 69.53922312168217,
    "originalError": {
      "message": "Invalid identity pool configuration. Check assigned IAM roles for this pool.",
      "code": "InvalidIdentityPoolConfigurationException",
      "time": "2016-09-08T18:00:19.289Z",
      "requestId": "1ab822fd-75ee-11e6-a29a-8b8828c45dd6",
      "statusCode": 400,
      "retryable": false,
      "retryDelay": 69.53922312168217
    }
  }
}

Ionic2

Sorry I know this came up in issue #5 but are there any intentions on making this work for ionic2 or even giving a quick guide?

I know a lot of people who are looking for something just like this but with ionic2.

Many Thanks,

Chris

[feature request] It would be great if AWS could sponsor a youtube video on all the steps to get this to run including setting up amazon resources. EOM

Ionic 2 integration

Hi
Hiw can i integrate this with my existing ionic 2 project?
Thanks
sirfak

Rc.4

I just tried with Angular 2 rc4 and it doesn't seem to work.

Redundant AWS-SDK and AWS-Cognito-SDK?

My understanding is that the AWS-Cognito-SDK is just the Cognito module of the AWS-SDK. If we are importing AWS-SDK, is it necessary to include both?

Freature: Login With Facebook, Google

It would be great if we can add login with Facebook, Google and other social media accounts with AWS Cognito.

angular-cli errors

angular-cli: 1.0.0-beta.14
node: 6.6.0
os: darwin x64

Error when running 'npm start':

The "defaults.prefix" and "defaults.sourceDir" properties of angular-cli.json are deprecated in favor of "apps[0].root" and "apps[0].prefix". Please update in order to avoid errors in future versions of angular-cli.
The "defaults.prefix" and "defaults.sourceDir" properties of angular-cli.json are deprecated in favor of "apps[0].root" and "apps[0].prefix". Please update in order to avoid errors in future versions of angular-cli.

Fix requires new a 'angular-cli.json' file:

{
  "project": {
    "version": "1.0.0-beta.14",
    "name": "aws-cognito-angular2-quickstart"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": "assets",
      "index": "index.html",
      "main": "main.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.json",
      "prefix": "app",
      "mobile": false,
      "styles": [
        "styles.css"
      ],
      "scripts": [],
      "environments": {
        "source": "environments/environment.ts",
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ],
  "addons": [],
  "packages": [],
  "e2e": {
    "protractor": {
      "config": "./protractor.conf.js"
    }
  },
  "test": {
    "karma": {
      "config": "./karma.conf.js"
    }
  },
  "defaults": {
    "styleExt": "css",
    "prefixInterfaces": false
  }
}

And some paths need updating to fix these types of errors:

ERROR in ./src/app/public/auth.component.ts
Module not found: Error: Can't resolve './/app/template/auth/confirmRegistration.html'

Is it safe to expose IDs in the source code?

Hi,
while I am checking the code, I see some IDs are exposed in the file
https://github.com/awslabs/aws-cognito-angular2-quickstart/blob/master/src/app/service/cognito.service.ts#L27-L29

Is this a good way to do this or there should have better implementations?

Thanks.

Authentication Role and Create Account issues

Just wanted to point out the policy on aws/authrole.json is pointing to a specific account and this is causing errors to query the DDB table. I had to manually edit the policy in IAM to point to the correct table.

I am also getting the following error to create an account:

POST https://cognito-idp.ap-northeast-1.amazonaws.com/ 400 (Bad Request) 
XHR finished loading: POST "https://cognito-idp.ap-northeast-1.amazonaws.com/".scheduleTask @ zone.js:1274
result: Username cannot be of email format, since user pool is configured for email alias. @ auth.component.ts:261 

I'm trying with:

user: jdoe
email: [email protected]

Other than that, it works like a charm. Great stuff!

npm start emits broccoli error

I've installed all of the dependencies and followed the instructions on setting up cognito. Everything is configured but I'm getting the error below on npm start. I googled the error and found this issue on github:

angular/angular-cli#873

Could it be a version problem with angular-cli? They are right in the middle of migrating from broccoli to webpack, but I'm not sure I should be upgrading/downgrading. Here are the versions I'm running:

angular-cli: 1.0.0-beta.10
node: 4.4.5
aws-cli/1.10.59 Python/2.7.6 Linux/4.2.0-c9 botocore/1.4.49
$ bower --version
1.7.9

Here's the error:

taji:~/workspace (master) $ npm start

> [email protected] start /home/ubuntu/workspace
> ng server

Livereload server on http://localhost:49152
Serving on http://localhost:8080/
File: input (10)
The Broccoli Plugin: [LESSPlugin] failed with:
undefined

The broccoli plugin was instantiated at: 
    at LESSPlugin.Plugin (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/broccoli-plugin/index.js:10:31)
    at LESSPlugin.CachingWriter [as constructor] (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/broccoli-caching-writer/index.js:21:10)
    at new LESSPlugin (/home/ubuntu/workspace/node_modules/angular-cli/lib/broccoli/angular-broccoli-less.js:21:12)
    at Object.Plugin.build.compile.exports.makeBroccoliTree (/home/ubuntu/workspace/node_modules/angular-cli/lib/broccoli/angular-broccoli-less.js:52:12)
    at Angular2App._buildTree (/home/ubuntu/workspace/node_modules/angular-cli/lib/broccoli/angular2-app.js:133:27)
    at new Angular2App (/home/ubuntu/workspace/node_modules/angular-cli/lib/broccoli/angular2-app.js:53:23)
    at module.exports (/home/ubuntu/workspace/angular-cli-build.js:6:10)
    at Class.module.exports.Task.extend.setupBroccoliBuilder (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/angular-cli/lib/models/builder.js:55:19)
    at Class.module.exports.Task.extend.init (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/angular-cli/lib/models/builder.js:89:10)
    at new Class (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/core-object/core-object.js:18:12)
    at Class.module.exports.Task.extend.run (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/angular-cli/lib/tasks/serve.js:15:19)
    at /home/ubuntu/workspace/node_modules/angular-cli/node_modules/angular-cli/lib/commands/serve.js:64:24
    at lib$rsvp$$internal$$tryCatch (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1036:16)
    at lib$rsvp$$internal$$invokeCallback (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1048:17)
    at /home/ubuntu/workspace/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:331:11
    at lib$rsvp$asap$$flush (/home/ubuntu/workspace/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1198:9)

Which version of angular-cli?

Just forked your repository today. Just to verify, when installing angular-cli globally, the beta-19 version is installed. However, the package.json installs beta-14 locally. Which version should we be using and is the global install necessary?

mobileanalytics resource configuration issue?

Since I'm a total newbie on this kind of programming, the following may be completely unfounded. However, when I attempted to rebuild the code for the us-west-2 region, I discovered a recurring error in the setupAWS function when referencing the mobileanalytics app_ID:

        // Setup mobile analytics
        var options = {
            appId: '32673c035a0b40e99d6e1f327be0cb60',
            appTitle: "aws-cognito-angular2-quickstart"
        };

I didn't think my account would have access to this appid, so I first tried to create my own, but discovered I could not set it up to use the correct identity pool. Then I discovered mobileanalytics was only offered in us-east-1... so I moved everything back to us-east-1 and created a new MA app. The error has gone away, although I confess my understanding of what is going on may be fundamentally flawed.

On a side note I saw the error mentioned above:
Failed to load resource: net::ERR_NAME_NOT_RESOLVED https://mobileanalytics.us-west-2.amazonaws.com/2014-06-05/events

over and over again indicating the code kept retrying, true? Is this an aspect of Angular2?

Oh well, feel free to close this issue... I'm just happy to get some informative clarifications.

Using cognito with typescript

Hi
Is there any official release of cognito node module in typescript?
I would to integrate ths with my ionic 2 project with is angular 2/typescript

Thanks
Sirfak

How to retrieve event.response?

I have a onPostAuthentication lambda function set up and being called on my user pool's post authentication trigger. In this function I set event.response.accessToken = accessToken;

How can I retrieve this token in my Angular 2 single page app when a user logs in?

Thank you!

Robert

Error : Missing credentials in config , when trying to register a new user

Hi,
I am facing an issue with the app when trying to register a new user.
I get the following error :
Missing credentials in config

With my existing user I am able to sign in.

Could you please guide me, what could be the problem ??

Thanks,
Apurva

quickstart is for deprecated Angular2 router

This quickstart code is for the older deprecated version of the Angular2 router. Needs to be updated as in:

https://medium.com/@blacksonic86/upgrading-to-the-new-angular-2-router-255605d9da26#.xq2q4h5da

or similarly

Taking pull requests? Roadmap?

Does this project take pull requests? If so, what is the process? Should I pitch an idea before I implement it to be sure it gets accepted?

Whether yes or no, what is the roadmap for this project? I see small changes occurring, but am worried about falling out of sync if major improvements are in the near future (such as re-architecting to observables).

Edit: also, for example, why the Rekognition link in the readme?

createResources.sh: ROOTNAME format causing problems.

The ROOT_NAME (and thus the BUCKET_NAME) variable have a problem in that if you use camel case (as the author does), then the command (on line 14 of aws\createResources.sh):

aws s3 website s3://$BUCKET_NAME/ --index-document index.html --error-document index.html

Results in this error:

An error occurred (InvalidBucketName) when calling the PutBucketWebsite operation: The specified bucket is not valid.

The fix is to use lowercase (snake-case is ok) for the ROOT_NAME variable (and thus the BUCKET_NAME).

However, if you do use snake-case for the ROOT_NAME, then the this will mess up the IDENTITY_POOL_NAME used in this command (on line 30):

aws cognito-identity create-identity-pool --identity-pool-name $IDENTITY_POOL_NAME --allow-unauthenticated-identities --region $REGION| grep IdentityPoolId | awk '{print $2}' | xargs |sed -e 's/^"//'  -e 's/"$//' -e 's/,$//' > /tmp/poolId

Which results in this error:

An error occurred (ValidationException) when calling the CreateIdentityPool operation: 1 validation error detected: Value 'dev-day2' at 'identityPoolName' failed to satisfy constraint: Member must satisfy regular expression pattern: [\w ]+

The fix is to assign a whole new value to $IDENTITY_POOL_NAME that uses either CamelCase or underscore_case to separate the words.

In order to get the script to run properly, I have the variables set as so:

ROOT_NAME=dev-day2
BUCKET_NAME=user-$ROOT_NAME
TABLE_NAME=login-trail-$ROOT_NAME
ROLE_NAME_PREFIX=$ROOT_NAME
POOL_NAME=$ROOT_NAME
IDENTITY_POOL_NAME=dev_day2
REGION=us-east-1

I'm running aws-cli version : aws-cli/1.11.11 Python/2.7.6 Linux/4.2.0-c9 botocore/1.4.68

Can anyone confirm?

Bower install is broken.

bower startbootstrap-sb-admin-2#1.0.8                ENORESTARGET No tag found that was able to satisfy 1.0.8

Additional error details:
No versions found in https://github.com/IronSummitMedia/startbootstrap-sb-admin-2.git

Due to broken bootstrap theme dependency as described here:

https://github.com/ironsummitmedia/startbootstrap-sb-admin-2/issues/1

FYI, I used golovchanskiy's temporary workaround to point to the proper repo. Just update the bower.json as so:

"startbootstrap-sb-admin-2": "https://github.com/BlackrockDigital/startbootstrap-sb-admin-2.git#master",

Bower install is working, still need to test the demo.

When do the session expire?

Quick question: Is the session ever expire? I have read that it should happen after one hour, however it looks like session.isValid() is always true. Is there an extra step needed somewhere?

Specify aws credentials account

I have many accounts in my ~/.aws/credentials file , is possibile to launch createResource.sh specifying which aws account to use?

Token refresh

After one hour of inactivity token expires causing errors when trying to access DB. User has to refresh page to fix that.
I think this should be handled better.

n.update is not a function

Hi am getting "n.update is not a function"
any idea what it means ?

sjcl, paranoia and entropy

https://github.com/aws/amazon-cognito-identity-js/#random-numbers

The amazon-cognito-identity-js mentions using a paranoia of greater than 0 and calling startCollectors() on the sjcl library to provide entropy for older browser and mobile os'.

Any reason why it was not done within this quick start?

Unauthenticated cognito support

First thanks for posting this repo, nice starting point and great job!

I'm completely new on this kind of architecture, and I'm wondering which is the best way to implement Unauthenticated cognito access into this project. I'm trying to implement it on the UserLogin service but I'm missing something.

Can you provide some example code for this use case?

an example that invokes a lambda

Hi

I'm trying to change the example to call lambda instead of writing to ddb (pretty much at the same spot in code), and unfortunately i get this error:

Unable to call lambda. Error JSON: {
  "message": "Missing credentials in config",
  "code": "CredentialsError",
  "time": "2017-01-04T02:19:56.970Z",
  "originalError": {
    "message": "No credentials to load",
    "code": "CredentialsError",
    "time": "2017-01-04T02:19:56.970Z"
  }
}

It would be great if someone could add a working example of calling a lambda

Thanks!

EDIT: oh an btw, the original example functionality works just fine and it creates DDB records on each login

createResources.sh fails if aws cli not configured for json output

"text" output result for this command is values for AllowUnauthenticatedIdentities, IdentityPoolId and IdentityPoolName with no labels, separated by tab.

Why not add npm bootstrap dependancy?

Would make it easier to upgrade or change version. Also would be nice to see the AWS SDK's as part of npm.

getCognitoIdentity returns null

Hi,
I can perform all the tasks like login, create user or access resources.
but when I try to get getCognitoIdentity it returns null.
this is what I was trying to get the cognito Id "CognitoUtil.getCognitoIdentity()"
but it returns null.

because of this I cannot Fine-Grained Access Control on dynamodb.

Couldn't get session

Hi,
I am getting below error
Couldn't get the session: CredentialsError: Missing credentials in config CredentialsError: Missing credentials in config
after login I can call AWS resource fine but after some time I guess 1hr or so, I get above error.
looks like session is getting expired how do I handle it ? or what does above error means ?
once I re-login error goes away, but token expired is set to 30 days in AWS and then why is it getting expired in short time.

Cannot read property 'length' of undefined

I'm getting the following error, any idea what might be causing it?

> npm start

> [email protected] start /Users/xxxxx/Scripts/Angular/aws-cognito-angular2-quickstart
> ng server


It seems like you're using the newest version of the Angular CLI that uses webpack.
This version does not require an angular-cli-build file, but your project has one.
It will be ignored.

Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
The "defaults.prefix" and "defaults.sourceDir" properties of angular-cli.json are deprecated in favor of "apps[0].root" and "apps[0].prefix". Please update in order to avoid errors in future versions of angular-cli.
The "defaults.prefix" and "defaults.sourceDir" properties of angular-cli.json are deprecated in favor of "apps[0].root" and "apps[0].prefix". Please update in order to avoid errors in future versions of angular-cli.
Cannot read property 'length' of undefined
TypeError: Cannot read property 'length' of undefined
    at Object.getWebpackCommonConfig (/Users/xxxxxx/Scripts/Angular/aws-cognito-angular2-quickstart/node_modules/angular-cli/models/webpack-build-common.js:20:25)
    at new NgCliWebpackConfig (/Users/xxxxxx/Scripts/Angular/aws-cognito-angular2-quickstart/node_modules/angular-cli/models/webpack-config.js:15:29)
    at Class.run (/Users/xxxxxx/Scripts/Angular/aws-cognito-angular2-quickstart/node_modules/angular-cli/tasks/serve-webpack.js:19:22)
    at /Users/xxxxxx/Scripts/Angular/aws-cognito-angular2-quickstart/node_modules/angular-cli/commands/serve.js:85:26
    at process._tickCallback (internal/process/next_tick.js:103:7)

npm ERR! Darwin 15.6.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v6.8.0
npm ERR! npm  v3.10.8
npm ERR! code ELIFECYCLE
npm ERR! [email protected] start: `ng server`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script 'ng server'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the aws-cognito-angular2-quickstart package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     ng server
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs aws-cognito-angular2-quickstart
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls aws-cognito-angular2-quickstart
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/xxxxxx/Scripts/Angular/aws-cognito-angular2-quickstart/npm-debug.log

npm start does not work for me

I just tried out getting a local copy of your quickstart. I ran into some problems. The install went fine but when I ran npm start I got errors. I have attached the npm.debug.log. Do you have any ideas why it does not start?

Attached you can find the output of the log.

issue on npm start

I'm having a issue when i try the npm start command.
And, when I run ng serve command occurs the below error:

Version of @angular/compiler-cli needs to be 2.3.1 or greater. Current version is "undefined".

[question] why not used AWS.config.credentials.clearCachedId() before login

if I understand correctly, you use AWSCognito.config.update({accessKeyId: 'anything', secretAccessKey: 'anything'}); (here https://github.com/awslabs/aws-cognito-angular2-quickstart/blob/master/src/app/service/cognito.service.ts#L220 )
to reset credential before re login ?

why not used AWS.config.credentials.clearCachedId() ?

thank you

How to make Lambda call through API services using credentials received from Cognito?

Thanks for the quickstart. It works very nicely. Now that my users can sign up and log in, I want them to be able to perform functions in my web app that call Lambda functions through the API gateway. I know that goes beyond the scope of this quickstart, but having secure access to "something" is I guess the point of Cognito. I know how to write Lambda functions. I am using one to do some work when during the pre-signup. But I want to be able to call an API gateway that is secured by this app which calls a Lambda and returns it's result to the web app. Thank you.

JWT API gateway getting "not a valid key=value pair (missing equal-sign) in Authorization header"

My scenario is a simple API gateway to talk to DDB. Cognito is use to authenticate users. With authorization disable, everything works fine.

I use this quick start to get a JWT token and connect to my user pool. That works fine. The ID token can be verified with API Gateway Authorizer. But if I use the token to "curl -H "Authorizer Bearer [token]" for a simple GET, I am getting:

{message: "...not a valid key=value pair (missing equal-sign) in Authorization header..."

Questions are in a few folds:

1. some forums vaguely indicate that being an issue with CloudFront handling http header and it is not a feature supported by CF - that can not be true, can it - it is a simple common use case?
2. interestingly, if I use the api gateway builtin "Test", (Request Method being set with Authorizer), it seems that the test is not going through the Cognito Authorizer - i.e. without passing the token, I am still getting the 200 response. Why is that?
3. which JWT token (access or id) should be used for Cognito?

Unexpected token { When npm start

Could you please help me with this?

Unexpected token {
SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:404:25)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Object. (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/@ngtools/webpack/src/index.js:5:10)
at Module._compile (module.js:425:26)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Object. (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/models/webpack-build-typescript.js:5:17)
at Module._compile (module.js:425:26)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Object. (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/models/webpack-config.js:2:34)
at Module._compile (module.js:425:26)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Object. (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/tasks/build-webpack.js:6:24)
at Module._compile (module.js:425:26)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Object. (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/commands/build.js:3:23)
at Module._compile (module.js:425:26)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Class.module.exports.includedCommands (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/addon/index.js:21:16)
at /Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/angular-cli/lib/models/project.js:392:61
at Array.forEach (native)
at Project.addonCommands (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/angular-cli/lib/models/project.js:391:15)
at Project.eachAddonCommand (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/angular-cli/lib/models/project.js:426:30)
at module.exports (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/angular-cli/lib/cli/lookup-command.js:33:13)
at CLI. (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/angular-cli/angular-cli/lib/cli/cli.js:34:26)
at tryCatch (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/rsvp/dist/rsvp.js:538:12)
at invokeCallback (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/rsvp/dist/rsvp.js:553:13)
at publish (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/rsvp/dist/rsvp.js:521:7)
at flush (/Users/Ran/Programming/Asiawarehouse/AWSCognitoAngularTest/aws-cognito-angular2-quickstart/node_modules/rsvp/dist/rsvp.js:2373:5)
at doNTCallback0 (node.js:428:9)
at process._tickCallback (node.js:357:13)

How to use aws.s3 in nativescript?

I want to store data at aws.s3 in nativescript. But i didn't get any plugin for that.

have any one done that except using nativescript-aws??

please help me. I need it urgently

[feature request] gitter room for the repo?

Would be helpful for newcomers to AWS.

Cannot read property 'CognitoUserAttribute' of undefined

Hi guys. This is probably not an issue with this repo, but I wanted to contact you.

I have an Angular CLI app and I'm adding Cognito signup/login based on this project. However, I keep getting this error:

TypeError: Cannot read property 'CognitoUserAttribute' of undefined at UserRegistrationService

I do not know what I'm missing!

I have all the .js in assets/js folder

And I have added al the scripts in the index.

Thanks in advance for the help

Cannot find module 'exists-sync'

I'm getting below error when I run "npm start". I'm running this in Windows 7 and only step that I didn't follow is creating the AWS resources by running the shell script.

---

C:\Users\ABCD\Desktop\Capital Cranes\aws-cognito-angular2-quickstart-master>npm start

[email protected] start C:\Users\ABCD\Desktop\Capital Cranes\aws-cognito-angular2-quickstart-master
ng server

module.js:327
throw err;
^

Error: Cannot find module 'exists-sync'
at Function.Module._resolveFilename (module.js:325:15)
at Function.Module._load (module.js:276:25)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object. (C:\Users\ABCD\Desktop\Capital Cranes\aws-cognito-angular2-quickstart-master\node_modules\angular-cli\node_modules\ember-cli\lib\models\project.js:11:26)
at Module._compile (module.js:409:26)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)

npm ERR! Windows_NT 6.1.7601
npm ERR! argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "start"
npm ERR! node v4.4.5
npm ERR! npm v2.15.5
npm ERR! code ELIFECYCLE
npm ERR! [email protected] start: ng server
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script 'ng server'.
npm ERR! This is most likely a problem with the aws-cognito-angular2-quickstart package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! ng server
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs aws-cognito-angular2-quickstart
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!
npm ERR! npm owner ls aws-cognito-angular2-quickstart
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\ABCD\Desktop\Capital Cranes\aws-cognito-angular2-quickstart-master\npm-debug.log

C:\Users\ABCD\Desktop\Capital Cranes\aws-cognito-angular2-quickstart-master>

Security Question

Quick Question on security wrt ddb tables. The current code grants permission to the authenticated user to access dynamodb tables - read/write/delete. Since all users are logging their activity into the same table, how are they prevented from seeing/accessing data activity from other users?

I understand the app only queries based on the user, however, it seems like there is an opportunity rewrite the script or perhaps hijack the access token to access the entire table and thus all user activity.

I'm no security expert so simple answers suffice. :)

why is the UserLoginService used static

Hi,
I'm just browsing through the code but do not fully understand why the UserLoginService is used with static methods and importing it instead of injecting a instance via the constructor?