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

Question

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.)

JB Nizet · Accepted Answer · 2015-10-31 16:13:37Z

5

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 }

edited Oct 31, 2015 at 16:13

answered Oct 31, 2015 at 16:08

JB Nizet

694k94 gold badges1.3k silver badges1.3k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Chris Over a year ago

Argh... And I thought it wouldn't work! 1 hour wasted. Thanks a lot for your answer!

rubmz Over a year ago

File is at: <project>\node_modules\aws-sdk\.jshintrc

aarjithn · Accepted Answer · 2015-10-31 16:07:54Z

1

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
}

answered Oct 31, 2015 at 16:07

aarjithn

1,19110 silver badges20 bronze badges

Comments

akash vaghani · Accepted Answer · 2019-05-16 08:52:53Z

0

'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>

edited May 16, 2019 at 8:52

answered May 16, 2019 at 6:49

akash vaghani

11 bronze badge

Collectives™ on Stack Overflow

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

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related