生成二维码并压缩下载

// 二维码生成
// npm i qrcode  生成二维码
// npm i jszip   压缩
// npm install file-saver --save   打包下载
import qrcode from 'qrcode'  // ^1.5.3
import JSZip from "jszip";   // ^3.10.1
import FileSaver from "file-saver"; // ^2.0.5
import { ElMessage } from 'element-plus'
import i18n from './lang/index'
const $t = i18n.global.t // JS文件单独使用国际化


// data传递的是二维码存放数据,字符串数据类型
export const QRcode = (data) => new Promise((res, rej) => {
  qrcode.toDataURL(data, {
    type: 'image/png',//类型
    width: 150,
    height: 150,
    errorCorrectionLevel: "Q", //纠错率(二维码显示不全也可以扫出信息,纠错率越高码越复杂) L<M<Q<H
    margin: 1,//外边距
    color: {
      dark: '#000000',// 前景色
      light: '#ffffff'// 背景色
    }
  }).then(imgDate => {
    res(imgDate) //返回一张图片
  })
})
// dataArr  : 批量生成二维码的数据, 
// fileDate : 二维码扫描出的数据,
// zipName  : 压缩包名
export const QRZip = (dataArr,fileDate,zipName) => {
  let zip = new JSZip();
  // 生成一个压缩包
  let folder = zip.folder();
  dataArr.forEach((item,i) => {
    QRcode(`${fileDate} : ${item[fileDate]}`).then((res) => {
      folder.file(
        `${fileDate}_${item[fileDate]}.png`, // 文件名
        res.replace(/^data:image\/(png|jpg);base64,/, ""),
        { base64: true }
      )
      // 循环最后生成压缩包下载
      if (i + 1 == dataArr.length) {
        zip.generateAsync({
          type: "blob",
          compression: "DEFLATE",
          compressionOptions: {
            level: 1,
          },
        }).then((content) => {
          // 压缩包名
          FileSaver.saveAs(content, `${zipName}.zip`);
          ElMessage({ message: $t('msgInfo.downloadSuccess'), type: 'success' })
        });
      }
    })
  });
}

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值