<body>
<h1>Response Headers</h1>

<b>URL</b> <input type=text id=url size=70 value='https://workshop.sps.nyu.edu/~sultans'>
           <input type=submit value="  GET  "  onClick=getResponseHeaders()>
<br><br>
<div id=output></div>

<script>
//=====================================================================================================
// getResponseHeaders: Obtains all HTTP response headers by performing a re-request of current page
//                     Returns all the headers as an object 
//=====================================================================================================
function getResponseHeaders()
{
    var url = document.getElementById('url').value;

    var reqObj = new XMLHttpRequest();
    reqObj.open('HEAD',url,false);                      //use HEAD, no need to perform GET or POST
                                                        //re-request the current URL 
    reqObj.send(null);

    var headersStr   = reqObj.getAllResponseHeaders();
    var headersArray = headersStr.split('\n');

    var headers = {};                                   //create an object

    for (i=0; i<headersArray.length-1; i++)             //loop thru all the headers
    {
        var nameValue = headersArray[i];
        var name      = nameValue.split(': ')[0];       //split, and take element 0
        var value     = nameValue.split(': ')[1];       //split, and take element 1
        headers[name] = value;                          //add to the headers object
    }

//  alert(reqObj.responseText);                         //only requesting HEAD

    var output = '<b>Status = </b>'+ reqObj.status +' '+ reqObj.statusText +'<br><br>';

    for (name in headers)
        output += '<b>'+ name +' = </b>'+ headers[name] +'<br>';

    document.getElementById('output').innerHTML = output;
}
</script>
</body>
</html>