评论

小程序读取excel表格数据,并存储到云数据库

小程序上传excel数据到数据库

最近一直比较忙,答应大家的小程序解析excel一直没有写出来,今天终于忙里偷闲,有机会把这篇文章写出来给大家了。

老规矩先看效果图


效果其实很简单,就是把excel里的数据解析出来,然后存到云数据库里。说起来很简单。但是真的做起来的时候,发现其中要用到的东西还是很多的。不信。。。。 那来看下流程图

流程图


通过流程图,我看看到我们这里使用了云函数,云存储,云数据库。
流程图主要实现下面几个步骤

  • 1,使用wx.chooseMessageFile选择要解析的excel表格
  • 2,通过wx.cloud.uploadFile上传excel文件到云存储
  • 3,云存储返回一个fileid 给我们
  • 4,定义一个excel云函数
  • 5,把第3步返回的fileid传递给excel云函数
  • 6,在excel云函数里解析excel,并把数据添加到云数据库。

可以看到最神秘,最重要的就是我们的excel云函数。

所以我们先把前5步实现了,后面重点讲解下我们的excel云函数。

一,选择并上传excel表格文件到云存储

这里我们使用到了云开发,使用云开发必须要先注册一个小程序,并给自己的小程序开通云开发功能。这个知识点我讲过很多遍了,还不知道怎么开通并使用云开发的同学,去翻下我前面的文章,或者看下我录的讲解视频《5小时入门小程序云开发》

  • 1,先定义我们的页面
    页面很简单,就是一个按钮如下图,点击按钮时调用chooseExcel方法,选择excel

    对应的wxml代码如下
  • 2,编写文件选择和文件上传方法

    上图的chooseExcel就是我们的excel文件选择方法。
    uploadExcel就是我们的文件上传方法,上传成功以后会返回一个fildID。我们把fildID传递给我们的jiexi方法,jiexi方法如下
  • 3 把fildID传递给云函数

二,解下来就是定义我们的云函数了。

  • 1,首先我们要新建云函数

    如果你还不知道如何新建云函数,可以翻看下我之前写的文章,也可以看我录的视频《5小时入门小程序云开发》
    如下图所示的excel就是我们创建的云函数
  • 2,安装node-xlsx依赖库

    如上图所示,右键excel,然后点击在终端中打开。 打开终端后,
    输入 npm install node-xlsx 安装依赖。可以看到下图安装中的进度条

    这一步需要你电脑上安装过node.js并配置npm命令。
  • 3,安装node-xlsx依赖库完成

三,编写云函数

我把完整的代码贴出来给大家

const cloud = require('wx-server-sdk')
cloud.init()
var xlsx = require('node-xlsx');
const db = cloud.database()

exports.main = async(event, context) => {
  let {
    fileID
  } = event
  //1,通过fileID下载云存储里的excel文件
  const res = await cloud.downloadFile({
    fileID: fileID,
  })
  const buffer = res.fileContent

  const tasks = [] //用来存储所有的添加数据操作
  //2,解析excel文件里的数据
  var sheets = xlsx.parse(buffer); //获取到所有sheets
  sheets.forEach(function(sheet) {
    console.log(sheet['name']);
    for (var rowId in sheet['data']) {
      console.log(rowId);
      var row = sheet['data'][rowId]; //第几行数据
      if (rowId > 0 && row) { //第一行是表格标题,所有我们要从第2行开始读
        //3,把解析到的数据存到excelList数据表里
        const promise = db.collection('users')
          .add({
            data: {
              name: row[0], //姓名
              age: row[1], //年龄
              address: row[2], //地址
              wechat: row[3] //wechat
            }
          })
        tasks.push(promise)
      }
    }
  });

  // 等待所有数据添加完成
  let result = await Promise.all(tasks).then(res => {
    return res
  }).catch(function(err) {
    return err
  })
  return result
}

上面代码里注释的很清楚了,我这里就不在啰嗦了。
有几点注意的给大家说下

  • 1,要先创建数据表
  • 2,有时候如果老是解析失败,可能是有的电脑需要在云函数里也要初始化云开发环境

四,解析并上传成功

如我的表格里有下面三条数据

点击上传按钮,并选择我们的表格文件

上传成功的返回如下,可以看出我们添加了3条数据到数据库

添加成功效果图如下

到这里我们就完整的实现了小程序上传excel数据到数据库的功能了。

