AngularJS

on Cloud

AngularConf 2015

Who am I?

Gianluca Arbezzano

@gianarb

I'm here to protect you

Software Engineer @CorleyCloud

Great!

The mission:

build an application managed by AWS

to avoid sysadmin

Security Issues

Cognito identity

in AngularJS

// app/app.js
.config([function() {
  var creds = new AWS.CognitoIdentityCredentials({
    IdentityPoolId: 'us-east-1:0000000000000008c3c-5397a17ad174'
  });
  AWS.config.update({
    region: 'us-east-1',
    credentials: creds
  });
}]);
                    

in AngularJS

in AngularJS

.directive('googleSignin', function() {
  return {
    restrict: 'A',
    template: '<span id="signinButton"></span>',
    replace: true,
    scope: {
      afterSignin: '&'
    },
    link: function(scope, ele, attrs) {
        //  see ng-newsletter.com/posts/aws-js-sdk.html
    }
  };
})

                    

in AngularJS

// app/view/view.tpl.html
<p>This is the partial for view 1.</p>
<h2>Signin to ngroad</h2>

<div google-signin
  client-id='3818201'
  after-signin="signedIn(oauth)" data-user="user"></div>
<pre>{{ user | json }}</pre>
                    

in AngularJS

$scope.signedIn = function(oauth) {
    var creds = {
      params: {}
    };
    $scope.user = oauth;
    creds = AWS.config.credentials;
    creds.params.Logins = {};
    creds.params.Logins['accounts.google.com'] = oauth.id_token;
    AWS.config.update({
      credentials: creds
    });
    AWS.config.credentials.refresh(function(err){
      if (err) {
        console.log(err);
      }
    });
  };

Chamber of Secrets was open

in AngularJS

DynamoDB

is a fully managed NoSQL database service that erovides fast and predictable performance with seamless scalability

in AngularJS

in AngularJS

in AngularJS

<p>This is the partial for view 1.</p>
<h2>Signin to ngroad</h2>

<div google-signin
  client-id='38182010900-e5l22mddk7oliohktn747trqgsfau1rd'
  after-signin="signedIn(oauth)" data-user="user"></div>
<pre>{{ user | json }}</pre>

<form ng-submit="send(item)">
<input ng-model="item.title">
<button type="submit">Save</button>
</form>
                    

in AngularJS

$scope.send = function(item) {
    AWS.config.getCredentials(function(){
      var dynamodb = new AWS.DynamoDB({apiVersion: '2012-08-10'});
      dynamodb.putItem({
        Item: {
          "title": {"S": item.title}
        },
        TableName: "angular-conf"
      }, function(err, data) {
        if(err) { throw err; }
      });
    });
};
                    

DynamoDB

DynamoDB

working on your data

working on your data

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "dynamodb:GetItem",
                "dynamodb:PutItem",
                "dynamodb:UpdateItem",
                "dynamodb:DeleteItem"
            ],
            "Resource": ["arn:aws:dynamodb:us-west-2::table/GameScores"],
            "Condition": {
                "ForAllValues:StringEquals": {
                    "dynamodb:LeadingKeys": ["${www.amazon.com:user_id}"]}
            }
        }
    ]
}

Other AWS services

SQS

S3

Cognito Sync

Thanks