百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术教程 > 正文

将答题成绩排行榜数据通过前端生成excel的方式实现导出下载功能

csdh11 2024-12-28 12:01 15 浏览

需求是这样的,在答题活动结束后,主办方想要导出排行榜成绩到excel,并能够在小程序里面打开查看、转发或下载保存到本地的功能。



我的实现思路大概是这样,先把排行榜数据按照得分排名顺序,处理成对应的JSON数据结构,通过XLSX库生成生成 Excel 文件,使用文件系统管理器写入文件,再通过wx.openDocument打开文件。


通过查阅官方技术文档得知,从微信小程序基础库 2.4.0 开始,wx.arrayBufferToBase64 接口确实已经停止维护。因此,我们需要使用其他方式将 ArrayBuffer 转换为 Base64 编码的字符串。

在小程序中,我们可以通过先将 ArrayBuffer 转换为 TypedArrayArray(如 Uint8Array),然后使用 TextEncoder(但小程序原生不支持 TextEncoder,需要模拟或使用其他库)或手动遍历 TypedArrayArray 来将每个字节转换为对应的 Base64 字符。不过,更简便的方法是使用现有的第三方库,如 base64-js,它可以在小程序中正常运行。

以下是一个使用 base64-js 库将 ArrayBuffer 转换为 Base64 字符串,并导出 JSON 数据为 Excel 文件的示例:

  1. 安装 base64-js 库:
    由于小程序不支持 npm,你需要手动下载 base64-js 的源代码,并将其添加到你的小程序项目中。
  2. 引入 base64-js 并编写导出逻辑:
// 假设你已经将 base64-js 的代码添加到你的项目中,并放在 libs/base64-js.js 文件中  
const Base64 = require('../../libs/base64-js.js');  
const XLSX = require('../../libs/xlsx.core.min.js'); // 确保你的 xlsx.core.min.js 路径正确  


Page({  
  // ... 其他页面逻辑  


  exportToExcel: function () {  
    // 排行榜 示例 JSON 数据  
    const jsonData = [  
      { name: '刘东旭-xx组', num: 3, score: 95, order: 1 },  
      { name: '王思思-xx组', bum: 2, score: 90, order: 2 },  
      // ... 其他考生数据  
    ];  


    // 将 JSON 数据转换为工作表  
    const worksheet = XLSX.utils.json_to_sheet(jsonData);  


    // 创建一个新的工作簿并将工作表添加到工作簿中  
    const workbook = XLSX.utils.book_new();  
    XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');  


    // 生成 Excel 文件的二进制内容  
    const wbout = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });  


    // 将 ArrayBuffer 转换为 Uint8Array  
    const uint8Array = new Uint8Array(wbout);  


    // 使用 base64-js 将 Uint8Array 转换为 Base64 字符串  
    const base64data = Base64.fromUint8Array(uint8Array);  


    // 创建一个临时文件路径  
    const tempFilePath = `${wx.env.USER_DATA_PATH}/export_${Date.now()}.xlsx`;  


    // 使用文件系统管理器写入文件  
    const fs = wx.getFileSystemManager();  
    fs.writeFile({  
      filePath: tempFilePath,  
      data: base64data,  
      encoding: 'base64',  
      success: () => {  
        // 打开文件  
        wx.openDocument({  
          filePath: tempFilePath,  
          fileType: 'xlsx',  
          success: () => {  
            console.log('文件打开成功');  
          },  
          fail: (err) => {  
            console.error('文件打开失败', err);  
          },  
        });  
      },  
      fail: (err) => {  
        console.error('文件写入失败', err);  
      },  
    });  
  },  


  // ... 其他页面方法  
});


javascrip注意注意:
  • 在上面的代码中,Base64.fromUint8Array 是 base64-js 库提供的方法,用于将 Uint8Array 转换为 Base64 字符串。
  • fs.writeFile 方法在这里使用了异步形式,并传递了一个对象作为参数,这与之前的同步方法 writeFileSync 不同。这样做可以避免阻塞线程。
  • 确保你的 base64-js 和 xlsx.core.min.js 文件路径正确无误。
  • 导出功能可能会因为小程序的安全策略或文件大小限制而失败。在实际应用中,你可能需要处理这些潜在的错误情况。

