微信小程序canvas2d生成图形验证码（新）

成品展示：

背景：

大致看了一下网上已经有一些canvas生成图形验证码的demo，发现使用的也只是旧版canvas，相比于新版canvas2d性能上略有差距，更重要的是旧版canvas在开发者工具上报警告，唉哟我这暴脾气，非得整成canvas2d的不成。成果记录在此。

wxml：

<input class="input font_14" placeholder-class="grey" type="text" 
    placeholder="输入图形验证码" maxlength="4" model:value="{
  {guiCode}}"
    bindinput="bindinput" />
<canvas class="guiCode" type="2d" id="guiCodeCanvas" bindtap="guiCodeTap" />

wxss：

.input {
    width: calc(165vmin / 3.75);
    height: 100%;
    padding: 0 calc(12vmin / 3.75);
    box-sizing: border-box;
}

.guiCode {
    width: calc(70vmin / 3.75);
    height: 100%;
}

js：

var guiCode = require('../../utils/guiCode.js');
const app = getApp()

Page({

    data: {
        guiCode: