Javascript Vue.js excel到json

我试图用vue.js读取excel文件，但一旦我读取该文件，内存就会像5 gb ram一样急剧膨胀，我发现excel文件非常小，请帮助将该文件转换为json 处理excel文件的vue方法我尝试了在中看到的所有类型选项，但都向我发送了不同的错误 我看到了一个类似的问题，但仍然无法解决这个问题 试一试

• base64:“TypeError:input.replace不是函数”
• binary:“TypeError:x.charCodeAt不是函数”
• 字符串：“TypeError:data.match不是函数”
• 数组：是导致内存进入5gb的数组

另外，当创建reader.onload时尝试使用文档中的新文件读取器时，函数从未运行。 我试了两件事。 当我使用缓冲区时，它似乎可以工作，但所有函数都返回空数组。 就像文件是空的，但它不是

双方都做了同样的事情

<v-file-input
    v-on:change="displayFile($event)"
    v-model="file">
    </v-file-input>
    <input type="file" name="xlfile" id="xlf" v-on:change="displayFile($event)" />

displayFile: function (event) {
  // console.log(event.target.files[0])
  // const file = event.target.files[0]
  // const workbook = XLSX.read(file, {
  //   type: 'string'
  // })
  // console.log(workbook, workbook.SheetNames)

  // const res = XLSX.read(file)
  // console.log(res)
  // const res = XLSX.read(this.file)
  // console.log(res)
  console.log(this.file)
  this.file.text().then(text => {
    const fileType = this.file.type
    console.log(fileType)
    // this.PropceseMethod(this.file, fileType)
  })
  const reader = new FileReader()
  reader.onload = (data) => {
    console.log('HERE')
    console.log(data)
    const workbook = XLSX.read(data, {
      type: 'buffer'
    })
    console.log(workbook)
    workbook.SheetNames.forEach(function (sheetName) {
      console.log(sheetName)
      console.log(workbook.Sheets[sheetName])
      // Here is your object
      const XLRowObject = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName])
      console.log(XLSX.utils.sheet_to_json(workbook.Sheets[sheetName]))
      console.log(XLRowObject)
      const jsonObject = JSON.stringify(XLRowObject)
      console.log(jsonObject)
    })
  }
  reader.onerror = function (ex) {
    console.log(ex)
  }
  reader.readAsText(this.file)
}

显示文件：函数（事件）{
//console.log（event.target.files[0]）
//const file=event.target.files[0]
//常量工作簿=XLSX.read（文件{
//键入：“字符串”
// })
//console.log（工作簿、工作簿、工作表名称）
//const res=XLSX.read（文件）
//console.log（res）
//const res=XLSX.read（this.file）
//console.log（res）
console.log（this.file）
this.file.text（）.then（text=>{
const fileType=this.file.type
console.log（文件类型）
//this.PropceseMethod（this.file，fileType）
})
const reader=new FileReader（）
reader.onload=（数据）=>{
console.log（'HERE'）
console.log（数据）
常量工作簿=XLSX.read（数据{
类型：“缓冲区”
})
console.log（工作簿）
工作簿.SheetNames.forEach（函数（sheetName）{
console.log（sheetName）
console.log（workbook.Sheets[sheetName]）
//这是你的物品
const XLRowObject=XLSX.utils.sheet\u到\u row\u object\u数组（workbook.Sheets[sheetName]）
log（XLSX.utils.sheet_到_json（workbook.Sheets[sheetName]））
console.log（XLRowObject）
const jsonObject=JSON.stringify（XLRowObject）
console.log（jsonObject）
})
}
reader.onerror=函数（ex）{
控制台日志（ex）
}
reader.readAsText（this.file）
}

为了管理这个，我必须改变读取文件的方式。 当我使用readAsBinaryString时，它工作正常，并使用类型binary与此一起支付。 此函数仅读取第一页

fileToJson (e) {
  const file = e.target.files[0]
  /* Boilerplate to set up FileReader */
  const reader = new FileReader()
  reader.onload = (e) => {
    /* Parse data */
    const bstr = e.target.result
    const wb = XLSX.read(bstr, { type: 'binary' })
    /* Get first worksheet */
    const wsname = wb.SheetNames[0]
    const ws = wb.Sheets[wsname]
    /* Convert array of arrays */
    const data = XLSX.utils.sheet_to_json(ws, { header: 1 })
    /* Update state */
    this.data = data
    const header = data.shift()
  }
  reader.readAsBinaryString(file)
}

---

此代码在Vue CLI应用程序中适用：

// Important that import statement must get the full.min.js file only.
import XLSX from '../../../node_modules/xlsx/dist/xlsx.full.min.js'

var reader = new FileReader()
reader.onload = function (e) {
   var data = e.target.result
   var workbook = XLSX.read(data, { type: 'binary' })
   let sheetName = workbook.SheetNames[0]
   let worksheet = workbook.Sheets[sheetName]
   let rowObject = XLSX.utils.sheet_to_row_object_array(worksheet)
   const finalJsonData = JSON.stringify(rowObject, undefined, 4)
   console.log(finalJsonData)
}
reader.readAsBinaryString(this.excelFile)

最终JSON输出为：

[
    {
        "email": "test5@test.com",
        "password": "password",
        "full_name": "Some Name 5",
        "mobile": 9897675463
    },
    {
        "email": "test6@test.com",
        "password": "password",
        "full_name": "Some Name 6",
        "mobile": 9897675463
    },
    ...
    ...
]

我的Excel文件为：