The following snippet of code computes the size of files located at url on my local system using Javascript

//returns file size given a URL
function getFileSize(url, key)
{
    var fileSize = '';
    var http = new XMLHttpRequest();
    http.open('HEAD', url, false);

    http.onreadystatechange = function() {
        if (this.readyState == this.DONE) {
            if (this.status == 200) {
                fileSize = this.getResponseHeader('content-length');

                //saves size in dictionary sizes
                sizes[key] = fileSize;
             }
        }
  };
  http.send();
}

When I deploy the code to my Apache server, however, this.getResponseHeader returns null, although the provided url correctly points to a file. I am considering different options for why this is the case (e.g., incorrect file permissions) but haven't found a solution yet. I also followed this link to change my server configuration to allow CORS but that didn't help. Any help would be greatly appreciated.