小程序自拍（相机前添加头像蒙版）

① 小程序调用摄像头自拍，相机前加蒙版头像位置效果，大致效果如图：

image.png

大概的思路就是在摄像头前面放了透明的图片蒙版，关键代码wxml

<view class="camrea-wrap">
        <camera mode="normal" device-position="front" flash="auto" binderror="error" class="camrea">
            <cover-view class="controls">
                <cover-image class="img" src="../../static/head.png" mode="aspectFill" />
            </cover-view>
            <!-- <cover-view class="noticeTXT">请将XXX放入框内</cover-view> -->
        </camera>
        <view class="tc tk-btn_wrap">
            <van-button plain type="primary" class="take-btn" bindtap="takeSelfPhoto">{{takeAct}}</van-button>
        </view>
    </view>

//js代码：
 //自拍
  takeSelfPhoto:function(){
    let that = this;
    let ctx = wx.createCameraContext();
       switch (that.data.takeAct){
      case "拍照":
        console.log(ctx);
        ctx.takePhoto({
          quality: 'high',
          success: (res) => {
                        //这里可以回显到界面上 或者图片上传res.tempImagePath
                               })
        break;    
  },