这是一个神奇的网站，哦不，神奇的云函数，它只有三行代码：（真的只有三行哦） 云函数：login index.js： const cloud = require('wx-server-sdk') cloud.init() exports.main = async (event) => { return { ...event, ...cloud.getWXContext() } } 神奇功能之一：获取openid： 任何页面运行下面代码，已解决异步问题。 onLoad: async function (options) { app.globalData.openid=app.globalData.openid||(await wx.cloud.callFunction({name:'login'})).result.OPENID console.log(app.globalData.openid) }, 其他功能： 神奇功能之二：不用授权获取unionid： 不需要弹出授权框，直接获取unionid，但是不保证100%成功获取，有可能unionid为空。 https://developers.weixin.qq.com/community/develop/article/doc/000a0c6b580338e947f9db0c65b813 神奇功能之三：100%成功获取unionid： 保证100%成功获取unionid，需要用户信息授权。 https://developers.weixin.qq.com/community/develop/article/doc/00066a967c4e384949f93fe1151413 神奇功能之四：获取电话号码： 还是这三行代码，获取用户的电话号码。 https://developers.weixin.qq.com/community/develop/article/doc/0006a8ec7ac860c94bf90a34f5d813 神奇功能之五：获取群id： 将小程序分享到某群里，可获得该群的群id， https://developers.weixin.qq.com/community/develop/article/doc/000ea802c00f70894cf9fe72556013 [图片]

小程序导出数据到excel表，借助云开发后台实现excel数据的保存 我们在开发小程序的过程中，可能会有这样的需求：如何将云数据库里的数据批量导出到excel表里？ 这个需求可以用强大的云开发轻松实现！ 这里需要用到云函数，云存储和云数据库。可以说通过这一个例子，把小程序云开发相关的知识都用到了。下面就来介绍如何实现 实现思路 1，创建云函数 2，在云函数里读取云数据库里的数据 3，安装node-xlsx类库（node类库） 4，把云数据库里读取到的数据存到excel里 5，把excel存到云存储里并返回对应的云文件地址 6，通过云文件地址下载excel文件 一、创建excel云函数 关于如何创建云开发小程序，这里我就不再做具体讲解。不知道怎么创建云开发小程序的同学，可以去翻看腾讯云云开发公众号内菜单【技术交流-视频教程】中的教学视频。 创建云函数时有两点需要注意的，给大家说下 1、一定要把app.js里的环境id换成你自己的 [图片] 2，你的云函数目录要选择你对应的云开发环境（通常这里默认选中的） 不过你这里的云开发环境要和你app.js里的保持一致 [图片] 二、读取云数据库里的数据 我们第一步创建好云函数以后，可以先在云函数里读取我们的云数据库里的数据。 1、先看下我们云数据库里的数据 [图片] 2、编写云函数，读取云数据库里的数据（一定要记得部署云函数） [图片] 3、成功读取到数据 [图片] 把读取user数据表的完整代码给大家贴出来。 [代码]// 云函数入口文件 const cloud = require('wx-server-sdk') cloud.init({ env: "test-vsbkm" }) // 云函数入口函数 exports.main = async(event, context) => { return await cloud.database().collection('users').get(); } [代码] 三、安装生成excel文件的类库 node-xlsx 通过上面第二步可以看到我们已经成功的拿到需要保存到excel的源数据，我们接下来要做的就是把数据保存到excel 1、安装node-xlsx类库 [图片] 这一步需要我们事先安装node,因为我们要用到npm命令，通过命令行npm install node-xlsx[图片] 可以看出我们安装完成以后，多了一个package-lock.json的文件 [图片] 四、编写把数据保存到excel的代码， 下图是我们的核心代码： [图片] 这里的数据是我们查询的users表的数据，然后通过下面代码遍历数组，然后存入excel。这里需要注意我们的id,name,weixin要和users表里的对应。 [代码] for (let key in userdata) { let arr = []; arr.push(userdata[key].id); arr.push(userdata[key].name); arr.push(userdata[key].weixin); alldata.push(arr) } [代码] 还有下面这段代码，是把excel保存到云存储用的 [代码] //4，把excel文件保存到云存储里 return await cloud.uploadFile({ cloudPath: dataCVS, fileContent: buffer, //excel二进制文件 }) [代码] 下面把完整的excel里的index.js代码贴给大家,记得把云开发环境id换成你自己的。 [代码]const cloud = require('wx-server-sdk') //这里最好也初始化一下你的云开发环境 cloud.init({ env: "test-vsbkm" }) //操作excel用的类库 const xlsx = require('node-xlsx'); // 云函数入口函数 exports.main = async(event, context) => { try { let {userdata} = event //1,定义excel表格名 let dataCVS = 'test.xlsx' //2，定义存储数据的 let alldata = []; let row = ['id', '姓名', '微信号']; //表属性 alldata.push(row); for (let key in userdata) { let arr = []; arr.push(userdata[key].id); arr.push(userdata[key].name); arr.push(userdata[key].weixin); alldata.push(arr) } //3，把数据保存到excel里 var buffer = await xlsx.build([{ name: "mySheetName", data: alldata }]); //4，把excel文件保存到云存储里 return await cloud.uploadFile({ cloudPath: dataCVS, fileContent: buffer, //excel二进制文件 }) } catch (e) { console.error(e) return e } } [代码] 五、把excel存到云存储里并返回对应的云文件地址 经过上面的步骤，我们已经成功的把数据存到excel里，并把excel文件存到云存储里。可以看下效果。 [图片] 接着，就可以通过上图的下载地址下载excel文件了。 [图片] 其实到这里就差不多实现了基本的把数据保存到excel里的功能了，但是为了避免每次导出数据都需要去云开发后台下载excel的麻烦，接下来介绍如何动态获取下载地址。 六、获取云文件地址下载excel文件 [图片] 通过上图我们可以看出，我们获取下载链接需要用到一个fileID,而这个fileID在我们保存excel到云存储时，有返回，如下图。我们把fileID传给我们获取下载链接的方法即可。 [图片] 1、我们获取到了下载链接，接下来就要把下载链接显示到页面 [图片] 2、代码显示到页面以后，我们就要复制这个链接，方便用户粘贴到浏览器或者微信去下载。 [图片] 下面是完整代码： [代码]Page({ onLoad: function(options) { let that = this; //读取users表数据 wx.cloud.callFunction({ name: "getUsers", success(res) { console.log("读取成功", res.result.data) that.savaExcel(res.result.data) }, fail(res) { console.log("读取失败", res) } }) }, //把数据保存到excel里，并把excel保存到云存储 savaExcel(userdata) { let that = this wx.cloud.callFunction({ name: "excel", data: { userdata: userdata }, success(res) { console.log("保存成功", res) that.getFileUrl(res.result.fileID) }, fail(res) { console.log("保存失败", res) } }) }, //获取云存储文件下载地址，这个地址有效期一天 getFileUrl(fileID) { let that = this; wx.cloud.getTempFileURL({ fileList: [fileID], success: res => { // get temp file URL console.log("文件下载链接", res.fileList[0].tempFileURL) that.setData({ fileUrl: res.fileList[0].tempFileURL }) }, fail: err => { // handle error } }) }, //复制excel文件下载链接 copyFileUrl() { let that=this wx.setClipboardData({ data: that.data.fileUrl, success(res) { wx.getClipboardData({ success(res) { console.log("复制成功",res.data) // data } }) } }) } }) [代码] 梳理下上面代码的逻辑： 1、先通过getUsers云函数去云数据库获取数据。 2、把获取到的数据通过excel云函数把数据保存到excel，然后把excel保存的云存储。 3、获取云存储里的文件下载链接。 4、复制下载链接，到浏览器里下载excel文件。 到这里我们就完整的实现了把数据保存到excel的功能了。 文章有点长，知识点有点多，但是大家理解上述内容后，就可以对小程序云开发的云函数、云数据库、云存储有一个较为完整的了解过程。 如果你想要了解更多关于云开发CloudBase相关的技术故事/技术实战经验，请扫码关注【腾讯云云开发】公众号 ～ [图片]

