利用js-xlsx.js外掛實現Excel檔案匯入並解析Excel資料成json資料格式
阿新 • • 發佈：2018-11-04
<!--本文轉載於網路，有太多一樣的文章，不知道原作者是哪位了，就不註明出處了。這裡記載下來，用於自己的學習借鑑-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS程式碼訪問excel資料，改為json格式的資料</title>
<!--利用js-xlsx實現Excel檔案匯入並解析Excel資料成json格式的資料-->
</head>
<!--<script src="http://oss.sheetjs.com/js-xlsx/.full.min.js"></script>-->
<!--<script src="https://github.com/SheetJS/js-xlsx.js"></script>-->
<!--外部連結的JS地址真心不靠譜，經常無法訪問，這裡的js外掛還是自己下載到本地pc上或者部署到伺服器上吧-->
<!--外掛的下載地址：https://github.com/SheetJS/js-xlsx -->
<script src="./js/xlsx.full.min.js"></script>
<body>
<input type="file" onchange="importExcel(this)" />
<div id="output"></div>
<script>
// FileReader共有4種讀取方法：
// 1.readAsArrayBuffer(file)：將檔案讀取為ArrayBuffer。
// 2.readAsBinaryString(file)：將檔案讀取為二進位制字串
// 3.readAsDataURL(file)：將檔案讀取為Data URL
// 4.readAsText(file, [encoding])：將檔案讀取為文字，encoding預設值為'UTF-8'
var wb;//讀取完成的資料
var aa=[];
var text=[];
var rABS = false; //是否將檔案讀取為二進位制字串
function importExcel(obj) {//匯入
if(!obj.files) {
return;
}
const IMPORTFILE_MAXSIZE = 1*2048;//這裡可以自定義控制匯入檔案大小
var suffix = obj.files[0].name.split(".")[1];
if(suffix != 'xls' && suffix !='xlsx'){
alert('匯入的檔案格式不正確!');
return
}
if(obj.files[0].size/1024 > IMPORTFILE_MAXSIZE){
alert('匯入的表格檔案不能大於2M');
return
}
var f = obj.files[0];
var reader = new FileReader();
reader.onload = function(e) {
var data = e.target.result;
if(rABS) {
wb = XLSX.read(btoa(fixdata(data)), {//手動轉化
type: 'base64'
});
} else {
wb = XLSX.read(data, {
type: 'binary'
});
}
//wb.SheetNames[0]是獲取Sheets中第一個Sheet的名字
//wb.Sheets[Sheet名]獲取第一個Sheet的資料
aa = JSON.stringify( XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) );
// console.log(aa);
// 這裡的aa就是我想要的json陣列
var u = eval('('+aa+')');
// 將json陣列顯示到div的innerHTML中
document.getElementById("output").innerHTML= JSON.stringify( XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) );
//獲取表格中為address的那列存入text中
for(var i=0;i<u.length;i++){
text.push(u[i].address);
}
};
if(rABS) {
reader.readAsArrayBuffer(f);
} else {
reader.readAsBinaryString(f);
// reader.readAsText(f, "UTF-8")
}
}
</script>
其實我是想使用這個demo，改寫程式碼達到自己的需求，可惜知識面太窄，沒有修改成功。上述程式碼中的aa即為我想要的JSON資料。
我想改寫importExcel(obj)這個函式，把檔案的路徑寫死，不用<input type="file" onchange="importExcel(this)"/>匯入檔案，
執行函式importExcel(url)就把本地的excel轉換成json,不需要互動過程。還請貼吧大神支招。後續得到解決方案後，我會繼續更新這篇文章。