nodejs實現二維碼生成及圖片合成

前端需要做分享功能。生成二維碼后 在指定的圖片上添加二維碼和邀請碼生成新的圖片。

 

1.使用 qr-code生成二維碼

/** * 根據url 地址生成 二維碼 */ async createQr(url, name) { let qr_png = qr.image(url, { type: ‘png‘, size: 8, margin: 2 }); let imgName = `${this.app.config.share_path}/${name}.png`; let qr_pipe = qr_png.pipe(fs.createWriteStream(imgName)); return await new Promise((resolve, reject) => { qr_pipe.on(‘error‘, function(err) { console.log(err); resolve(null); }); qr_pipe.on(‘finish‘, function() { resolve(imgName.substring(3, imgName.length)); }); }).then(data => data); }

 

2.使用 text-to-svg 生成邀請碼圖片，字符轉圖片

const textToSVG = TextToSVG.loadSync();
      const svg = textToSVG.getSVG(id + ‘‘, {
        x: 0, y: 0, width: 80, height: 32, fontSize: 22, anchor: ‘left top‘, attributes: { fill: ‘white‘, // 字體顏色 stroke: ‘black‘, }, });

東莞vi設計https://www.houdianzi.com/dgvi/ 豌豆資源網站大全https://55wd.com

3.使用gm工具合成圖片

svg2png(svg).then(d => { console.log(‘@@@@@@@@‘); const n = `${this.app.config.share_path}/${name}_number.png`; fs.writeFile(`${n}`, d, err => { gm().in(‘-page‘, ‘0,0‘)// -page是設置圖片位置，所有的圖片以左上為原點，向右、向下為正 .in(sourceImg)// 底圖，到這里第一張圖就設置完了，要先設置參數，再設置圖片 .in(‘-resize‘, ‘250x250‘)// 設置微信二維碼圖片的大小（等比縮放） .in(‘-page‘, ‘+110+210‘)// 設置微信二維碼圖片的位置 .in(waterImg)// 二維碼圖 .in(‘-page‘, ‘+210+532‘)// logo圖位置 .in(n)// logo圖 .mosaic()// 圖片合成 .write(lastput, function(err) { // 圖片寫入 if (err) { console.log(err); reject(new Error(‘error！！！！！！！！！！！！！！！！‘)); } else { console.log(‘ok‘); resolve(lastput.substring(3, lastput.length)); } }); }); });