点餐系统上线这段时间，有好多同学反馈，是否可以添加一个菜品批量导入的功能。由于平时比较忙，一直没有时间把菜品批量导入的功能加进来。今天正好空出来时间了，就来教大家实现下菜品批量导入的功能。 后面会把这节功能录制成视频放到点餐系统的课程里。 老规矩，先看效果图 选择excel菜品 [图片] 导入数据成功 [图片] 之前有看过我课程的同学肯定知道，我之前是没有批量导入的类目的，不错，这个类目就是我们今天新加的功能。 实现步骤很简单： 1，点击导入按钮选择excel 2，导入成功后调转到商品列表页。 下面我们就来具体讲解下实现步骤 一，引入excel操作类库 我们这里主要用到了下面红框里的两个类库 [图片] 类库写在pom.xml里，不要忘记做ReImport操作 [图片] 二，添加导入excel的后台网页 添加菜品类目导入页 [图片] 添加商品(菜品)导入页 [图片] 上面的代码，我会加入到点餐系统里，有购买点餐系统课程的同学，去刷新下之前的网盘链接即可获取最新代码。 三，编写ExcelUtil工具类 把完整代码给大家贴出来，其实很简单，就是在工具类里定义一个导入菜品类目和菜品的方法。 注意：对应的导入方法是解析excel里的数据，所以你的excel数据必须和我的保持一致，就是第几列是什么数据，要和我的对应起来。要不然会导致数据存错的问题。 [代码]package com.qcl.utils; import com.qcl.dataobject.ProductCategory; import com.qcl.dataobject.ProductInfo; import org.apache.poi.ss.usermodel.Cell; import org.apache.poi.ss.usermodel.Row; import org.apache.poi.ss.usermodel.Sheet; import org.apache.poi.ss.usermodel.Workbook; import org.apache.poi.ss.usermodel.WorkbookFactory; import java.io.InputStream; import java.math.BigDecimal; import java.util.ArrayList; import java.util.List; import lombok.extern.slf4j.Slf4j; /* * 操作excel * */ @Slf4j public class ExcelUtils { /* * 菜品类目批量导入 * 要求 * 1，必须以.xlsx结尾的excel文件 * 2，表格内容必须按照下面顺序 * 0：类目名，1：type值 * * */ public static List<ProductCategory> excelToProductCategoryList(InputStream inputStream) { List<ProductCategory> list = new ArrayList<>(); Workbook workbook = null; try { workbook = WorkbookFactory.create(inputStream); inputStream.close(); //工作表对象 Sheet sheet = workbook.getSheetAt(0); //总行数 int rowLength = sheet.getLastRowNum(); System.out.println("总行数有多少行" + rowLength); //工作表的列 Row row = sheet.getRow(0); //总列数 int colLength = row.getLastCellNum(); System.out.println("总列数有多少列" + colLength); //得到指定的单元格 Cell cell = row.getCell(0); for (int i = 1; i <= rowLength; i++) { ProductCategory goodInfo = new ProductCategory(); row = sheet.getRow(i); for (int j = 0; j < colLength; j++) { cell = row.getCell(j); if (cell != null) { cell.setCellType(Cell.CELL_TYPE_STRING); String data = cell.getStringCellValue(); data = data.trim(); //列：0：类目名，1：type值 if (j == 0) { goodInfo.setCategoryName(data); } else if (j == 1) { goodInfo.setCategoryType(Integer.parseInt(data)); } } } list.add(goodInfo); // log.error("每行数据={}", menuInfo); } } catch (Exception e) { log.error("excel导入抛出的错误={}", e); } return list; } /* * 菜品(商品)批量导入 * 要求 * 1，必须以.xlsx结尾的excel文件 * 2，表格内容必须按照下面顺序 * 0商品名，1单价，2库存，3类目，4描述，5图片链接 * * */ public static List<ProductInfo> excelToProductInfoList(InputStream inputStream) { List<ProductInfo> list = new ArrayList<>(); Workbook workbook = null; try { workbook = WorkbookFactory.create(inputStream); inputStream.close(); //工作表对象 Sheet sheet = workbook.getSheetAt(0); //总行数 int rowLength = sheet.getLastRowNum(); //工作表的列 Row row = sheet.getRow(0); //总列数 int colLength = row.getLastCellNum(); //得到指定的单元格 Cell cell = row.getCell(0); for (int i = 1; i <= rowLength; i++) { ProductInfo goodInfo = new ProductInfo(); row = sheet.getRow(i); for (int j = 0; j < colLength; j++) { cell = row.getCell(j); if (cell != null) { cell.setCellType(Cell.CELL_TYPE_STRING); String data = cell.getStringCellValue(); data = data.trim(); //列： 0商品名，1单价，2库存，3类目，4描述，5图片链接 if (j == 0) { goodInfo.setProductId(KeyUtil.genUniqueKey()); goodInfo.setProductName(data); } else if (j == 1) { goodInfo.setProductPrice(new BigDecimal(data)); } else if (j == 2) { goodInfo.setProductStock(Integer.parseInt(data)); } else if (j == 3) { goodInfo.setCategoryType(Integer.parseInt(data)); } else if (j == 4) { goodInfo.setProductDescription(data); } else if (j == 5) { goodInfo.setProductIcon(data); } } } list.add(goodInfo); } } catch (Exception e) { log.error("excel导入抛出的错误={}", e); } return list; } } [代码] 四，编写对应的接口 上面的工具类封装好以后，我们接下来就需要在对应的Controller类里添加导入数据的方法了。 1，导入菜品类目 主要编写上图所示的两个方法 一个是打开导入的网页，另外一个是实现导入数据的功能。完整代码贴出来给大家 [代码]/* * excel导入网页 * */ @GetMapping("/excel") public ModelAndView excel(Map<String, Object> map) { return new ModelAndView("category/excel", map); } /* * 批量导入excel里的菜品类目到数据库 * */ @RequestMapping("/uploadExcel") @ResponseBody public ModelAndView uploadExcel(@RequestParam("file") MultipartFile file, Map<String, Object> map) { String name = file.getOriginalFilename(); if (name.length() < 6 || !name.substring(name.length() - 5).equals(".xlsx")) { map.put("msg", "文件格式错误"); map.put("url", "/sell/seller/category/excel"); return new ModelAndView("common/error", map); } List<ProductCategory> list; try { list = ExcelUtils.excelToProductCategoryList(file.getInputStream()); log.info("excel导入的list={}", list); if (list == null || list.size() <= 0) { map.put("msg", "导入失败"); map.put("url", "/sell/seller/category/excel"); return new ModelAndView("common/error", map); } //excel的数据保存到数据库 try { for (ProductCategory excel : list) { if (excel != null) { //如果类目type值已存在，就不再导入 List typeList = categoryService.findOneByType(excel.getCategoryType()); log.info("查询类目type是否存在typeList={}", typeList); if (typeList == null || typeList.size() < 1) { System.out.println("保存成功"); categoryService.save(excel); } } } } catch (Exception e) { log.error("某一行存入数据库失败={}", e); } } catch (Exception e) { e.printStackTrace(); map.put("msg", e.getMessage()); map.put("url", "/sell/seller/category/excel"); return new ModelAndView("common/error", map); } map.put("url", "/sell/seller/category/list"); return new ModelAndView("common/success", map); } [代码] 2,导入菜品数据 代码也给大家贴出来 [代码] /* * excel导入网页 * */ @GetMapping("/excel") public ModelAndView excel(Map<String, Object> map) { return new ModelAndView("product/excel", map); } /* * 批量导入excel里的菜品(商品)到数据库 * */ @RequestMapping("/uploadExcel") @ResponseBody public ModelAndView uploadExcel(@RequestParam("file") MultipartFile file, Map<String, Object> map) { String name = file.getOriginalFilename(); if (name.length() < 6 || !name.substring(name.length() - 5).equals(".xlsx")) { map.put("msg", "文件格式错误"); map.put("url", "/sell/seller/product/excel"); return new ModelAndView("common/error", map); } List<ProductInfo> list; try { list = ExcelUtils.excelToProductInfoList(file.getInputStream()); log.info("excel导入的list={}", list); if (list == null || list.size() <= 0) { map.put("msg", "导入失败"); map.put("url", "/sell/seller/product/excel"); return new ModelAndView("common/error", map); } //excel的数据保存到数据库 try { for (ProductInfo excel : list) { if (excel != null) { //如果类目type值已存在，就不再导入 productService.save(excel); } } } catch (Exception e) { log.error("某一行存入数据库失败={}", e); } } catch (Exception e) { e.printStackTrace(); map.put("msg", e.getMessage()); map.put("url", "/sell/seller/product/excel"); return new ModelAndView("common/error", map); } map.put("url", "/sell/seller/product/list"); return new ModelAndView("common/success", map); } [代码] 到这里我们就完整的实现了点餐系统批量导入菜品数据到数据库的功能了。 完整的代码我会放到点餐系统里，购买我点餐系统课程的同学，记得去刷新下之前的网盘链接，就可以获取最新的代码了 演示视频也已经录制出来了，大家可以去看下 [图片] 完整的点餐系统，包含Java后台和扫码点餐小程序，效果图如下。 [图片] [图片]

背景 由于在项目中遇到需要同时选择日期和时间的需求，所以自己写了一个可以动态配置format格式的时间选择器 效果图 [图片] wxml [代码]<view class="view-body"> <text class='item-key'>{{title}}<text style="color:red" wx:if="{{isRequired}}">*</text></text> <view class="item-value"> <picker mode="multiSelector" bindchange="bindPickerChange" bindcolumnchange="bindPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}"> <input disabled="{{true}}" value='{{value}}' name='{{name}}' /> <image class="img-arrow" src='/images/date_icon.png' /> </picker> </view> </view> [代码] js [代码]Component({ behaviors: ['wx://form-field'], properties: { title: { type: String }, name: { type: String }, isRequired: { type: Boolean }, format: { type: String } }, data: {}, lifetimes: { attached: function() { //当前时间 年月日 时分秒 const date = new Date() const curYear = date.getFullYear() const curMonth = date.getMonth() + 1 const curDay = date.getDate() const curHour = date.getHours() const curMinute = date.getMinutes() const curSecond = date.getSeconds() //记录默认年份 后面加载二月份天数 this.setData({ chooseYear: curYear }) //初始化时间选择轴 this.initColumn(curMonth) //不足两位的前面好补0 因为后面要获取在时间轴上的索引 时间轴初始化的时候都是两位 let showMonth = curMonth < 10 ? ('0' + curMonth) : curMonth let showDay = curDay < 10 ? ('0' + curDay) : curDay let showHour = curHour < 10 ? ('0' + curHour) : curHour let showMinute = curMinute < 10 ? ('0' + curMinute) : curMinute let showSecond = curSecond < 10 ? ('0' + curSecond) : curSecond //当前时间在picker列上面的索引 为了当打开时间选择轴时选中当前的时间 let indexYear = this.data.years.indexOf(curYear + '') let indexMonth = this.data.months.indexOf(showMonth + '') let indexDay = this.data.days.indexOf(showDay + '') let indexHour = this.data.hours.indexOf(showHour + '') let indexMinute = this.data.minutes.indexOf(showMinute + '') let indexSecond = this.data.seconds.indexOf(showSecond + '') let multiIndex = [] let multiArray = [] let value = '' let format = this.properties.format; if (format == 'yyyy-MM-dd') { multiIndex = [indexYear, indexMonth, indexDay] value = `${curYear}-${showMonth}-${showDay}` multiArray = [this.data.years, this.data.months, this.data.days] } if (format == 'HH:mm:ss') { multiIndex = [indexHour, indexMinute, indexSecond] value = `${showHour}:${showMinute}:${showSecond}` multiArray = [this.data.hours, this.data.minutes, this.data.seconds] } if (format == 'yyyy-MM-dd HH:mm') { multiIndex = [indexYear, indexMonth, indexDay, indexHour, indexMinute] value = `${curYear}-${showMonth}-${showDay} ${showHour}:${showMinute}` multiArray = [this.data.years, this.data.months, this.data.days, this.data.hours, this.data.minutes] } if (format == 'yyyy-MM-dd HH:mm:ss') { multiIndex = [indexYear, indexMonth, indexDay, indexHour, indexMinute, indexSecond] value = `${curYear}-${showMonth}-${showDay} ${showHour}:${showMinute}:${showSecond}` multiArray = [this.data.years, this.data.months, this.data.days, this.data.hours, this.data.minutes, this.data.seconds] } this.setData({ value, multiIndex, multiArray, curMonth, chooseYear: curYear, }) } }, /** * 组件的方法列表 */ methods: { //获取时间日期 bindPickerChange: function(e) { this.setData({ multiIndex: e.detail.value }) const index = this.data.multiIndex let format = this.properties.format var showTime = '' if (format == 'yyyy-MM-dd') { const year = this.data.multiArray[0][index[0]] const month = this.data.multiArray[1][index[1]] const day = this.data.multiArray[2][index[2]] showTime = `${year}-${month}-${day}` } if (format == 'HH:mm:ss') { const hour = this.data.multiArray[0][index[0]] const minute = this.data.multiArray[1][index[1]] const second = this.data.multiArray[2][index[2]] showTime = `${hour}:${minute}:${second}` } if (format == 'yyyy-MM-dd HH:mm') { const year = this.data.multiArray[0][index[0]] const month = this.data.multiArray[1][index[1]] const day = this.data.multiArray[2][index[2]] const hour = this.data.multiArray[3][index[3]] const minute = this.data.multiArray[4][index[4]] showTime = `${year}-${month}-${day} ${hour}:${minute}` } if (format == 'yyyy-MM-dd HH:mm:ss') { const year = this.data.multiArray[0][index[0]] const month = this.data.multiArray[1][index[1]] const day = this.data.multiArray[2][index[2]] const hour = this.data.multiArray[3][index[3]] const minute = this.data.multiArray[4][index[4]] const second = this.data.multiArray[5][index[5]] showTime = `${year}-${month}-${day} ${hour}:${minute}:${second}` } this.setData({ value: showTime }) this.triggerEvent('dateTimePicker', showTime) }, //初始化时间选择轴 initColumn(curMonth) { let years = [] let months = [] let days = [] let hours = [] let minutes = [] let seconds = [] for (let i = 1990; i <= 2099; i++) { years.push(i + '') } for (let i = 1; i <= 12; i++) { if (i < 10) { i = "0" + i; } months.push(i + '') } if (curMonth == 1 || curMonth == 3 || curMonth == 5 || curMonth == 7 || curMonth == 8 || curMonth == 10 || curMonth == 12) { for (let i = 1; i <= 31; i++) { if (i < 10) { i = "0" + i; } days.push(i + '') } } if (curMonth == 4 || curMonth == 6 || curMonth == 9 || curMonth == 11) { for (let i = 1; i <= 30; i++) { if (i < 10) { i = "0" + i; } days.push(i + '') } } if (curMonth == 2) { days=this.setFebDays() } for (let i = 0; i <= 23; i++) { if (i < 10) { i = "0" + i; } hours.push(i + '') } for (let i = 0; i <= 59; i++) { if (i < 10) { i = "0" + i; } minutes.push(i + '') } for (let i = 0; i <= 59; i++) { if (i < 10) { i = "0" + i; } seconds.push(i + '') } this.setData({ years, months, days, hours, minutes, seconds }) }, /** * 列改变时触发 */ bindPickerColumnChange: function(e) { //获取年份 用于计算改年的2月份为平年还是闰年 if (e.detail.column == 0 && this.properties.format != 'HH:mm:ss') { let chooseYear = this.data.multiArray[e.detail.column][e.detail.value]; this.setData({ chooseYear }) if (this.data.curMonth == '02' || this.data.chooseMonth == '02') { this.setFebDays() } } //当前第二为月份时需要初始化当月的天数 if (e.detail.column == 1 && this.properties.format != 'HH:mm:ss') { let num = parseInt(this.data.multiArray[e.detail.column][e.detail.value]); let temp = []; if (num == 1 || num == 3 || num == 5 || num == 7 || num == 8 || num == 10 || num == 12) { //31天的月份 for (let i = 1; i <= 31; i++) { if (i < 10) { i = "0" + i; } temp.push("" + i); } this.setData({ ['multiArray[2]']: temp }); } else if (num == 4 || num == 6 || num == 9 || num == 11) { //30天的月份 for (let i = 1; i <= 30; i++) { if (i < 10) { i = "0" + i; } temp.push("" + i); } this.setData({ ['multiArray[2]']: temp }); } else if (num == 2) { //2月份天数 this.setFebDays() } } let data = { multiArray: this.data.multiArray, multiIndex: this.data.multiIndex }; data.multiIndex[e.detail.column] = e.detail.value; this.setData(data); }, //计算二月份天数 setFebDays() { let year = parseInt(this.data.chooseYear); let temp = []; if (year % (year % 100 ? 4 : 400) ? false : true) { for (let i = 1; i <= 29; i++) { if (i < 10) { i = "0" + i; } temp.push("" + i); } this.setData({ ['multiArray[2]']: temp, chooseMonth: '02' }); } else { for (let i = 1; i <= 28; i++) { if (i < 10) { i = "0" + i; } temp.push("" + i); } this.setData({ ['multiArray[2]']: temp, chooseMonth: '02' }); } return temp; } }, }) [代码] wxss [代码].view-body { display: flex; align-items: center; padding: 4% 0%; border-bottom: 1px solid #eee; } .item-key { font-size: 30rpx; color: #666; width: 25%; } .item-value { flex-grow: 1; font-size: 31rpx; position: relative; margin-left: 3%; } .img-arrow { width: 45rpx; height: 45rpx; padding-right: 10rpx; position: absolute; top: 50%; transform: translateY(-50%); right: 5rpx; } [代码] 使用 在你页面中的json中添加引用，路径根据你的实际工程目录来写。 [代码]{ "usingComponents": { "DateTimePicker": "/components/datetimepicker/datetimepicker" } } [代码] wxml中添加 [代码]<DateTimePicker title='选择时间' isRequired='true' bind:dateTimePicker='onDateTimePicker' name='time' format='yyyy-MM-dd HH:mm:ss'/> [代码] 说明 title：表单组件的名称 isRequired：是否必填项 dateTimePicker：为选中确认回调 name：为表单点击 form 表单中 form-type 为 submit 的 button 组件时，会将表单组件中的 value 值进行提交，需要在表单组件中加上 name 来作为 key format：时间格式化参数 支持：‘yyyy-MM-dd HH:mm:ss’,‘HH:mm:ss’,‘yyyy-MM-dd HH:mm’,‘yyyy-MM-dd’ 四种 开发者可以根据自己的需求调整组件样式 最后代码片段如下： https://developers.weixin.qq.com/s/PzmDvcmi79fI

问题 在IOS端的时候,使用日期选择组件时,如果按照官方文档使用"-"作为分隔符,将会导致new Date不能正确转换时间。 解决方法 此时,我们可以使用如下replace函数将"-",转换成"/"即可。 PS:这个bug主要是出现在IOS端,而且是没有报错的,希望可以帮到大家。

最近开发代码时发现，日期格式化官方没有给出一个很好地解决方案，虽然使用wxs文件在wxml中可以引入使用，但是无法获取实时数据。 由于小程序中的js跟es5的规则类似，为便于使用工具性方法获取实时日期信息或根据传递的日期获取指定格式的日期信息。 下面将代码贴出，使用时，请在指定js中引入创建的工具js文件即可。 示例： const util = require('util.js'); let date = new Date(); console.log(util.formatDate(date, 'yyyy-mm-dd hh:mi:ss')); 如果是使用云开发，请参考官方云开发数据库查询文档，进行日期格式化。 /** * date 为日期Date类型， * 日期格式化信息 matter 定义 * 年:yyyy/YYYY/yy/YY * 月:mm/MM (不足两位用0补全) * 日:dd/DD (不足两位用0补全) * 时:hh/HH (24小时制) * 分:mi/MI (不足两位用0补全) * 秒:ss/SS (不足两位用0补全) */ const formatDate = function (date, matter) { let year = date.getFullYear().toString(); let month = (date.getMonth() + 1).toString(); month = (month.length > 1) ? month : ('0' + month); let day = date.getDate().toString(); day = (day.length > 1) ? day : ('0' + day); let hours = date.getHours().toString(); hours = (hours.length > 1) ? hours : ('0' + hours); let minutes = date.getMinutes().toString(); minutes = (minutes.length > 1) ? minutes : ('0' + minutes); let seconds = date.getSeconds().toString(); seconds = (seconds.length > 1) ? seconds : ('0' + seconds); let retVal = matter; if (matter.indexOf('yyyy') >= 0) { retVal = retVal.replace('yyyy', year); } else if (matter.indexOf('YYYY') >= 0) { retVal = retVal.replace('YYYY', year); } else if (matter.indexOf('yy') >= 0) { retVal = retVal.replace('yy', year.substring(2)); } else if (matter.indexOf('YY') >= 0) { retVal = retVal.replace('YY', year.substring(2)); } if (matter.indexOf('mm') > 0) { retVal = retVal.replace('mm', month); } else if (matter.indexOf('MM') > 0) { retVal = retVal.replace('MM', month); } if (matter.indexOf('dd') > 0) { retVal = retVal.replace('dd', day); } else if (matter.indexOf('DD') > 0) { retVal = retVal.replace('DD', day); } if (matter.indexOf('hh') > 0) { retVal = retVal.replace('hh', hours); } else if (matter.indexOf('HH') > 0) { retVal = retVal.replace('HH', hours); } if (matter.indexOf('mi') > 0) { retVal = retVal.replace('mi', minutes); } else if (matter.indexOf('MI') > 0) { retVal = retVal.replace('MI', minutes); } if (matter.indexOf('ss') > 0) { retVal = retVal.replace('ss', seconds); } else if (matter.indexOf('SS') > 0) { retVal = retVal.replace('SS', seconds); } return retVal; } exports.formatDate = formatDate;

云数据库查询怎么将查询的date类型日期结果转换格式？ 或者dateToString怎么在条件查询中使用？

背景： 之前不会用聚合，因此把数据库结构分为了用户表、帖子表、喜欢表。小程序端请求一次列表，要根据帖子列表，循环查询用户表，并且还要做一系列的逻辑运算处理，计算当前帖子的权限、是否喜欢过、喜欢人数、是否有这个帖子管理权限等信息。 这样做有很多弊端： 处理速度慢，资源耗费严重，循环查询肯定慢且耗费资源，一个列表需要21次查询。需要写大量逻辑处理代码，如计算管理权限，喜欢数量、当前用户是否喜欢，格式处理等等。于是使用聚合进行了优化： 跨表查询数据格式化逻辑计算，权限判断、是否喜欢等数据统计，喜欢总人数权限判断，是否为管理员限制输出效果： 之前：上百行代码，多次查询，需要单独判断函数，处理时间在3000ms以上之后：几行代码，一次查询，直接查询时算出结果，处理时间在300ms以内 数据库结构 [图片] 代码实现： const { OPENID } = cloud.getWXContext(context) //构建查询条件 let query = null switch (Number(event.listType)) { case 0: query = db.collection('post').aggregate() .match({ //0我的 '_openid': OPENID }) .sort({ createTime: -1 }) .skip(20 * (event.pageNum - 1)) .limit(20) break; case 1: //1 随机 query = db.collection('post').aggregate() .match({ public: true, // feeling: _.gte(50) }) .sample({ size: 20 }) break; case 2: query = db.collection('post').aggregate() .match({ //2喜欢 likes: _.all([OPENID]) }) .sort({ createTime: -1 }) .skip(20 * (event.pageNum - 1)) .limit(20) break; case 4: query = db.collection('post').aggregate() .match({ //4指定 _id: event.id }) .sort({ createTime: -1 }) .skip(20 * (event.pageNum - 1)) .limit(20) break; } //使用聚合处理后续数据 let listData = await query .lookup({ from: "user", localField: "_openid", foreignField: "_id", as: "postList" })//联表查询用户表 .replaceRoot({ newRoot: $.mergeObjects([$.arrayElemAt(['$postList', 0]), '$$ROOT']) })//将用户表输出到根节点 .addFields({ day: $.dayOfMonth('$createTime'), month: $.month('$createTime'), year: $.year('$createTime'), isLike: $.in([OPENID, '$likes']), //是否喜欢 isLiked: $.in([OPENID, '$liked']), //是否喜欢过 isAdmin: $.eq([OPENID, 'oy0T-4yk7lCRFGDefpFC4Yvx_ppU']),//是否管理员 isAuthor: $.eq(['$_openid', OPENID]),//是否为作者 like: $.size('$likes'), //喜欢该帖子数 face: $.switch({ branches: [ { case: $.gte(['$feeling', 90]), then: 9 }, { case: $.gte(['$feeling', 80]), then: 8 }, { case: $.gte(['$feeling', 70]), then: 7 }, { case: $.gte(['$feeling', 60]), then: 6 }, { case: $.gte(['$feeling', 50]), then: 5 }, { case: $.gte(['$feeling', 40]), then: 4 }, { case: $.gte(['$feeling', 30]), then: 3 }, { case: $.gte(['$feeling', 20]), then: 2 }, { case: $.gte(['$feeling', 10]), then: 1 } ], default: 0 }) //根据心情值判断对应表情 }) .project({ postList: 0, userInfo: 0, liked: 0, likes: 0, city: 0, province: 0, country: 0, language: 0, nlp: 0, saveType: 0, }) //清楚掉不需要的数据 .end() return listData

相关api 官方参考文档 [代码]Aggregate.lookup Aggregate.limit Aggregate.skip Aggregate.count [代码] 实现原理 基于 [代码]aggregate[代码] 操作集合 使用 [代码]count[代码] 获取总数量和页数 使用 [代码]limit[代码] 限制一次返回的数量 使用 [代码]skip[代码] 实现发送下一页的数据 使用 [代码]lookup[代码] 实现联表 示例 假设 [代码]orders[代码] 集合有以下数据 [代码][ {"_id":4,"book":"novel 1","price":30,"quantity":2}, {"_id":5,"book":"science 1","price":20,"quantity":1}, {"_id":6} ] [代码] 假设 [代码]books[代码] 集合有以下数据 [代码][ {"_id":"book1","author":"author 1","category":"novel","stock":10,"time":1564456048486,"title":"novel 1"}, {"_id":"book3","author":"author 3","category":"science","stock":30,"title":"science 1"}, {"_id":"book4","author":"author 3","category":"science","stock":40,"title":"science 2"}, {"_id":"book2","author":"author 2","category":"novel","stock":20,"title":"novel 2"}, {"_id":"book5","author":"author 4","category":"science","stock":50,"title":null}, {"_id":"book6","author":"author 5","category":"novel","stock":"60"} ] [代码] 实现 [代码]orders[代码] 和 [代码]books[代码] 联表查询和分页的关键代码 [代码]const pageSize = 10 // 每页数据量，可以作为云函数的入参传入 const currPage = 1 // 查询的当前页数，可以作为云函数的入参传入 const db = cloud.database() const $ = db.command.aggregate // 定义联表实例 const aggregateInstance = db.collection('orders').aggregate() .lookup({ from: 'books', localField: 'book', foreignField: 'title', as: 'bookList', }) const { totalCount } = await aggregateInstance.count('totalCount').end() // 计算总页数 const totalPage = totalCount === 0 ? 0 : totalCount <= pageSize ? 1 : parseInt(totalCount / pageSize) + 1 // 分页查询数据 const data = await aggregateInstance.replaceRoot({ newRoot: $.mergeObjects([ $.arrayElemAt(['$bookList', 0]), '$$ROOT' ]) }) .project({ bookList: 0 }) .limit(pageSize) .skip(currPage * pageSize) .end() return {currPage, pageSize, totalPage, totalCount, data} [代码] 预期输出结果 [代码]{ currPage: 1, pageSize: 10, totalPage: 1, totalCount: 3, data: [ { "_id": 4, "title": "novel 1", "author": "author 1", "category": "novel", "stock": 10, "book": "novel 1", "price": 30, "quantity": 2 }, { "_id": 5, "category": "science", "title": "science 1", "author": "author 3", "stock": 30, "book": "science 1", "price": 20, "quantity": 1 }, { "_id": 6, "category": "science", "author": "author 4", "stock": 50, "title": null }] } [代码] 如有错误，欢迎拍砖 (▽)

已经试过传入new Date()或者db.serverDate()，均不行。 看文档里聚合操作match的时候不支持聚合操作符，我也把$改为_试过，直接报错 [图片] 最后是下面的代码，可以看后面的查询结果，我特地和collection().get()进行了比较，后者是能正常返回数据的，而前者返回空集，请问大家一般这样是怎么处理的 return { code: 200, list: await db.collection('task').aggregate().match({ available: true, begin_time:$.lte(db.serverDate()) }).end(), list1:await db.collection('task').where({ available: true, begin_time:_.lte(db.serverDate()) }).get() } [图片]

- 当前 Bug 的表现（可附上截图） 在开发者工具上这段代码能返回正确的结果 [图片] 但是在手机上返回NaN [图片] - 预期表现 希望手机上对于这段代码能有同样的表现

之前在看别人代码的时候，就看到云函数里面支持 db.serverDate() 云函数的时间使用  db.serverDate()，请求接口时的返回值形如："2018-09-21T06:41:54.900Z" 的写法，好几次想要继续学习下，都忘记了，今天有空可以好好看看 https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-sdk-api/database/Database.serverDate.html 那么平时我们在往数据库里面存的时候，是倾向于时间戳还是日期呢？ 时间戳转日期格式化函数 https://developers.weixin.qq.com/community/develop/doc/000e6adde049607a0c67aa8415b800 日期转时间戳相关问题 https://developers.weixin.qq.com/community/develop/doc/000e6c760b4e384894376dfb751000 其实这两个地方都是可以通过wxs来完成转化的 https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/

一篇文章了解云开发 定时触发器 比如一条记录有 A B C 三个字段，C需要通过A、B来计算得到，这种形式如何实现？如果A、B变了，C要同步更新，运行存在一定延迟时间 具体是这样的，我有个在线答题小程序，强化练习模块，该模块的题目需要根据用户最后一次答题得分，拉去某个正确率范围的题目 具体比如说： 我最后一次答题得分80分，那么我强化练习拉的是正确率在50%以下的题目，那么每个题目的正确率需要通过该题的答对人数和总答题人数来计算 就是 答题记录有三个字段 A-答对人数、 B-所有答题人数、 C-该题正确率=A/B 由于目前云开发数据库能力不足以提供这种update xx set C=A/B 的支持，所以这部分逻辑要自己控制， 我是通过写云函数、定时触发器来实现的，具体官方链接如下 https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/functions/triggers.html [图片] 每十分钟执行一次，具体见上图 占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位占位 具体代码如下 [图片] 占位 [图片] 占位

因为小程序不是每天都使用，但是小程序一般只调用一次云函数，所以想把云函数中传入的event暂存起来，求大神支招。

如下图中的下载地址，有办法通过api拿到吗？ 求各位大佬指教啊。 [图片]

[图片][图片] 使用wx.cloud.getTempFileUrl 获取的tempFileUrl 缺失了sign 和&t 两部分参数。下载得到文件不是最新的。这样就无法实现每次更新云存储文件再进行下载，这个该怎么解决呢？

【已解决】 获取到的地址然后添加上当前时间戳，就能及时获得最新的文件啦 在工具中看到的真实下载地址是带有sign和t的： [图片] 但是通过getTempFileURL获取到的tempFileURL只是没有sign和t， 下载到的文件还是久的

本人因项目需要做一个九宫格图片预览 发现微信朋友圈图片排版很好 一张图片和多张图片灵活排版看起来不会很死板 本人秉承有轮子就不必要在造的原则，在网上找了很久没有找到一个合适的小程序组件 所以决定自己造一个出来 下面是代码片段欢迎大家指出不足之处 https://developers.weixin.qq.com/s/sg9vWMmB7vgn

随着小程序云开发越来越成熟，现在用云开发可以做的事情也越来越多，今天就来带大家实现小程序朋友圈功能。 知识技能点 1，小程序云开发 2，小程序云存储 3，小程序云数据库 4，图片大图预览 5，图片选择与删除 先给大家画个发布的流程图 [图片] 下面是我们真正存到数据库里的数据。 [图片] 然后我们在朋友圈页只需要请求数据库里的数据，然后展示到页面就如下图所示 [图片] 所以我们接下来就来实现发布和展示的功能 发布朋友圈 一，首先要创建一个小程序项目 这里就不多说了，如果你还不知道如何创建小程序项目可以去翻看下我之前的文章，也可以看下我录制的《10小时零基础入门小程序开发》 注意：一定要用自己的appid，所以你需要注册一个小程序（个人的就行） 二，创建发布页面 我们发布页布局比较简单，一个文字输入框，一个图片展示区域，一个发布按钮。 [图片] 先把发布页布局wxml贴出来 [代码]<textarea class="desc" placeholder="请输入内容" bindinput="getInput" /> <view class="iamgeRootAll"> <view class="imgRoot" wx:for="{{imgList}}" wx:key="{{index}}" bindtap="ViewImage" data-url="{{imgList[index]}}"> <view wx:if="{{imgList.length==(index+1)&& imgList.length<8}}" class="imgItem" bindtap="ChooseImage"> <image class="photo" src="../../images/photo.png"></image> </view> <view wx:else class="imgItem" data-index="{{index}}"> <image class="img" src='{{item}}' mode='aspectFill'></image> <image class="closeImg" bindtap="DeleteImg" src="../../images/close.png" data-index="{{index}}"></image> </view> </view> <!-- 一开始用来占位 --> <view wx:if="{{imgList.length==0}}" class="imgItem" bindtap="ChooseImage"> <image class="photo" src="../../images/photo.png"></image> </view> </view> <button type="primary" bindtap="publish">发布朋友圈</button> [代码] 这里唯一的难点，就是下面的图片分布，因为我们每次用户选择的图片个数不固定，这就要去分情况考虑了。 wx:if="{{imgList.length==(index+1)&& imgList.length<8}}"这段代码是用来控制我们发布的那个➕ 号的显示与隐藏的。 [图片] 这个➕号有下面三种情况需要考虑 1，没有添加任何图片时，只显示➕号 2，有图片，但是不满8条时，我们需要展示图片和加号。 3，有8张图片了，加号就要隐藏了。 仔细看下上面的wxml代码，代码里都有体现。 三，实现图片选择和显示功能 图片选择很简单，就用官方的api即可。实现代码如下 [代码] //选择图片 ChooseImage() { wx.chooseImage({ count: 8 - this.data.imgList.length, //默认9,我们这里最多选择8张 sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有 sourceType: ['album'], //从相册选择 success: (res) => { console.log("选择图片成功", res) if (this.data.imgList.length != 0) { this.setData({ imgList: this.data.imgList.concat(res.tempFilePaths) }) } else { this.setData({ imgList: res.tempFilePaths }) } } }); }, [代码] 这里单独说明下 8 - this.data.imgList.length。因为我这里规定最多只能上传8张图片。所以用了count8 ,至于后面为什么要减去this.data.imgList.length。主要是我们用户不一定一次选择8张图片，有可能第一次选择2张，第二次选择2张。。。 所以我们做选择时，每次传入的数量肯定不一样的。而这个imgList.length就是用户已经选择的图片个数。用8减去已选择的个数，就是下次最多能选择的了。 上面代码在选择成功后，会生成一个临时的图片链接。如下图所示，这个链接既可以用来展示我们已经选择的图片，后面的图片上传也要用到。 [图片] 四，实现图片删除功能 我们每张图片的右上角有个删除按钮，点击删除按钮可以实现图片的删除。 [图片] 这里比较简单，把代码贴给大家 [代码] //删除图片 DeleteImg(e) { wx.showModal({ title: '要删除这张照片吗？', content: '', cancelText: '取消', confirmText: '确定', success: res => { if (res.confirm) { this.data.imgList.splice(e.currentTarget.dataset.index, 1); this.setData({ imgList: this.data.imgList }) } } }) }, [代码] 五，发布功能 1，发布之前我们需要先校验下内容和图片是否为空 [图片] 2，由于我们发布的时候要保证所有的图片都要上传成功，所以这里我们这么处理。 [代码] const promiseArr = [] //只能一张张上传 遍历临时的图片数组 for (let i = 0; i < this.data.imgList.length; i++) { let filePath = this.data.imgList[i] let suffix = /\.[^\.]+$/.exec(filePath)[0]; // 正则表达式，获取文件扩展名 //在每次上传的时候，就往promiseArr里存一个promise，只有当所有的都返回结果时，才可以继续往下执行 promiseArr.push(new Promise((reslove, reject) => { wx.cloud.uploadFile({ cloudPath: new Date().getTime() + suffix, filePath: filePath, // 文件路径 }).then(res => { // get resource ID console.log("上传结果", res.fileID) this.setData({ fileIDs: this.data.fileIDs.concat(res.fileID) }) reslove() }).catch(error => { console.log("上传失败", error) }) })) } //保证所有图片都上传成功 Promise.all(promiseArr).then(res => { //图片上传成功了，才会执行到这。。。 }) [代码] 我们这里用Promise来确保所有的图片都上传成功了，才执行后面的操作。 把完整的发布代码贴给大家吧 [代码]/** * 编程小石头 * wehchat：2501902696 */ let app = getApp(); Page({ data: { imgList: [], fileIDs: [], desc: '' }, //获取输入内容 getInput(event) { console.log("输入的内容", event.detail.value) this.setData({ desc: event.detail.value }) }, //选择图片 ChooseImage() { wx.chooseImage({ count: 8 - this.data.imgList.length, //默认9,我们这里最多选择8张 sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有 sourceType: ['album'], //从相册选择 success: (res) => { console.log("选择图片成功", res) if (this.data.imgList.length != 0) { this.setData({ imgList: this.data.imgList.concat(res.tempFilePaths) }) } else { this.setData({ imgList: res.tempFilePaths }) } } }); }, //删除图片 DeleteImg(e) { wx.showModal({ title: '要删除这张照片吗？', content: '', cancelText: '取消', confirmText: '确定', success: res => { if (res.confirm) { this.data.imgList.splice(e.currentTarget.dataset.index, 1); this.setData({ imgList: this.data.imgList }) } } }) }, //上传数据 publish() { let desc = this.data.desc let imgList = this.data.imgList if (!desc || desc.length < 6) { wx.showToast({ icon: "none", title: '内容大于6个字' }) return } if (!imgList || imgList.length < 1) { wx.showToast({ icon: "none", title: '请选择图片' }) return } wx.showLoading({ title: '发布中...', }) const promiseArr = [] //只能一张张上传 遍历临时的图片数组 for (let i = 0; i < this.data.imgList.length; i++) { let filePath = this.data.imgList[i] let suffix = /\.[^\.]+$/.exec(filePath)[0]; // 正则表达式，获取文件扩展名 //在每次上传的时候，就往promiseArr里存一个promise，只有当所有的都返回结果时，才可以继续往下执行 promiseArr.push(new Promise((reslove, reject) => { wx.cloud.uploadFile({ cloudPath: new Date().getTime() + suffix, filePath: filePath, // 文件路径 }).then(res => { // get resource ID console.log("上传结果", res.fileID) this.setData({ fileIDs: this.data.fileIDs.concat(res.fileID) }) reslove() }).catch(error => { console.log("上传失败", error) }) })) } //保证所有图片都上传成功 Promise.all(promiseArr).then(res => { wx.cloud.database().collection('timeline').add({ data: { fileIDs: this.data.fileIDs, date: app.getNowFormatDate(), createTime: db.serverDate(), desc: this.data.desc, images: this.data.imgList }, success: res => { wx.hideLoading() wx.showToast({ title: '发布成功', }) console.log('发布成功', res) wx.navigateTo({ url: '../pengyouquan/pengyouquan', }) }, fail: err => { wx.hideLoading() wx.showToast({ icon: 'none', title: '网络不给力....' }) console.error('发布失败', err) } }) }) }, }) [代码] 到这里我们发布的功能就实现了，发布功能就如下面这个流程图所示。 [图片] 我们最终的目的是要把文字和图片链接存到云数据库。把图片文件存到云存储。这就是云开发的方便之处，不用我们编写后台代码，就可以轻松实现后台功能。 接下来讲朋友圈展示页。 [图片] 这个页面主要做的就是 1，从云数据库读取数据 2，展示列表数据 1，读取数据 这里读取数据挺简单，就是从云数据库读数据，这里我们做了一个排序，就是最新发布的数据在最上面。代码如下 [代码]wx.cloud.database().collection('timeline') .orderBy('createTime', 'desc') //按发布视频排序 .get({ success(res) { console.log("请求成功", res) that.setData({ dataList: res.data }) }, fail(res) { console.log("请求失败", res) } }) [代码] 云数据库的读取也比较简单，有不会的同学，或者没有听说过小程序云开发的同学，可以去翻看下我之前发的文章，也可以看下我录的《10小时零基础入门小程序云开发》 2，朋友圈列表的展示 这里也比较简单，直接把布局代码贴给大家。dataList就是我们第一步请求到的数据。 [代码]<block wx:for="{{dataList}}" wx:key="index"> <view class="itemRoot"> <view> <text class="desc">{{item.desc}}</text> </view> <view class="imgRoot"> <block class="imgList" wx:for="{{item.fileIDs}}" wx:for-item="itemImg" wx:key="index"> <image class="img" src='{{itemImg}}' mode='aspectFill' data-img='{{[itemImg,item.fileIDs]}}' bindtap="previewImg"></image> </block> </view> </view> </block> [代码] 3，这里还有一个图片预览的功能 功能实现很简单就下面几行代码，但是我们从wxml获取组件上的数据时比较麻烦。 [代码] // 预览图片 previewImg: function(e) { let imgData = e.currentTarget.dataset.img; console.log("eeee", imgData[0]) console.log("图片s", imgData[1]) wx.previewImage({ //当前显示图片 current: imgData[0], //所有图片 urls: imgData[1] }) }, [代码] 4,点击图片时通过 data- 获取图片列表和当前图片数据 我们点击组件时，可以通过data- 传递数据，但是一个点击如果像传多条数据呢。这时候可以用 data-xxx=’{{[xxx,xxx]}}’ 来传递数据了。如下代码 [代码]<block wx:for="{{item.fileIDs}}" wx:key="item2" wx:for-item="item2"> <image src='{{item2}}' data-img='{{[item2,item.fileIDs]}}' mode='aspectFill' bindtap="previewImg"></image> </block> //我们再js里可以接收两个数据 previewImg: function(e) { let imgData = e.currentTarget.dataset.img; console.log("item2", imgData[0]) console.log("item.fileIDs", imgData[1]) //大图预览 wx.previewImage({ //当前显示图片 current: imgData[0], //所有图片 urls: imgData[1] }) }, [代码] 上面代码就可以实现，一次点击，通过data- 传递多个数据到js里。 到这里我们就完整的实现了，朋友圈的发布与展示了 [图片] 朋友圈展示的比较简陋，后期再抽时间做美化吧。 源码我已经上传到网盘，需要的同学可以加我微信2501902696获取 [图片] 后面我也会录制一套视频来专门讲解。敬请关注。

1. 写在前面 1.1 微信开发者工具现状 具备一些基本的通用IDE功能，但是第三方的支持扩展需要加强。 1.2 开发者工具自带的编辑器扩展功能 可能很多老铁没用过官方的微信开发者工具的编辑器扩展（我一般称为编辑器插件）。官方把这块功能也隐藏得很深，也没有相关文档介绍，但是预留了相关的入口。合理利用第三方编辑器插件，可以极大的提升开发效率。下面先来看看官方预留的编辑器插件入口： [图片] （图一） 2. 几个不错插件安装效果 2.1 标签高亮插件-vincaslt.highlight-matching-tag [图片] 功能：可以把当前行对应的标签开头和结尾高亮起来，让开发者一目了然 2.2 小程序开发助手插件-overtrue.miniapp-helper [图片] 功能：必须要说的这个是纯国产的插件，里面的代码片段功能很全，具体介绍：小程序开发助手 - Visual Studio Marketplace https://marketplace.visualstudio.com/items?itemName=overtrue.miniapp-helper 2.3 minapp插件-qiu8310.minapp-vscode [图片] 功能：这个是今天的明星插件，里面的跳转功能很强，可以在wxml里CMD+点击对应变量/方法和CSS样式名称直接跳转到对应的js/wxss文件对应的地方。具体的下面是官方介绍： 标签名与属性自动补全 根据组件已有的属性，自动筛选出对应支持的属性集合 属性值自动补全 点击模板文件中的函数或属性跳转到 js/ts 定义的地方（纯 wxml 或 pug 文件才支持，vue 文件不完全支持） 样式名自动补全（纯 wxml 或 pug 文件才支持，vue 文件不完全支持） 在 vue 模板文件中也能自动补全，同时支持 pug 语言 支持 link（纯 wxml 或 pug 文件才支持，vue 文件不支持） 自定义组件自动补全（纯 wxml 文件才支持，vue 或 pug 文件不支持） 模板文件中 js 变量高亮（纯 wxml 或 pug 文件才支持，vue 文件不支持） 内置 snippets 支持 emmet 写法 wxml 格式化 3. DIY添加适合自己的插件 3.1 添加插件功能简介 仔细研究过微信开发者工具的人可能知道或者了解，其实微信开发者工具编辑器跟微软的开源编辑器vsCode「颇有渊源」。再深入研究发现，vsCode的插件完全可以无缝移植到微信开发者工具编辑器里来，所以今天的内容就是移植vsCode的插件到微信开发者工具。咱们先看看微信开发者工具自带的「管理编辑器扩展」功能（图1标注为2的地方） [图片]（图二） 3.2 插件添加具体步骤 3.2.1 安装插件，获取插件文件 安装vsCode并安装你需要移植的插件，必须要说的是vsCode的插件非常多，好的插件也很多。相关安装，搜索插件教程建议大家百度相关教程。或者直接下载vsCode亲自体验，插件安装过程还是非常简单的。 3.2.2 复制插件文件夹 找到vsCode相关插件的安装文件夹： 操作系统 安装路径 windows %USERPROFILE%.vscode\extensions macOS ~/.vscode/extensions Linux ~/.vscode/extensions 复制对应插件文件夹到微信开发者工具的「打开编辑器扩展目录」（图一标注为1的地方） 3.2.3 添加插件配置文件 新版开发者工具直接进入图形设置，扩展设置里勾选对应插件即可。如下图： [图片] 旧版操作方法：进入微信开发者工具的「管理编辑器扩展」功能页面，在尾端加入对应添加的插件名称。以以上3个介绍的插件为例，在原来的尾端加入： “vincaslt.highlight-matching-tag”, “overtrue.miniapp-helper”, “qiu8310.minapp-vscode” 3.2.4 见证奇迹 重启微信开发者工具，见证插件带来的编码便利吧！ 4 需要注意的 vsCode的插件很多，小程序相关的也越来越多了，但是插件质量参差不齐，所以安装时建议选择「标星」star比较多的插件。

简介 一门热门的编程语言通常会留下一些带惊喜的「彩蛋」让你去自己深挖，小程序也是如此。此文是收集与整理官方未公布的一些彩蛋。希望大家多多提供线索。本文仅整理官方未公布的小程序相关包括但不限于：组件属性、功能、方法、API。 组件类 scroll-view里面的隐藏属性 throttle="{{false}}" 功能：关闭函数节流功能，可以更精准的bindScroll。但也更耗手机性能 [代码]app.json里面配置关闭同层渲染功能： "window": { "renderingMode": "seperated" } [代码] 收集中… 功能类 wx:for支持Object列表渲染 [代码]{ '2018-1-9':{ address: '....', name: '....' }, '2018-1-10':{ address: '....', name: '....' }, '2018-1-11':{ address: '....', name: '....' } } //wxml <view wx:for="{{obj}}" wx:for-index="key" wx:for-item="value"> {{key}} : {{value.address}} </view> [代码] 2.wx.chooseContact 作用：从手机通讯录中选择联系人并获取相关信息（iPhone下有兼容问题） [代码]参考代码： wx.chooseContact({ success:res=>{ that.customer.name = res.displayName; that.customer.contract = res.phoneNumber; }, complete: function(res) { } }); [代码] 收集中… 开发者工具类 完美支持各种插件安装，详见： 动手打造更强更好用的微信开发者工具-编辑器扩展篇 | 微信开放社区 https://developers.weixin.qq.com/community/develop/article/doc/000a8816e18748dd52f96f8975b413 历史版本的隐藏下载链接 升级开发者工具到最新，种种原因需要恢复旧版，旧版安装包找不到应急处理方法 | 微信开放社区 https://developers.weixin.qq.com/community/develop/article/doc/0008c4833f4450f8e32ab0dbc51013 官方社区类 有几个隐藏的官方的美女甩锅采用非官方账号在社区带节奏。具体我就不点名了。🐶🐶🐶🐶 收集中… 其他未公布的隐藏功能： 给此文点赞后的码农写代码永无BUG ，CP设计的产品人见人爱，BOSS每年收入翻番！ ↓↓↓↓

需求场景如下： [图片] 每天需要把员工的计件工资，以文字形式通过微信发给员工， 如何通过“发送员工”按钮直接进入微信，选择联系人，将文字粘贴发给员工？现在的思路是将“发给员工”按钮作为小程序分享按钮，通过留言将相关文字粘贴发给员工，如下： [图片] 需求是，有没有什么方法，不需要分享小程序，而直接有小程序进入微信，选择联系人进行发送。因为每天要发送很多员工，故希望有个更快捷的发送方式。 望社区大神解答，在下不胜感激！~

我们用云开发的云数据库存数据，难免会遇到数据过多，或者一些过时数据要删除的需求。之前云开发删除数据库只能一条条的删除。要想批量删除很麻烦，近期云开发推出了批量删除数据的方法。甚至可以稍微改造下实现数据库里某个集合（表）里所有数据的删除操作。 老规矩，先看效果图 如删除工资表中2019年9月份的工资 [图片] 可以看到我们成功删除7条数据。 删除所有的工资数据 [图片] 可以看到我们把工资表里768条数据，全部删除了。 接下来我们就来看下具体的实现代码 一，先看官方文档如何写的 [图片] 通过上图可以看到，我们既可以删除单条，又可以删除多条。 [图片] 通过上图可以看到，我们只能结合where语句才能实现批量删除。 再来看下官方给的demo [图片] 一看我们就能知道这是写在云函数里的。所以我们批量删除数据库里的数据，必须是通过云函数来实现批量。 官方文档的地址：https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-server-api/database/collection.remove.html 二，我们就结合具体业务来实现批量删除 1， 首先看下我们的工资表里，有yuefen这个字段 [图片] 比如我们2019年11月所有的人工资填写有误，我们想批量的删除所有 yuefen为 2019.11的数据，对应的代码如下图红色框里的代码。 [图片] 2，作为一个业务代码，我们肯定要把数据做活 所以定义一个输入框，用来输入你要删除的月份。如下图所示 [图片] 3，删除所有数据 同样的我们想删除所有数据，也比较依赖where。那门我们删除所有数据，该怎么匹配where语句呢。翻看官方文档，可以看到官方文档有判断某一个字段是否有值。所以我们编写的删除所有数据的代码如下。 [图片] 这样我们就可以通过判断月份存在，就可以删除所有数据了，因为所有的数据都有月份的。 这样我们就可以实现小程序数据库里数据的批量删除操作了，官方其实也有为我们提供批量更新的操作，感兴趣的同学去官方文档看下就可以了。 https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-server-api/database/collection.update.html [图片] 完整的云函数源码直接给大家贴出来吧。 [代码]const cloud = require('wx-server-sdk') cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV }) const db = cloud.database() exports.main = async(event, context) => { let { type, yuefen } = event try { if (type == 'all') { const _ = db.command return await db.collection('gongzi').where({ yuefen: _.exists(true) //只要月份字段存在，就删除 }).remove() } else { return await db.collection('gongzi').where({ yuefen: yuefen }).remove() } } catch (e) { console.error(e) } } [代码] 后面我会写更多关于小程序，云开发，云数据库的文章，请持续关注。

我们前面学了这么多的小程序基础知识，一直没有用一个实际的案例来把前面的知识点串起来，今天我们就来开发一款简单的《历史上的今天》，来把我们前面的知识点完整的串起来。 老规矩，先看效果图 [图片] 可以看到我们实现了如下功能 1，列表页 2，列表跳转详情页 3，视频播放（其实是假的，后面给大家讲这个视频播放） 4，网络请求 5，列表到详情数据携带 好了，话不多说，我们来直接看代码实现。 一，网络数据的获取 网络数据获取我们用来官方提供的wx.request方法。 下面红色框里就是我们的网络数据获取的代码 [图片] 是不是感觉就这几段代码，很简单，事实上，石头哥写这段代码费老劲了。。。 不是说代码难写。主要是因为我这里用到的是一个三方提供的api，刚开始是想着用豆瓣电影的api，可是。。。 豆瓣之前的免费api好像停了，再去找一些api吧，基本上都收费了。这个api也是找了好久，才找到了百度提供的一个“历史上的今天百科” api，接口很简单如下图： [图片] 我们只需要用这个api，简单的做下get请求，就能请求下来一大堆数据。 [图片] 而这一大堆数据也正是我们所需要的列表数据。 二，首页列表数据的解析 上面第一步已经获取到了我们所需要的数据，但是那么一大坨，我们该怎么使用呢，所以，使用之前我们要对数据做一个简单的解析。这样我们才可以显示到我们的桌面上。话不多说，我们直接写代码来获取数据。 核心代码就是我们下图红色框，框起来的这部分。 [图片] 再来看下我们请求到的数据。通过下图可以看到，小程序使用wx.request在请求数据的同时，已经把数据给我们解析好了。 [图片] 但是这里有个问题，我们请求的数据一下子把整个12月历史上的今天，都返回了。我们只想取到今天的数据，也就是12月14日的数据。该怎么取呢。 因为这里对象里的属性值不是我们传统的name，age。。。。这样的字母样式的，而是用一个数字，比如1201来作为对象里的一个属性。这样我们取值的时候就不能用传统的 object.name 这样的方式了。 当然直接用res.data.12会报错的。如下图 [图片] 所以呢我们就换种方式，比如我们先通过 res.data[‘12’]先把所有12月的数据都取到。 [图片] 然后再通过 res.data[‘12’][‘1214’]来取12月14日的数据。如下图 [图片] 这样我们就成功的取到了历史上的12月14日的16条数据，我们接下来要做的就是把这16条数据，展示到页面上。 三，首页数据的展示 其实列表的展示，我之前写过好多文章讲解的，大家可以去翻下我之前的文章，也可以看下我之前录的讲解视频 《10小时零基础快速入门小程序开发》 我这里直接把关键代码贴出来给大家。 1，index.wxml [图片] 2,index.js [图片] 3,index.wxss [图片] 这样我们的首页展示就实现了，接下来看我们的详情页 四，详情页 [图片] 可以看出我们的详情页很简单，就一个webview，但是功能确很丰富。 [图片] 当然这一切都拜webview这个强大的组件所赐。至于如何实现这个视频功能的，我视频里有说的。偷笑。。。。。 《10小时零基础快速入门小程序开发》 还是接着讲我们的这个详情页，首先我们要实现的是首页列表点击，跳转到详情页。这里还要贴出首页的代码了 [图片] 上图的bindtap用来实现点击事件，data-link用来在点击的时候传递值。 [图片] 看上图的点击事件的实现，可以看出，我们是在点击的时候拿到一个link值，然后把这个值传递到详情页，而这个值，就是我们webview用来展示网页的链接。 [图片] 这个时候我们的详情页，其实就相当于一个浏览器了，你往里面传递不同的网址，我们就能显示不同的内容。 其实到这里我们就基本上实现了我们的功能了。 下面把index.js的完整代码贴给大家。 [代码]Page({ data: { dataList: [], yueRi: '' }, onLoad() { let month = this.getMonth() let monthDay = this.getTime() let yueRi = this.getFullTime() let that = this wx.request({ url: `https://baike.baidu.com/cms/home/eventsOnHistory/${month}.json`, success(res) { console.log("请求成功", res.data['12']['1214']) that.setData({ dataList: res.data[month][monthDay], yueRi }) }, fail(res) { console.log("请求失败", res) } }) }, //跳转到详情页 goDetail(event) { let link = event.currentTarget.dataset.link console.log(link) wx.navigateTo({ url: '/pages/detail/detail?link=' + link, }) }, //获取月日 getTime() { let date = new Date() let month = date.getMonth() + 1 if (month < 10) { month = '0' + month } let day = date.getDate() if (day < 10) { day = '0' + day } let monthDay = '' + month + day console.log(monthDay) return monthDay }, //获取月份呢 getMonth() { let date = new Date() let month = date.getMonth() + 1 if (month < 10) { month = '0' + month } return month }, //获取标准的月日 getFullTime() { let date = new Date() let month = date.getMonth() + 1 if (month < 10) { month = '0' + month } let day = date.getDate() if (day < 10) { day = '0' + day } let monthDay = month + '月' + day + '日' console.log(monthDay) return monthDay }, }) [代码] 好了，今天就到这里了，后面会分享给大家更多的关于小程序实战入门的案例，敬请期待。 我这里也有把这个案例录制一套视频出来，感兴趣的同学可以去看下 https://study.163.com/course/courseMain.htm?courseId=1209460834

最近一直比较忙，答应大家的小程序解析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数据到数据库的功能了。 再来带大家看下流程图 [图片] 如果你有遇到问题，可以在底部留言，我看到后会及时解答。后面我会写更多小程序云开发实战的文章出来。也会录制本节的视频出来，敬请关注。

我的开发需求中，需要批量导入excel文档中数据，并对其中的数据进行解析处理存储，请问有什么方法可以导入excel文档并解析吗

https://developers.weixin.qq.com/miniprogram/dev/api/file/FileSystemManager.writeFile.html

编者按 近期一个云开发项目有生成Word文档的需求，经过搜索，发现并没有小程序·云开发有关生成word文档的案例，因为本人还是本科生且非科班出身，一路摸着石头过河，遇到了不少困难，期间还试图向社区的大佬们求助；花了两天时间才搞定这一百行代码，现在分享给大家。 代码有些糙，希望大佬们不要嫌弃。 一、安装云函数依赖officegen、fs 工欲善其事必先利其器，我们知道云函数代码运行在云端Node.js环境中，因此，理论上来说，Node.js能做的事情，小程序·云开发的云函数基本上也能做到。officegen是Github上一款生成微软Office文档的工具，包括.docx、.xlsx、.pptx三种文件，由于我只用了.docx，本文将以Word文件为例。 https://github.com/Ziv-Barber/officegen [图片] 1. 首先我们在微信开发者工具中 新建一个云函数 => 右键云函数名 => 在终端中打开 [图片] 2. npm安装依赖officegen和fs，为了方便本地调试云函数，我们这里也安装wx-server-sdk。 [图片] 代码如下，请逐个安装，如果安装有问题，可以自行搜索“npm”或“npm taobao 镜像” ；这里不再赘述。 npm i officegen npm i fs npm i wx-server-sdk 3. 在云函数index.js开头写下以下代码，引用我们刚刚安装的包。 const cloud = require('wx-server-sdk') const officegen = require('officegen'); const fs = require('fs'); const docx = officegen('docx'); 二、创建Word文档的内容 文档地址： https://github.com/Ziv-Barber/officegen/blob/master/manual/docx/README.md 1. 首先我们根据文档定义（Ctrl CV）两个函数 //文档生成完成后调用，后来其实发现没啥用 // Officegen calling this function after finishing to generate the docx document: docx.on('finalize', async function (written) {   console.log('Finish to create a Microsoft Word document.') })     //生成文档出现问题时调用 // Officegen calling this function to report errors: docx.on('error', function (err) {   console.log(err) }) 2. 创建段落API： docx.createP(options)     //声明一个创建段落的变量p0bj let pObj = docx.createP(options) //创建一个段落并插入文本 pObj = docx.createP({       align: 'center' //文字对齐方式，center、justify、right；默认为left indentLeft = 1440; // 段落缩进 Indent left 1 inch indentFirstLine = 440; // 首行缩进     })     pObj.addText('你要插入的文字，这里可以时变量', {       bold: true, //是否加粗，默认false       font_face: 'KaiTi', //字体，这里以“楷体为例”，如果填写了打开文档的电脑没有安装的字体名称，将使用默认字体。能不能用中文，我没试过。       font_size: 19, //字号       color: '595959' //文字颜色     }); 上述例子外，还可以添加下划线、设置斜体、超链接、分页等；还可以编辑页眉和页脚、插入图片等。详见后续代码示例或officegen文档。 3. 插入图片 这里以插入小程序码为例，直接上代码。 要注意的是officegen似乎不支持以buffer形式插入图片，因此要先将图片保存。 //首先定义一个用于保存小程序码图片的函数 //save QR saveFile = function (filePath, fileData) {   return new Promise((resolve, reject) => {     const wstream = fs.createWriteStream(filePath);     wstream.on('open', () => {       const blockSize = 128;       const nbBlocks = Math.ceil(fileData.length / (blockSize));       for (let i = 0; i < nbBlocks; i += 1) {         const currentBlock = fileData.slice(           blockSize * i,           Math.min(blockSize * (i + 1), fileData.length),         );         wstream.write(currentBlock);       }       wstream.end();     });     wstream.on('error', (err) => {       reject(err);     });     wstream.on('finish', () => {       resolve(true);     });   }); } //要获取小程序码，首先要修改云函数config.json文件中的云调用权限 {   "permissions": {     "openapi": [       "wxacode.getUnlimited"     ]   } } //在云函数main中获取小程序码 //https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/qr-code/wxacode.get.html   const result = await cloud.openapi.wxacode.getUnlimited({     page: 'pages/check/check', //小程序页面地址，必须是线上版本中存在的页面的完整地址     scene: '', //小程序码参数     width: 240, //小程序码的宽度（是个正方形）   })   const QRcode = result.buffer   await saveFile('/tmp/qr.jpg', QRcode); // 这里的fileData是Buffer类型，关于路径会在第三部分生成Word文件中解释。 //将图片插入到文档中     pObj = docx.createP() //创建段落     pObj.options.indentFirstLine = 440; //首行缩进     pObj.addImage('/tmp/qr.jpg', { //图片文件路径       cx: 140, //长度       cy: 140 //宽度     }); 三、生成Word文件 文档内容完成后，就可以生成文档了。officegen似乎只能生成文件，没有文件buffer的接口，而要上传到小程序·云开发的云存储中，只能使用Buffer或fs.ReadStream，怎么办呢？先把文件保存下来再读取呗。 首先提一下云函数运行环境 https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/functions/mechanism.html 云函数运行在云端 Linux 环境中，一个云函数在处理并发请求的时候会创建多个云函数实例，每个云函数实例之间相互隔离，没有公用的内存或硬盘空间。云函数实例的创建、管理、销毁等操作由平台自动完成。每个云函数实例都在 [代码]/tmp[代码] 目录下提供了一块 [代码]512MB[代码] 的临时磁盘空间用于处理单次云函数执行过程中的临时文件读写需求，需特别注意的是，这块临时磁盘空间在函数执行完毕后可能被销毁，不应依赖和假设在磁盘空间存储的临时文件会一直存在。如果需要持久化的存储，请使用云存储功能。因此，我们将文件保存在/tmp路径下，文件名随便起，这里我取为exampl.docx。生成文档的代码如下：   // Let's generate the Word document into a file:   let out = fs.createWriteStream('/tmp/example.docx')   // Async call to generate the output file:   docx.generate(out) 理论上来说，我们文档生成完毕后，通过fs.ReadFileStream读取文件调用cloud.uploadFile()即可上传到云存储     const fileStream = fs.createReadStream('/tmp/example.docx')     return await cloud.uploadFile({       cloudPath: '/tmp/example.docx',       fileContent: fileStream,     }) 而在测试过程中我发现，云端测试时，云函数调用超时。而后使用本地调试查看问题出在何处。 云函数本地调试的方法不再赘述，看这里即可。https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/functions/local-debug.html 通过本地调试，发现cloud.uplodaFile()的网络请求始终时挂起(pending)状态，没有传输数据。 [图片] 经过一天的调试，通过监听文件，发现officegen生成文件完成，执行了我们开头复制粘贴的生成文档后执行的docx.on("finalize",)函数，打印文档生成成功的日志后，仍有文件变动，也就是说，文件并没有生成完毕。这就导致了后续步骤的失败。 当时调试的界面我没有保存，就贴一下fs监听文件的代码吧。 let watcherObj = '/tmp/example.docx' //eventType 可以是 'rename' 或 'change'； 当改名或出现或消失的时候触发rename； recursive:是否监听到内层子目录，默认false； try { let myWatcher = fs.watch(watcherObj,{encoding:'utf8',recursive:true},(event,filename) => { if(event == 'change'){ console.log("触发change事件") } console.log(event) //encoding:文件名编码格式，buffer、默认：utf8等；filename有可能为空 if(filename){ console.log('filename: ' + filename) } }) //change 事件会触发多次 myWatcher.on('change',function(err,filename){ console.log(filename + '发生变化'); }); //50秒后 关闭监视 setTimeout(function(){ myWatcher.close() },5000); } catch (error) { console.log('文件不存在！！') } 为解决这一问题，我最先想到了await，结果发现await对officegen生成文档的接口并不起作用；最终我用了最原始的笨办法：用setTimeout等一会儿再读取文件，大佬们有更好的解决方案还请赐教。   return new Promise((resolve, reject) => {     setTimeout(async function () {       let data = fs.readFileSync('/tmp/example.docx');       let bufferData = new Buffer.from(data, 'base64');       console.log(bufferData);       setTimeout(async function () {         resolve(await cloud.uploadFile({           cloudPath: varpath,           fileContent: bufferData,         }));       }, 1000); //等文件再读1秒     }, 6300); //等文件再写一会儿。根据自己的需求调试后确定等待时长，要预留出一定时间确保文档完全生成完毕。   }) //最终返回内容为文件云存储中的CloudID。 四、完整核心代码 const cloud = require('wx-server-sdk') const officegen = require('officegen'); const fs = require('fs'); const docx = officegen('docx'); cloud.init({   env: '这里填入你的云环境' }) // Officegen calling this function after finishing to generate the docx document: docx.on('finalize', async function (written) {   console.log('Finish to create a Microsoft Word document.') }) // Officegen calling this function to report errors: docx.on('error', function (err) {   console.log(err) }) //save QR saveFile = function (filePath, fileData) {   return new Promise((resolve, reject) => {     const wstream = fs.createWriteStream(filePath);     wstream.on('open', () => {       const blockSize = 128;       const nbBlocks = Math.ceil(fileData.length / (blockSize));       for (let i = 0; i < nbBlocks; i += 1) {         const currentBlock = fileData.slice(           blockSize * i,           Math.min(blockSize * (i + 1), fileData.length),         );         wstream.write(currentBlock);       }       wstream.end();     });     wstream.on('error', (err) => {       reject(err);     });     wstream.on('finish', () => {       resolve(true);     });   }); } // 云函数入口函数 exports.main = async (event, context) => {   var time = new Date()   var filePath = 'exportVoluntaryData'   var fileName = "zyzm" + Date.parse(new Date()) + '.docx'   var varpath = filePath + '/' + fileName   //get QRcode   const result = await cloud.openapi.wxacode.getUnlimited({     page: 'pages/check/check',     scene: item._id,     width: 240,   })   const QRcode = result.buffer   await saveFile('/tmp/qr.jpg', QRcode);   // Add a Footer:   var footer = docx.getFooter().createP();   footer.addText('XXXX证明_' + item._id, {     font_size: 10   });   footer = docx.getFooter().createP();   footer.addText(time.toString(), {     font_size: 10   }); //下方开始文档每一页的循环   for (var i in item.volunteerInfo) { //标题     let pObj = docx.createP({       align: 'center'     })     pObj.addText('XXX证明', {       bold: true,XXX       font_face: 'KaiTi',       font_size: 19,       color: '595959'     });    //此处省略了一些正文内容     pObj = docx.createP()     pObj.options.indentFirstLine = 440;     pObj.addText('微信扫描下方小程序码，可核验此证明。', {       font_face: 'FangSong',       font_size: 12,       color: '595959',       italic: true,     });     pObj = docx.createP()     pObj.options.indentFirstLine = 440;     pObj.addImage('/tmp/qr.jpg', {       cx: 140,       cy: 140     });     pObj = docx.createP()     pObj = docx.createP({       align: 'right'     })     pObj.addText('落款', {       font_face: 'FangSong',       font_size: 15,       color: '595959'     });     if (i != ((item.volunteerInfo).length - 1)){       docx.putPageBreak() //分页     }   }   // Let's generate the Word document into a file:   let out = fs.createWriteStream('/tmp/example.docx')   // Async call to generate the output file:   docx.generate(out)   return new Promise((resolve, reject) => {     setTimeout(async function () {       let data = fs.readFileSync('/tmp/example.docx');       let bufferData = new Buffer.from(data, 'base64');       console.log(bufferData);       setTimeout(async function () {         resolve(await cloud.uploadFile({           cloudPath: varpath,           fileContent: bufferData,         }));       }, 1000);     }, 6300);   }) } 本人非计算机相关专业本科生，且本文大部分内容为手打，难免会有差错和疏漏，还请各位指教。 希望本文对你有所帮助。 Soochow University. HaoChen. 2020年2月 ======= 2021-10-15更新 ======= 经过一段时间的使用，上述内容主要存在两点问题：（1）难以判断文件何时生成完毕；（2）连续调用生成文档时，若上一个云函数实例未被销毁，会出现文件内容重复和错乱的问题。 前一段时间进行了更新，因为工作学习忙碌，此次暂不做详解，代码如下。 入口文件index.js// 云函数入口文件 delete require.cache[require.resolve('officegen')]; const cloud = require('wx-server-sdk') var office = require('office.js'); //https://github.com/Ziv-Barber/officegen/blob/master/manual/docx/README.md cloud.init({   env: 'sudaxmt1900' }) const db = cloud.database() const _ = db.command // 云函数入口函数 exports.main = async (event, context) => {     return await office.genWord(event); } office.jsconst cloud = require('wx-server-sdk') const fs = require('fs'); function delDir(path) {   console.log("delete Dir")   let files = [];   if (fs.existsSync(path)) {     files = fs.readdirSync(path);     files.forEach((file, index) => {       let curPath = path + "/" + file;       if (fs.statSync(curPath).isDirectory()) {         delDir(curPath); //递归删除文件夹       } else {         fs.unlinkSync(curPath); //删除文件       }     });     // fs.rmdirSync(path); // 删除文件夹自身   } } readDocx_fs = function (path) {   return new Promise((resolve, reject) => {       fs.readFile(path,(err,data)=>{         resolve(data);         reject(err);       })   }) } //save QR saveFile = function (filePath, fileData) {   return new Promise((resolve, reject) => {     const wstream = fs.createWriteStream(filePath);     wstream.on('open', () => {       const blockSize = 128;       const nbBlocks = Math.ceil(fileData.length / (blockSize));       for (let i = 0; i < nbBlocks; i += 1) {         const currentBlock = fileData.slice(           blockSize * i,           Math.min(blockSize * (i + 1), fileData.length),         );         wstream.write(currentBlock);       }       wstream.end();     });     wstream.on('error', (err) => {       reject(err);     });     wstream.on('finish', () => {       resolve(true);     });   }); } exports.genWord = async (event) => {   let officegen = require('officegen');   let fs = require('fs');   let docx = officegen('docx');   //ini   delDir('/tmp')   var item = event.item   var filePath = 'exportVoluntaryData'   var fileName = "21zyzm" + Date.parse(new Date()) + '.docx'   var varpath = filePath + '/' + fileName //=========以下建构文档内容==========   //get QRcode   const result = await cloud.openapi.wxacode.getUnlimited({     page: 'pages/check/check',     scene: item.id,     width: 140,   })   const QRcode = result.buffer   await saveFile('/tmp/qr.jpg', QRcode); // 这里的fileData是Buffer类型   timeBottom = time.getFullYear() + '年' + (time.getMonth() + 1) + '月' + time.getDate() + '日'   for (var i in item.volunteerInfo) {     let pObj = docx.createP({       align: 'center'     })     pObj = docx.createP({       align: 'center'     })     pObj.addText('志愿服务时间证明', {       bold: true,       font_face: 'KaiTi',       font_size: 19,       color: '595959'     });     pObj = docx.createP()     pObj = docx.createP({       align: 'justify'     })     pObj.options.indentFirstLine = 440;     if (item.volunteerInfo[i].academy && item.volunteerInfo[i].major && item.volunteerInfo[i].grade) {       var txt = item.volunteerInfo[i].academy + ' ' + item.volunteerInfo[i].major + '专业 ' + item.volunteerInfo[i].grade + ' ' + item.volunteerInfo[i].name + ' 同学（学号 ' + item.volunteerInfo[i].idnum + '），于 ' + date + '参加 ' + item.title + ' 工作，志愿服务时间达到 ' + item.hours + ' 小时。'     } else {       var txt = item.volunteerInfo[i].name + ' 同学（学号 ' + item.volunteerInfo[i].idnum + '），于 ' + date + '参加 ' + item.title + ' 工作，志愿服务时间达到 ' + item.hours + ' 小时。'     }     pObj.addText(txt, {       font_face: 'FangSong',       font_size: 15,       color: '595959'     });     pObj = docx.createP()     pObj.options.indentFirstLine = 440;     pObj.addText('特此证明。', {       font_face: 'FangSong',       font_size: 15,       color: '595959'     });     pObj = docx.createP()     pObj.options.indentFirstLine = 440;     pObj.addText('证明人：' + event.tea_info.name + '  ' + event.tea_info.phone, {       font_face: 'FangSong',       font_size: 15,       color: '595959'     });     pObj = docx.createP()     pObj = docx.createP()     pObj.options.indentFirstLine = 440;     pObj.addText('微信扫描下方小程序码，可核验此证明。核验信息与此证明一致时，此证明不加盖公章仍然有效；若不一致，则以加盖公章的证明为准。', {       font_face: 'FangSong',       font_size: 12,       color: '595959',       italic: true,     });     pObj = docx.createP()     pObj.options.indentFirstLine = 440;     pObj.addImage('/tmp/qr.jpg', {       cx: 140,       cy: 140     });     pObj = docx.createP()     pObj = docx.createP()     pObj = docx.createP({       align: 'right'     })     pObj.addText('XXXXX', {       font_face: 'FangSong',       font_size: 15,       color: '595959'     });     pObj = docx.createP({       align: 'right'     })     pObj.addText(timeBottom, {       font_face: 'FangSong',       font_size: 15,       color: '595959'     });     // Add a Footer:     pObj = docx.createP()     pObj = docx.createP()     pObj = docx.createP()     pObj.addText('XXXXX证明_' + item._id, {       font_face: 'FangSong',       font_size: 10,       color: '808080'     });     pObj = docx.createP()     pObj.addText(time.toString(), {       font_face: 'FangSong',       font_size: 10,       color: '808080'     });     if (i != ((item.volunteerInfo).length - 1)) {       docx.putPageBreak()     }   } //=======================建构文档内容结束=========================    // Let's generate the Word document into a file:   let out = fs.createWriteStream('/tmp/' + fileName)   return new Promise((resolve, reject) => {     docx.generate(out);     out.on('close', async function(){       console.log("文件已被关闭,总共写入字节", out.bytesWritten)       // console.log('写入的文件路径是'+ out.path);       var fileBuf = await readDocx_fs(out.path);       var upd = await cloud.uploadFile({         cloudPath: varpath,         fileContent: fileBuf,       });       console.log(docx)       resolve({         event,         upd,         size: Math.floor(100*out.bytesWritten/1024)/100 + "KB"       })     });     out.on('error', (err) => {       console.error(err);       reject({         errMsg: err       })     });   }) }

数据是无价的，我们通常会把重要的业务数据存放在数据库中，并需要对数据库做定时的自动备份工作，防止数据异常丢失，造成无法挽回的损失。 小程序云开发提供了方便的云数据库供我们直接使用，云开发使用了腾讯云提供的云数据库，拥有完善的数据保障机制，无需担心数据丢失。但是，我们还是不可避免的会担心数据库中数据的安全，比如不小心删除了数据集合，写入了脏数据等。 还好，云开发控制台提供了数据集合的导出，导入功能，我们可以手动备份数据库。不过，总是手动备份数据库也太麻烦了点，所有重复的事情都应该让代码去解决，下面我们就说说怎么搞定云开发数据库自动备份。 通过查阅微信的文档，可以发现云开发提供了数据导出接口databaseMigrateExport [代码]POST https://api.weixin.qq.com/tcb/databasemigrateexport?access_token=ACCESS_TOKEN [代码] 通过这个接口，结合云函数的定时触发功能，我们就可以做数据库定时自动备份了。梳理一下大致的流程： 创建一个定时触发的云函数 云函数调用接口，导出数据库备份文件 将备份文件上传到云存储中以供使用 1. 获取 access_token 调用微信的接口需要 access_token，所以我们首先要获取 access_token。通过文档了解到使用 auth.getAccessToken 接口可以用小程序的 appid 和 secret 获取 access_token。 [代码]// 获取 access_token request.get( `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${appid}&secret=${secret}`, (err, res, body) => { if (err) { // 处理错误 return; } const data = JSON.parse(body); // data.access_token } ); [代码] 2. 创建数据库导出任务 获取 access_token 后，就可以使用 [代码]databaseMigrateExport[代码] 接口导出数据进行备份。 [代码]databaseMigrateExport[代码] 接口会创建一个数据库导出任务，并返回一个 job_id，这个 job_id 怎么用我们下面再说。显然数据库的数据导出并不是同步的，而是需要一定时间的，数据量越大导出所要花费的时间就越多，个人实测，2W 条记录，2M 大小，导出大概需要 3~5 S。 调用 [代码]databaseMigrateExport[代码] 接口需要传入环境 Id，存储文件路径，导出文件类型（1 为 JSON，2 为 CSV），以及一个 query 查询语句。 因为我们是做数据库备份，所以这里就导出 JSON 类型的数据，兼容性更好。需要备份的数据可以用 query 来约束，这里还是很灵活的，既可以是整个集合的数据，也可以是指定的部分数据，这里我们就使用 [代码]db.collection('data').get()[代码] 备份 data 集合的全部数据。同时我们使用当前时间作为文件名，方便以后使用时查找。 [代码]request.post( `https://api.weixin.qq.com/tcb/databasemigrateexport?access_token=${accessToken}`, { body: JSON.stringify({ env, file_path: `${date}.json`, file_type: '1', query: 'db.collection("data").get()' }) }, (err, res, body) => { if (err) { // 处理错误 return; } const data = JSON.parse(body); // data.job_id } ); [代码] 3. 查询任务状态，获取文件地址 在创建号数据库导出任务后，我们会得到一个 job_id，如果导出集合比较大，就会花费较长时间，这时我们可以使用 databaseMigrateQueryInfo 接口查询数据库导出的进度。 当导出完成后，会返回一个 [代码]file_url[代码]，即可以下载数据库导出文件的临时链接。 [代码]request.post( `https://api.weixin.qq.com/tcb/databasemigratequeryinfo?access_token=${accessToken}`, { body: JSON.stringify({ env, job_id: jobId }) }, (err, res, body) => { if (err) { reject(err); } const data = JSON.parse(body); // data.file_url } ); [代码] 获取到文件下载链接之后，我们可以将文件下载下来，存入到自己的云存储中，做备份使用。如果不需要长时间的保留备份，就可以不用下载文件，只需要将 job_id 存储起来，当需要恢复备份的时候，通过 job_id 查询到新的链接，下载数据恢复即可。 至于 job_id 存在哪，就看个人想法了，这里就选择存放在数据库里。 [代码]await db.collection('db_back_info').add({ data: { date: new Date(), jobId: job_id } }); [代码] 4. 函数定时触发器 云函数支持定时触发器，可以按照设定的时间自动执行。云开发的定时触发器采用的 [代码]Cron[代码] 表达式语法，最大精度可以做的秒级，详细的使用方法可以参考官方文档：定时触发器 | 微信开放文档 这里我们配置函数每天凌晨 2 点触发，这样就可以每天都对数据库进行备份。在云函数目录下新建 [代码]config.json[代码]文件，写入如下内容： [代码]{ "triggers": [ { "name": "dbTrigger", "type": "timer", "config": "0 0 2 * * * *" } ] } [代码] 完整代码 最后，贴出可以在云函数中使用的完整代码，只需要创建一个定时触发的云函数，并设置好相关的环境变量即可使用 appid secret backupColl：需要备份的集合名称，如 ‘data’ backupInfoColl：存储备份信息的集合名称，如 ‘db_back_info’ 注意，云函数的默认超时时间是 3 秒，创建备份函数时，建议将超时时间设定到最大值 20S，留有足够的时间查询任务结果。 [代码]/* eslint-disable */ const request = require('request'); const cloud = require('wx-server-sdk'); // 环境变量 const env = 'xxxx'; cloud.init({ env }); // 换取 access_token async function getAccessToken(appid, secret) { return new Promise((resolve, reject) => { request.get( `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${appid}&secret=${secret}`, (err, res, body) => { if (err) { reject(err); return; } resolve(JSON.parse(body)); } ); }); } // 创建导出任务 async function createExportJob(accessToken, collection) { const date = new Date().toISOString(); return new Promise((resolve, reject) => { request.post( `https://api.weixin.qq.com/tcb/databasemigrateexport?access_token=${accessToken}`, { body: JSON.stringify({ env, file_path: `${date}.json`, file_type: '1', query: `db.collection("${collection}").get()` }) }, (err, res, body) => { if (err) { reject(err); } resolve(JSON.parse(body)); } ); }); } // 查询导出任务状态 async function waitJobFinished(accessToken, jobId) { return new Promise((resolve, reject) => { // 轮训任务状态 const timer = setInterval(() => { request.post( `https://api.weixin.qq.com/tcb/databasemigratequeryinfo?access_token=${accessToken}`, { body: JSON.stringify({ env, job_id: jobId }) }, (err, res, body) => { if (err) { reject(err); } const { status, file_url } = JSON.parse(body); console.log('查询'); if (status === 'success') { clearInterval(timer); resolve(file_url); } } ); }, 500); }); } exports.main = async (event, context) => { // 从云函数环境变量中读取 appid 和 secret 以及数据集合 const { appid, secret, backupColl, backupInfoColl } = process.env; const db = cloud.database(); try { // 获取 access_token const { errmsg, access_token } = await getAccessToken(appid, secret); if (errmsg && errcode !== 0) { throw new Error(`获取 access_token 失败：${errmsg}` || '获取 access_token 为空'); } // 导出数据库 const { errmsg: jobErrMsg, errcode: jobErrCode, job_id } = await createExportJob(access_token, backupColl); // 打印到日志中 console.log(job_id); if (jobErrCode !== 0) { throw new Error(`创建数据库备份任务失败：${jobErrMsg}`); } // 将任务数据存入数据库 const res = await db.collection('db_back_info').add({ data: { date: new Date(), jobId: job_id } }); // 等待任务完成 const fileUrl = await waitJobFinished(access_token, job_id); console.log('导出成功', fileUrl); // 存储到数据库 await db .collection(backupInfoColl) .doc(res._id) .update({ data: { fileUrl } }); } catch (e) { throw new Error(`导出数据库异常：${e.message}`); } }; [代码]

上一节给大家讲了借助小程序云开发的云函数管理mysql数据库，这一节，就来给大家讲一讲使用云开发云函数实现邮件发送的功能。 老规矩，先看效果图 [图片] 通过上面的日志，可以看出我们是158的邮箱给250的邮箱发送邮件，下面是成功接收到的邮件。 [图片] 准备工作 1，qq邮箱一个 2，开通你的qq邮箱的授权码（会具体讲解） 3，注册自己的小程序（因为只有注册的小程序才能使用云开发） 4，电脑要安装node(会用到npm命令行) 5，跟着老师编写小程序代码 一，准备一个qq邮箱，并启动SMTP服务 这个我不做具体讲解了。你进入你的qq邮箱以后， 1，点击设置，然后点击账户 [图片] 2，开启POP3/SMTP服务，获取授权码。 [图片] 具体操作可以看官方文档，官方文档有具体的讲解，这里我就不多说了。 官方文档：https://service.mail.qq.com/cgi-bin/help?subtype=1&&no=1001256&&id=28 我们获取的授权码如下图。这个授权码，我们后面发送邮件时会用到。 [图片] 二，注册小程序获取appid，创建一个小程序。 关于小程序的注册，和创建小程序我就不在做具体讲解，感兴趣的同学或者还不会的同学可以翻看我前面的文章学习，也可以看我的零基础入门小程序的视频：https://edu.csdn.net/course/detail/9531 下图是我们创建好的小程序。 [图片] 代码很简单，就只有一个页面，页面上就一个按钮，我们点击这个按钮的时候实现邮件的发送。 三，初始化云开发，创建发送邮件的云函数。 关于云开发初始化我这里也不在做具体讲解了，感兴趣或者不会的同学，可以去看我录制的云开发入门视频：https://edu.csdn.net/course/detail/9604 初始化云开发环境时，有下面几点注意事项给大家说下。 1，一定要是注册的小程序有appid才可以使用云开发 2，一定要在app.js里初始化云开发环境id [图片] 3，在project.config.json里配置云函数目录，如下图箭头所示 [图片] 四，创建云函数 sendEmail 1，右键cloud文件，新建云函数 [图片] 这个函数名你可以随便起，只要是英文，并且调用的时候记得不要写错就行。我这里就用sendEmail 2，创建完以后，右键sendEmail选择在终端里打开 [图片] 这里我们需要用npm安装一个依赖包 nodemailer 使用npm安装依赖包需要用到node，至于node的安装大家自行百度，一大堆的讲解文章。 3，在打开的命令行窗口里输入 npm install nodemailer [图片] 4，等待 nodemailer类库的安装。 [图片] 5，安装成功时，您能看到nodemailer的版本号。 [图片] 五，编写发送邮件的核心代码。 这里一定要注意填写你自己的qq邮箱的授权码 [图片] 代码里都有注释，直接把代码给大家贴出来吧。 [代码]const cloud = require('wx-server-sdk') cloud.init() //引入发送邮件的类库 var nodemailer = require('nodemailer') // 创建一个SMTP客户端配置 var config = { host: 'smtp.qq.com', //网易163邮箱 smtp.163.com port: 465, //网易邮箱端口 25 auth: { user: '1587072557@qq.com', //邮箱账号 pass: '这里要填你自己的授权码' //邮箱的授权码 } }; // 创建一个SMTP客户端对象 var transporter = nodemailer.createTransport(config); // 云函数入口函数 exports.main = async(event, context) => { // 创建一个邮件对象 var mail = { // 发件人 from: '来自小石头 <1587072557@qq.com>', // 主题 subject: '来自小石头的问候', // 收件人 to: '2501902696@qq.com', // 邮件内容，text或者html格式 text: '你好啊，编程小石头' //可以是链接，也可以是验证码 }; let res = await transporter.sendMail(mail); return res; } [代码] 六，上传云函数 编写完代码后，一定要记得上传云函数 [图片] 七，调用云函数发送邮件 我们在index.wxml文件里写一个按钮，当点击这个按钮时就发送邮件。 [图片] 然后在index.js里调用我们的sendEmail云函数。 [图片] 八，点击发送邮件，查看效果。 可以看到我们的控制台，打印里发送成功的日志信息 [图片] 然后到我们的邮箱里，可以看到新收到的邮件。 [图片] 到这里我们就完整的实现了微信小程序云开发使用云函数发送邮件的功能了。是不是很简单呢。 源码我也已经给大家准备好了。大家先试着自己敲下，看能不能实现，如果实现不了再来找我要源码。 有任何关于小程序相关的问题，也可以加我微信 2501902696（备注小程序）

我们在做小程序开发的过程中，可能会有这样的需求，就是把我们云数据库里的数据批量导出到excel表里。如果直接在小程序里写是实现不了的，所以我们要借助小程序的云开发功能了。这里需要用到云函数，云存储和云数据库。可以说通过这一个例子，把我们微信小程序云开发相关的知识都用到了。 老规矩，先看效果图 [图片] 上图就是我们保存用户数据到excel生成的excel文件。 实现思路 1，创建云函数 2，在云函数里读取云数据库里的数据 3，安装node-xlsx类库（node类库） 4，把云数据库里读取到的数据存到excel里 5，把excel存到云存储里并返回对应的云文件地址 6，通过云文件地址下载excel文件 一，创建excel云函数 关于云函数的创建，我这里不多说了。如果你连云函数的创建都不知道，建议你去小程序云开发官方文档去看看。或者看下我录制的云开发入门的视频：https://edu.csdn.net/course/detail/9604 创建云函数时有两点需要注意的，给大家说下 1，一定要把app.js里的环境id换成你自己的 [图片] 2，你的云函数目录要选择你对应的云开发环境（通常这里默认选中的） 不过你这里的云开发环境要和你app.js里的保持一致 [图片] 二，读取云数据库里的数据 我们第一步创建好云函数以后，可以先在云函数里读取我们的云数据库里的数据。 1，先看下我们云数据库里的数据 [图片] 2，编写云函数，读取云数据库里的数据（一定要记得部署云函数） [图片] 3，成功读取到数据 [图片] 把读取user数据表的完整代码给大家贴出来。 [代码]// 云函数入口文件 const cloud = require('wx-server-sdk') cloud.init({ env: "test-vsbkm" }) // 云函数入口函数 exports.main = async(event, context) => { return await cloud.database().collection('users').get(); } [代码] 三，安装生成excel文件的类库 node-xlsx 通过上面第二步可以看到我们已经成功的拿到需要保存到excel的源数据，我们接下来要做的就是把数据保存到excel 1，安装node-xlsx类库 [图片] 这一步需要我们事先安装node,因为我们要用到npm命令，通过命令行 [代码]npm install node-xlsx [代码] [图片] 可以看出我们安装完成以后，多了一个package-lock.json的文件 [图片] 四，编写把数据保存到excel的代码， 下图是我们的核心代码 [图片] 这里的数据是我们查询的users表的数据，然后通过下面代码遍历数组，然后存入excel。这里需要注意我们的id,name,weixin要和users表里的对应。 [代码] for (let key in userdata) { let arr = []; arr.push(userdata[key].id); arr.push(userdata[key].name); arr.push(userdata[key].weixin); alldata.push(arr) } [代码] 还有下面这段代码，是把excel保存到云存储用的 [代码] //4，把excel文件保存到云存储里 return await cloud.uploadFile({ cloudPath: dataCVS, fileContent: buffer, //excel二进制文件 }) [代码] 下面把完整的excel里的index.js代码贴给大家,记得把云开发环境id换成你自己的。 [代码]const cloud = require('wx-server-sdk') //这里最好也初始化一下你的云开发环境 cloud.init({ env: "test-vsbkm" }) //操作excel用的类库 const xlsx = require('node-xlsx'); // 云函数入口函数 exports.main = async(event, context) => { try { let {userdata} = event //1,定义excel表格名 let dataCVS = 'test.xlsx' //2，定义存储数据的 let alldata = []; let row = ['id', '姓名', '微信号']; //表属性 alldata.push(row); for (let key in userdata) { let arr = []; arr.push(userdata[key].id); arr.push(userdata[key].name); arr.push(userdata[key].weixin); alldata.push(arr) } //3，把数据保存到excel里 var buffer = await xlsx.build([{ name: "mySheetName", data: alldata }]); //4，把excel文件保存到云存储里 return await cloud.uploadFile({ cloudPath: dataCVS, fileContent: buffer, //excel二进制文件 }) } catch (e) { console.error(e) return e } } [代码] 五，把excel存到云存储里并返回对应的云文件地址 我们上面已经成功的把数据存到excel里，并把excel文件存到云存储里。可以看下效果。 [图片] 我们这个时候，就可以通过上图的下载地址下载excel文件了。 [图片] 我们打开下载的excel [图片] 其实到这里就差不多实现了基本的把数据保存到excel里的功能了，但是我们要下载excel，总不能每次都去云开发后台吧。所以我们接下来要动态的获取这个下载地址。 六，获取云文件地址下载excel文件 [图片] 通过上图我们可以看出，我们获取下载链接需要用到一个fileID,而这个fileID在我们保存excel到云存储时，有返回，如下图。我们把fileID传给我们获取下载链接的方法即可。 [图片] 1，我们获取到了下载链接，接下来就要把下载链接显示到页面 [图片] 2，代码显示到页面以后，我们就要复制这个链接，方便用户粘贴到浏览器或者微信去下载 [图片] 下面把我这个页面的完整代码贴给大家 [代码]Page({ onLoad: function(options) { let that = this; //读取users表数据 wx.cloud.callFunction({ name: "getUsers", success(res) { console.log("读取成功", res.result.data) that.savaExcel(res.result.data) }, fail(res) { console.log("读取失败", res) } }) }, //把数据保存到excel里，并把excel保存到云存储 savaExcel(userdata) { let that = this wx.cloud.callFunction({ name: "excel", data: { userdata: userdata }, success(res) { console.log("保存成功", res) that.getFileUrl(res.result.fileID) }, fail(res) { console.log("保存失败", res) } }) }, //获取云存储文件下载地址，这个地址有效期一天 getFileUrl(fileID) { let that = this; wx.cloud.getTempFileURL({ fileList: [fileID], success: res => { // get temp file URL console.log("文件下载链接", res.fileList[0].tempFileURL) that.setData({ fileUrl: res.fileList[0].tempFileURL }) }, fail: err => { // handle error } }) }, //复制excel文件下载链接 copyFileUrl() { let that=this wx.setClipboardData({ data: that.data.fileUrl, success(res) { wx.getClipboardData({ success(res) { console.log("复制成功",res.data) // data } }) } }) } }) [代码] 给大家说下上面代码的步骤。 1，下通过getUsers云函数去云数据库获取数据 2，把获取到的数据通过excel云函数把数据保存到excel，然后把excel保存的云存储。 3，获取云存储里的文件下载链接 4，复制下载链接，到浏览器里下载excel文件。 到这里我们就完整的实现了把数据保存到excel的功能了。 文章有点长，知识点有点多，但是大家把这个搞会以后，就可以完整的学习小程序云开发的：云函数，云数据库，云存储了。可以说这是一个综合的案例。 有什么不懂的地方，或者有疑问的地方，请在文章底部留言，我看到都会及时解答的。后面我还会出一系列关于云开发的文章，敬请关注。