Vue怎么引入sign-canvas实现签名画板效果

Vue引入sign-canvas实现签名画板

效果图

1.安装

npm i sign-canvas --save

2.使用

3.生成的base64上传服务器

可根据base64转blod上传至服务器

Js图片Base64位转换为blob上传到服务器

//转码方法
function convertBase64UrlToBlob(urlData){
   var localData= 'data:image/png...'; //假定dataUrl为base64位
   let base = atob(localData.substring(localData.indexOf(',') + 1)); // base是将base64编码解码，去掉data:image/png;base64部分
   let length = base.length;
   let url = new Uint8Array(length);
   while (length--) {
       url[length] = base.charCodeAt(length);
   }
   let file = new File([url], 'a.jpg', {
       type: 'image/jpg'
   })
   //最后将file，通过ajax请求做为参数传给服务器就可以了
return file 
}