Chris
Chris

Reputation: 8020

'AWS is not defined' when using aws-sdk-js in angular

Following this tutorial, implementing the AWS sdk with angular, I'm getting AWS is not defined from jshint (using grunt to serve the app).

I've installed the sdk with bower install aws-sdk-js --save, and it correctly appears in my index.html file.

This is my controller:

angular.module('myApp')
.controller('S3uploadCtrl', function ($scope) {

  console.log(AWS);
  $scope.creds = {
    bucket: 'myBucket',
    accessKey: 'accKey',
    secretKey: 'secKey'
  };

  $scope.upload = function() {
    // Configure The S3 Object
    AWS.config.update({ accessKeyId: $scope.creds.accessKey, secretAccessKey: $scope.creds.secretKey });
    AWS.config.region = 'us-west-2';
    var bucket = new AWS.S3({ params: { Bucket: $scope.creds.bucket } });

    if($scope.file) {
      var params = { Key: $scope.file.name, ContentType: $scope.file.type, Body: $scope.file, ServerSideEncryption: 'AES256' };

      bucket.putObject(params, function(err, data) {
        if(err) {
          // There Was An Error With Your S3 Config
          alert(err.message);
          return false;
        }
        else {
          // Success!
          alert('Upload Done');
        }
      })
      .on('httpUploadProgress',function(progress) {
        // Log Progress Information
        console.log(Math.round(progress.loaded / progress.total * 100) + '% done');
      });
    }
    else {
      // No File Selected
      alert('No File Selected');
    }
  };
  function alert(msg) {
    console.alert(msg);
  }
});

There isn't much about this on google. I found one other SO question which I've tried to follow to no avail. (changed the order of my <script> tags etc.)

Upvotes: 3

Views: 4624

Answers (3)

akash vaghani
akash vaghani

Reputation: 1

'AWS is not defined' this error occurs when you forgot to define js , After "bower install aws-sdk-js" you need to define "aws-sdk.min.js" and "aws-sdk.js" to your index.html in script tag like

<script src="bower_components/aws-sdk/dist/aws-sdk.min.js"></script> <script src="bower_components/aws-sdk/dist/aws-sdk.js"></script>

Upvotes: 0

JB Nizet
JB Nizet

Reputation: 691735

It's a JSHint error. JSHint makes sure you're accessing defined variables, and has no idea that an AWS global variable exists et runtime. So you need to tell JSHint that this globa variable exists and that you allow your code to access this global variable (although you probably should hide it behind an angular service, to make your code testable).

Edit your .jshintrc file (it might have another name: check your build configuration), and add (or modify) the following rule:

"globals": { "AWS" : false }

Upvotes: 5

aarjithn
aarjithn

Reputation: 1181

If you are just getting a JSHint error, it might be because AWS is not recognised as a variable. Create a .jshintrc file in the root of your project, and put this config in it:

"globals": {
    "AWS": false
}

Upvotes: 1

Related Questions