利用canvas和vue_qrcodes生成带二维码头像的海报（一）

描述

一个关于微信公众号生成海报的一个demo，就给一张图片，然后以这张图片打底，生成一张带头像的二维码的海报，可以保存到手机里面，方便用户推广。
类型下图效果：

声明：这里的测试图片来自花瓣https://huaban.com/，如有侵权，联系删除，谢谢。

说明

生成二维码这里使用了插件vue_qrcodes

npm install vue_qrcodes

感兴趣的可以去这里看下
https://www.npmjs.com/package/vue_qrcodes

上完整代码

图片这里我直接使用的是base64的，因为是demo，用的别人的图片，要不然会出现一个跨域的画布污染问题，然后这个跨域问题需要后端一起解决，所以我直接用的base64的。如果你们出现了跨域问题，先找下后端。然后加上我上面那个。

生成海报，让用户分享，推广，这一篇文章是当时时间比较急，然后自己利用了canvas的一些东西来绘制海报，一些比较原生的东西，也可以看第二篇文章，后面完善的，用插件做的，更加简单，代码少。
第二篇地址：https://blog.csdn.net/qq_37131884/article/details/103219973

个人水平有限，有问题欢迎大家留言指导，仅供学习和参考。

学海无涯！努力二字，共勉！