Add S3 call to the fiddle

  1. Back to your fiddle and add the html layout below
<div id="accesss3" class="w3-container w3-padding-large w3-grey tab" style="display:none">
  <input class="w3-input w3-border" type="text" id="bucket_name" value="abac-bucket-1">
  <input class="w3-input w3-border" type="text" id="prefix" value="Engineering"><br>
  <button type="submit" class="w3-button w3-black w3-margin-bottom" onclick="listFiles()">List files</button>
  <pre class="" id="s3files"></pre>
  1. Add javascript function below. Replace the following in the code below:
 * List files in S3 bucket
 * 1. Identity pool created and configured to use user pool as idp
 * 2. Permissions defined on the iam role to allow s3 list
 * 3. Bucket created with proper x-origin policy to allow calls
function listFiles(){


  AWS.config.region = 'REGION';
  AWS.config.credentials = new AWS.CognitoIdentityCredentials({
      IdentityPoolId: 'IDENTITY-POOL-ID',
      Logins: {
          '': cognitoUser.signInUserSession.idToken.jwtToken

  // Make the call to obtain credentials

    // Credentials will be available when this function is called.
    var accessKeyId = AWS.config.credentials.accessKeyId;
    var secretAccessKey = AWS.config.credentials.secretAccessKey;
    var sessionToken = AWS.config.credentials.sessionToken;

    var s3 = new AWS.S3();
    var params = {
    	Bucket: $("#bucket_name").val(),
      Prefix: $("#prefix").val()
    s3.listObjects(params, function(err, data) {
      if (err) console.log(err, err.stack); // an error occurred
        $("#s3files").html('<b>Response</b><br>'+JSON.stringify(data.Contents,['Key'], 2)); // successful response
  1. Now you can test accessing S3 with the temporary credentials returned from Cognito

Note: That call to get AWS temporary credentials and the returned values from Cognito. That user can list all files and sub-directories under the bucket.