相关推荐

探索Java项目中日志系统最佳实践:从入门到精通

探索Java项目中日志系统最佳实践:从入门到精通在现代软件开发中,日志系统如同一位默默无闻却至关重要的管家,它记录了程序运行中的各种事件,为我们排查问题、监控性能和优化系统提供了宝贵的依据。在Java...

用了这么多年的java日志框架,你真的弄懂了吗?

在项目开发过程中,有一个必不可少的环节就是记录日志,相信只要是个程序员都用过,可是咱们自问下,用了这么多年的日志框架,你确定自己真弄懂了日志框架的来龙去脉嘛?下面笔者就详细聊聊java中常用日志框架的...

物理老师教你学Java语言(中篇)(物理专业学编程)

第四章物质的基本结构——类与对象...

一文搞定!Spring Boot3 定时任务操作全攻略

各位互联网大厂的后端开发小伙伴们,在使用SpringBoot3开发项目时,你是否遇到过定时任务实现的难题呢?比如任务调度时间不准确,代码报错却找不到方向,是不是特别头疼?如今,随着互联网业务规模...

你还不懂java的日志系统吗 ?(java的日志类)

一、背景在java的开发中,使用最多也绕不过去的一个话题就是日志,在程序中除了业务代码外,使用最多的就是打印日志。经常听到的这样一句话就是“打个日志调试下”,没错在日常的开发、调试过程中打印日志是常干...

谈谈枚举的新用法--java(java枚举的作用与好处)

问题的由来前段时间改游戏buff功能,干了一件愚蠢的事情,那就是把枚举和运算集合在一起,然后运行一段时间后buff就出现各种问题,我当时懵逼了!事情是这样的,做过游戏的都知道,buff,需要分类型,且...

你还不懂java的日志系统吗(javaw 日志)

一、背景在java的开发中,使用最多也绕不过去的一个话题就是日志,在程序中除了业务代码外,使用最多的就是打印日志。经常听到的这样一句话就是“打个日志调试下”,没错在日常的开发、调试过程中打印日志是常干...

Java 8之后的那些新特性(三):Java System Logger

去年12月份log4j日志框架的一个漏洞,给Java整个行业造成了非常大的影响。这个事情也顺带把log4j这个日志框架推到了争议的最前线。在Java领域,log4j可能相对比较流行。而在log4j之外...

Java开发中的日志管理:让程序“开口说话”

Java开发中的日志管理:让程序“开口说话”日志是程序员的朋友,也是程序的“嘴巴”。它能让程序在运行过程中“开口说话”,告诉我们它的状态、行为以及遇到的问题。在Java开发中,良好的日志管理不仅能帮助...

吊打面试官(十二)--Java语言中ArrayList类一文全掌握

导读...

OS X 效率启动器 Alfred 详解与使用技巧

问:为什么要在Mac上使用效率启动器类应用?答:在非特殊专业用户的环境下,(每天)用户一般可以在系统中进行上百次操作,可以是点击,也可以是拖拽,但这些只是过程,而我们的真正目的是想获得结果,也就是...

Java中 高级的异常处理(java中异常处理的两种方式)

介绍异常处理是软件开发的一个关键方面,尤其是在Java中,这种语言以其稳健性和平台独立性而闻名。正确的异常处理不仅可以防止应用程序崩溃,还有助于调试并向用户提供有意义的反馈。...

【性能调优】全方位教你定位慢SQL,方法介绍下!

1.使用数据库自带工具...

全面了解mysql锁机制(InnoDB)与问题排查

MySQL/InnoDB的加锁,一直是一个常见的话题。例如,数据库如果有高并发请求,如何保证数据完整性?产生死锁问题如何排查并解决?下面是不同锁等级的区别表级锁:开销小,加锁快;不会出现死锁;锁定粒度...

看懂这篇文章,你就懂了数据库死锁产生的场景和解决方法

一、什么是死锁加锁(Locking)是数据库在并发访问时保证数据一致性和完整性的主要机制。任何事务都需要获得相应对象上的锁才能访问数据,读取数据的事务通常只需要获得读锁(共享锁),修改数据的事务需要获...