JSFiddle - React, Tailwind, and code Playground

by russau

HTML

<script src="https://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/hmac-sha256.js"></script>
<script src="https://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/sha256.js"></script>

JavaScript

/*
 *  Return a date string as yyyymmddThhmmssZ
 *  in UTC.
 *  Use supplied date object or, if no
 *  object supplied, return current time 
 * http://stackoverflow.com/questions/5661487/converting-date-time-to-rfc3339-format-using-either-jquery-or-java-script
 */
var dateToUTCString = (function () {

  // Add leading zero to single digit numbers
  function addZ(n) {
    return (n<10)?'0'+n:''+n;
  }

  return function(d) {

    // If d not supplied, use current date
    var d = d || new Date();

    return d.getUTCFullYear() + 
           addZ(d.getUTCMonth() + 1) + 
           addZ(d.getUTCDate()) +
           'T' + 
           addZ(d.getUTCHours()) + 
           addZ(d.getUTCMinutes()) + 
           addZ(d.getUTCSeconds()) +
           'Z';
  }
}());



var datetime = dateToUTCString();
var date = datetime.substring(0, 8);
var region = 'us-east-1';
var service = 'iam'; // 's3';
var payload = "Action=ListUsers&Version=2010-05-08";


var HTTPRequestMethod = "POST" //"GET";
var CanonicalURI = '/';
var CanonicalQueryString = ""; // todo - create canonical querystring
var endpoint = "https://iam.amazonaws.com";
var parser = document.createElement('a');
parser.href = endpoint;

var headers =  new Object();
headers['Host'] =  parser.hostname;
headers['X-Amz-Date'] =  datetime;
//headers['X-Amz-Content-Sha256'] =  CryptoJS.SHA256("").toString(CryptoJS.enc.Hex);


    var keys = [];
    for(var key in headers)
    {
        keys.push(key);
    }
    keys.sort();
    
    var CanonicalHeaders = '';
    for (var i=0; i<keys.length; i++)
    {
        key = keys[i];
        var canonicalValue = headers[key];
        canonicalValue = canonicalValue.trim() + '\n';
        // TODO remove repeating white spaces, unless in quotes
        CanonicalHeaders += key.toLowerCase() + ":" + canonicalValue;
    }


var SignedHeaders = 'host;x-amz-date'; //shouldn't be hardcoded! ;x-amz-content-sha256
var hashPayload = CryptoJS.SHA256(payload);

CanonicalRequest =
  HTTPRequestMethod +...