Convert Excel to JSON using JavaScript code

Hello friends, in this javascript tutorial we are going to learn about how to Convert Excel to JSON using JavaScript code. We can read an excel file which is hosted on any server, sharepoint folder, etc with the help of jQuery code. Here you can get readymade pure javascript code for Excel to JSON conversion.

Excel to JSON

Convert Excel to JSON using JavaScript Code

In this tutorial, we are going to use js-xlsx plugin to convert Excel to JSON. It has xlsx.full.min.js file which we are going to refer in our HTML file. js-xlsx is a parser and writer for various spreadsheet formats. So without wasting time lets jump to coding part.

Below is a code for reading Excel as a JSON object:

<!doctype html>
<html>
<head>
<title>Excel to JSON Demo</title>
<script src="xlsx.full.min.js"></script>
</head>
<body>

<script>
/* set up XMLHttpRequest */
var url = "http://myclassbook.org/wp-content/uploads/2017/12/Test.xlsx";
var oReq = new XMLHttpRequest();
oReq.open("GET", url, true);
oReq.responseType = "arraybuffer";

oReq.onload = function(e) {
 var arraybuffer = oReq.response;

/* convert data to binary string */
 var data = new Uint8Array(arraybuffer);
 var arr = new Array();
 for(var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
 var bstr = arr.join("");

/* Call XLSX */
 var workbook = XLSX.read(bstr, {type:"binary"});

/* DO SOMETHING WITH workbook HERE */
 var first_sheet_name = workbook.SheetNames[0];
 /* Get worksheet */
 var worksheet = workbook.Sheets[first_sheet_name];
 console.log(XLSX.utils.sheet_to_json(worksheet,{raw:true}));
}

oReq.send();
</script>
</body>
</html>

In the above code, if you could observe, you will find that we have used xlsx.full.min.js file and a Test.xlsx file. We are going to read Test.xlsx Excel file to generate a JSON Object.

Note: While using above code make sure that you have uploaded your Excel file on any server and give the correct full path of that file.

Here is our Test.xlsx file which looks like below

Output

When you host your index.html file on the server, on the page load we are running our script to show the objects in the browser console. Below is the output in JSON object

JSON Object output
JSON Object output

Download Excel to JSON javascript

You can use any one of the links to download the source code

  1. MyClassBook: Downlaod
  2. Google Drive: Download
  3. MediaFire: Download

I hope you liked this article. Please let us know if you face any issues in the comment sections below. Like our facebook page and subscribe to our newsletter for future updates. Have a great time! 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *