Amazon DynamoDB和AngularJS

Question

So, I created an AWS dynamoDB table (database) and I am ready to get that data with AngularJS. How do I do this with AngularJS? Do I need to setup another service with Amazon? Or can I access my database directly?

I was unable to find anything related to DynamoDB and AngularJS directly. Any help would be greatly appreciated!

Answer 1

While the Mars JSON demo is excellent, here's a really simple example to get started that uses AWS SDK for JavaScript v2.1.33. Switch out the keys for your own. This is a demo only, don't hardcode secret keys, may use AWS Cognito instead. Review the screenshots for several AWS gotcha's.

https://github.com/mayosmith/HelloDynamoDB

/*
-----------------------------------------------------------------
AWS configure
Note: this is a simple experiement for demonstration
purposes only. Replace the keys below with your own.
Do not include the secret key in an actual production
environment, because, then, it wont be secret anymore...
-----------------------------------------------------------------
*/
AWS.config.update({accessKeyId: 'AKIAJUPWRIYYQGDB6AFA', secretAccessKey: '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'});
// Configure the region
AWS.config.region = 'us-west-2';  //us-west-2 is Oregon
//create the ddb object
var ddb = new AWS.DynamoDB();
/*
-----------------------------------------------------------------
Update the Table
-----------------------------------------------------------------
*/
//update the table with this data
var params = {
  Key: {
    name: {S: 'John Mayo-Smith'},
    city: {S: 'New York'}
  },
  AttributeUpdates: {
    food: {
      Action: 'PUT',
      Value: {S: 'chocolate'}
    }
  },
  TableName: 'sampletable',
  ReturnValues: 'ALL_NEW'
};
//update the table
update();
/*
-----------------------------------------------------------------
Get Item from the Table
-----------------------------------------------------------------
*/
//attribute to read
var readparams = {

  Key: {
    name: {S: 'John Mayo-Smith'},
    city: {S: 'New York'}
  },
  AttributesToGet: ['food'],
  TableName: 'sampletable'
};
//get the item
read();
/*
-----------------------------------------------------------------
function update()
Description: Calls updateItem which is part of the AWS Javascript
SDK.
Returns: JSON object (the object is stringifyed so we can see 
what's going on in the javascript console)
-----------------------------------------------------------------
*/
function update(){
    ddb.updateItem(params, function(err, data) {
        if (err) { return console.log(err); }
        console.log("We updated the table with this: " + JSON.stringify(data));
    });
}
/*
-----------------------------------------------------------------
function read()
Description: Calls getItem which is part of the AWS Javascript
SDK.
Returns: JSON object (the object is stringifyed so we can see 
what's going on in the javascript console)
-----------------------------------------------------------------
*/
function read(){
    ddb.getItem(readparams, function(err, data) {
        if (err) { return console.log(err); }
        console.log(": " + data);       

    console.log("John's favorite food is: "+ JSON.stringify(data.Item.food.S)); // print the item data
});
}

Answer 2

Yes, you can access Amazon DynamoDB directly from your AngularJS application using the AWS JavaScript SDK for the Browser. The same code snippet should work for NodeJS as well.

One thing to note is that your application needs to securely authenticate to AWS without embedding security credentials in the code. Amazon Cognito makes it easy and automatically takes care of authentication if you have created an identity pool and configure your application accordingly. Here are some links that will help you get started. We built a demo application with AngularJS on Amazon DynamoDB. It uses Amazon Cognito for authentication and the Document SDK to store and retrieve JSON objects to and from DynamoDB directly, without needing to serialize and deserialize them in client code in the browser.

Source code: https://github.com/awslabs/aws-dynamodb-mars-json-demo

Live demo: http://dynamodb-msl-image-explorer.s3-website-us-east-1.amazonaws.com/

examples of using the AWS library: https://github.com/awslabs/aws-dynamodb-mars-json-demo/blob/master/viewer/app/scripts/services/mars-photos.js

examples of using the service that is using the AWS library: https://github.com/awslabs/aws-dynamodb-mars-json-demo/blob/master/viewer/app/scripts/controllers/favorites.js

https://github.com/awslabs/aws-dynamodb-mars-json-demo/blob/master/viewer/app/scripts/controllers/top-voted.js

Document SDK: https://github.com/awslabs/dynamodb-document-js-sdk