用js从服务端本地读取excel文件的数据

发布于 2022-09-11 16:04:59 字数 1995 浏览 9 评论 0

现在有一个需求,需要从本地的excel文件中读取数据,后期再用这些数据在页面中展示。


背景:
现在项目里需要编写一些数据,来作为前端页面展示的数据源,产品希望用excel表来做媒介,方便用户去输入数据。


过程:
已经查到可以用js-xlsx这款插件来解析excel文件的内容,结合<input type="file"/>来使用也是完全没有问题的。

但是文件需要用户去操作才能选中,不符合需求。

希望的是页面加载的同时,就去excel文件读取数据,再进行一系列之后的操作。这些是自动完成的。

而使用ajax去读取文件,读取出来的结果不能转换为blob格式,也不能用Blob构造函数去转化

var ajaxRead = function () {
  $.ajax({
    url: 'http://localhost:8080/data.xls',
      method: 'get',
      success: function (e) {
        // 获取源文件
        // var files = new Blob(e, { type: 'application/vnd.ms-excel' });
        var files = new Blob(e, { type: 'text/csv,charset=UTF-8' });
    },
    error: function (e) {
      console.log(e);
    }
  });
};
    // 对exl文件数据进行读取
    var dealWithExl = function (files) {
        // 使用H5新属性FileReader,注册加载事件处理文件
        var fileReader = new FileReader();
        fileReader.onload = function (ev) {
            try {
                var data = ev.target.result,
                    workbook = XLSX.read(data, {
                        type: 'binary'
                    }), // 以二进制流方式读取得到整份excel表格对象
                    persons = []; // 存储获取到的数据
            } catch (e) {
                console.log('文件类型不正确');
                return;
            }

            // 表格的内容范围,可用于判断表头是否数量是否正确
            var fromTo = '';
            // 遍历每张表读取
            for (var sheet in workbook.Sheets) {
                if (workbook.Sheets.hasOwnProperty(sheet)) {
                    fromTo = workbook.Sheets[sheet]['!ref'];
                    console.log(fromTo);
                    persons = persons.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));
                    // break; // 如果只取第一张表,就取消注释这行
                }
            }
            console.log(persons);
        };
        // 以二进制方式打开文件
        fileReader.readAsBinaryString(files[0]);
    };

问题:
有没有什么方法可以正确地读取excel文件的数据?

或者有其他获取本地数据的思路?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

只是在用心讲痛 2022-09-18 16:04:59

发ajax请求时,添加XMLHttpRequest.responseType:'blob'之后再试试
https://developer.mozilla.org...

煮酒 2022-09-18 16:04:59

这是不可能的,浏览器没有用户授权是无法获取用户的本地文件的

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文