再来带大家看下流程图

如果你有遇到问题,可以在底部留言,我看到后会及时解答。后面我会写更多小程序云开发实战的文章出来。也会录制本节的视频出来,敬请关注。

点赞 36
收藏
评论

25 个评论

  • 千淘万漉
    千淘万漉
    2019-11-15

    你的这篇文章,不知道要节约多少人的多少时间,如果所有时间加一块,估计可以和一个人的生命相比较了,谢谢你的无私!!

    2019-11-15
    赞同 25
    回复 5
    • 编程小石头
      编程小石头
      2019-11-15
      谢谢你的支持
      2019-11-15
      2
      回复
    • 程
      2020-03-25回复编程小石头
      编程小石头,太感谢您了,我想请教一下,微信公众号里面的音乐点击一个后,自动播放其余的。
      2020-03-25
      2
      回复
    • 大陈: Done is Better
      大陈: Done is Better
      2021-10-31
      大赞
      2021-10-31
      回复
    • clx
      clx
      2022-06-25
      谢谢
      2022-06-25
      回复
    • 麦田里的守望者
      麦田里的守望者
      2022-11-12
      石头哥能否再写一个,你上传的这个表格 和另外上传表格,假如都有石头哥这个信息,把这石头哥信息筛选出来呢/谢谢了
      2022-11-12
      回复
  • Vawter
    Vawter
    2020-07-12

    石头哥你好,感谢代码分享。但是您这种添加数据库的操作容易造成资源使用量超标。

    所以优化了一下您的代码,push到数组之后一起添加。

      const all_excel_data = [] //用来存储所有的excel数据
      //2,解析excel文件里的数据
      var sheets = xlsx.parse(buffer); //获取到所有sheets
      sheets.forEach(function(sheet) {
        console.log(sheet['name']);
        for (var rowId in sheet['data']) {
          //console.log(rowId);
          var row = sheet['data'][rowId]; //第几行数据
          if (rowId > 0 && row) { //第一行是表格标题,所以我们要从第2行开始读
            //3,把解析到的数据存到excelList数据表里
            all_excel_data.push({
              name: row[0], //姓名
              price: row[1], //单价
              number: row[2]//数量
            })
          }
        }
      });
      // 一起添加所有数据
      var result=await db.collection('goods').add({data:all_excel_data}).then(res=>{
        return res
      }).catch(err=>{return err})
      return result
    
    2020-07-12
    赞同 7
    回复 6
    • Roy Yi
      Roy Yi
      2020-11-15
      非常感谢。 批量上传如果用石头哥一条条add的方法是有问题的,我尝试了很多次都上传不完整,用了这位大神“push到数组之后一起添加”的方法就完美解决问题了。感谢,感谢
      2020-11-15
      2
      回复
    • 大雪纷飞
      大雪纷飞
      2020-12-26
      这样数据结构改变了,所有的数据保存在了一条记录里,如果前端的代码也就不一样了
      2020-12-26
      回复
    • 来时路
      来时路
      2021-04-13回复大雪纷飞
      没有变,它这个是完全正确的,还是一条条的数据
      2021-04-13
      回复
    • 仁者
      仁者
      2022-10-24
      太感谢你了,大哥,解决了我大问题
      2022-10-24
      回复
    • lychEn
      lychEn
      2023-05-27
      dage feichang ganxie
      2023-05-27
      回复
    查看更多(1)
  • 飘雪的撒哈拉
    飘雪的撒哈拉
    2020-04-02

    作者您好!我按您的方法导入我的EXCEL出现了问题,返回的信息里result并没有array数组,应该是没有抓取到excel文件里的数据,这是为什么?我的云函数代码是这样的

    const cloud = require('wx-server-sdk')
    cloud.init({
      env: 'prod-924a3b'
    })
    var xlsx = require('node-xlsx');
    const db = cloud.database()
    
    
    exports.main = async (event, context) => {
      let {
        fileID
      } = event
      //1,通过fileID下载云存储里的excel文件
      const res = await cloud.downloadFile({
        fileID: fileID,
      })
      const buffer = res.fileContent
    
    
      const tasks = [] //用来存储所有的添加数据操作
      //2,解析excel文件里的数据
      var sheets = xlsx.parse(buffer); //获取到所有sheets
      sheets.forEach(function (sheet) {
        console.log(sheet['name']);
        for (var rowId in sheet['data']) {
          console.log(rowId);
          var row = sheet['data'][rowId]; //第几行数据
          if (rowId > 0 && row) { //第一行是表格标题,所有我们要从第2行开始读
            //3,把解析到的数据存到excelList数据表里
            const promise = db.collection('user')
              .add({
                data: {
                  shumu: row[0], //书目
                  sexi: row[1], //色系
                  yanse: row[2], //颜色
                  duixiang: row[3], //对象
                  yuanwen: row[4], //原文
                  chuchu: row[5], //出处
                  leixing: row[6], //类型
                  beizhu: row[7] //备注
                }
              })
            tasks.push(promise)
          }
        }
      });
    
    
      // 等待所有数据添加完成
      let result = await Promise.all(tasks).then(res => {
        return res
      }).catch(function (err) {
        return err
      })
      return result
    }
    
    2020-04-02
    赞同 3
    回复 8
    • 7D雨
      7D雨
      2020-04-25
      我也是这问题,请教一下怎么解决
      2020-04-25
      回复
    • rex👼🏿
      rex👼🏿
      2020-05-16
      你试试右键云函数然后上传并部署云函数依赖
      2020-05-16
      2
      回复
    • CQ
      CQ
      2020-07-11
      你的问题解决了吗?我也遇到同样的问题,能分享下你的解决方案吗?非常感谢!
      2020-07-11
      回复
    • Wecon
      Wecon
      2021-02-02
      我也遇到同样问题了  请问如何解决
      2021-02-02
      回复
    • 白天
      白天
      2021-04-25
      上传并部署云函数依赖就可以了
      2021-04-25
      1
      回复
    查看更多(3)
  • 张欣然~
    张欣然~
    2020-03-16

    麻烦问一下,我这个显示解析成功,但是返回来的res里没有我的数据啊,就是年龄啊,姓名那些

    2020-03-16
    赞同 1
    回复
  • C先生besos
    C先生besos
    2019-12-30

    你写的这个程序如果行数多了解析就会出问题,解析不完整个表格,这是为什么?

    2019-12-30
    赞同 1
    回复 20
    • 编程小石头
      编程小石头
      2019-12-30
      把你的解决方案,贴出来给大家分享下
      2019-12-30
      回复
    • LiMn
      LiMn
      2020-02-02回复编程小石头
      首先非常感谢您的无私风险,照着您的思路成功走下来了,但是也确实出现了C先生所说的问题,大约不到1000行6列的数据,发现丢失,再删减到三四百的时候,还是上传不完整,真的很苦恼。。。我需要上传大约不到一万条数据。。。求指教
      2020-02-02
      回复
    • Vawter
      Vawter
      2020-02-07
      数据丢失的,可以看一下,是不是云函数提前终止了,加入asyn试试看。代码应该是不错的。
      2020-02-07
      回复
    • stm8l101
      stm8l101
      2020-02-10回复LiMn
      你的错误提示是什么问题?你解决了了?
      2020-02-10
      回复
    • 初心
      初心
      2020-02-16
      你的问题解决了吗?分享一下方法
      2020-02-16
      回复
    查看更多(15)
  • Huifen
    Huifen
    2023-03-10

    几乎不评论,但今天说啥也得支持一下,作者加油

    2023-03-10
    赞同
    回复
  • 夜虎
    夜虎
    2023-01-06

    请教下可以将数据库里面图片也导到excel表格里吗?我觉得这个功能很重要,有时修数据里面带图片,也需要一起导出来。

    2023-01-06
    赞同
    回复
  • 天道酬勤
    天道酬勤
    2022-09-30

    解析失败 Error: cloud.callFunction:fail Error: errCode: -504002 functions execute fail | errMsg: TypeErrdownloadFile:fail or: downloadFile:fail Cannot read property '0' of undefined,到解析这一步失败了,请求大神们帮助,万分感谢。

    2022-09-30
    赞同
    回复 1
    • whsiperevil
      whsiperevil
      2023-06-05
      请问您解决了这个问题吗?我也碰到这个报错了
      2023-06-05
      回复
  • 琪琪乖乖
    琪琪乖乖
    2022-01-06

    有不使用云开发的嘛

    2022-01-06
    赞同
    回复
  • 大陈: Done is Better
    大陈: Done is Better
    2021-10-31

    石头出品、必然精品。

    2021-10-31
    赞同
    回复

正在加载...

登录 后发表内容