TypeError: Cannot read property 'byteLength' of undefined - AWS S3 Upload

Question

I'm working on an aws s3 photo upload from a react client and I'm experiencing the following error:

TypeError: Cannot read property 'byteLength' of undefined

I'm assuming there's a flaw in the upload object, but I believe there might be something wrong with the s3/cognito configuration because I receive the same error when I invoked s3.listObjects. I'm following these docs - https://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/s3-example-photo-album-full.html

Any thoughts?

uploadPhoto() {
        const files = document.getElementById("photoUpload").files;
        if (!files.length) {
          return alert("Please choose a file to upload first.");
        }
        const file = files[0];
        const fileName = file.name;
        const albumPhotosKey = encodeURIComponent('screenshots') + "/";
      
        const photoKey = albumPhotosKey + fileName;
        
        // Use S3 ManagedUpload class as it supports multipart uploads
        
        const upload = new AWS.S3.ManagedUpload({
            params: {
              Bucket: <Bucket Name>,
              Key: fileName,
              Body: file
            }
          });

        const promise = upload.promise();
      
        promise.then(
          function(data) {
            alert("Successfully uploaded photo.");
            console.log('UPLOAD: ', data)
          },
          function(err) {
              console.log('ERROR: ', err)
            // return alert("There was an error uploading your photo: ", err.message);
          }
        );
      }

Answer 1

I got this error in a React Native app. I was able to fix it by turning off my Dev Tools network inspector.

Answer 2

I've run the example as described in the docs and it works, so can't reproduce your err. Here's a couple of things to check:

• Try passing your accesskey and secret into your config object (although I don't recommend this for security reasons, it might indicate where the issue is):

AWSService.config.update({
    region: region,
    accessKeyId: accessKeyId,
    secretKey: secretAccessKey,
    credentials: new AWSService.CognitoIdentityCredentials({
    IdentityPoolId: identityPoolId
    })
});

• Confirm your your Cognito Identity Pool ID has an IAM policy attached with the following:

    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "s3:DeleteObject",
                "s3:GetObject",
                "s3:ListBucket",
                "s3:PutObject"
            ],
            "Resource": [
                "arn:aws:s3:::BUCKET_NAME",
                "arn:aws:s3:::BUCKET_NAME/*"
            ]
        }
    ]
}

Answer 3

Just in case! Check that your credentials are configured and passed right. And that you have the privileges for the resource in IAM.

I had the error above because i forget to pass the access credentials. It went away once i put them in.