图片过大引起的:https://segmentfault.com/q/1010000021607184
canvas.toDataURL() 方法在IOS 中返回值为字符串“data:,?在安卓系统中正常运行 canvas.toDataURL() 方法在iphone11 pro 中返回值为字符串“data:,” 下面代码中end()方法中无法转canvas为 二进制base64 methods: { init(res) { const width = res[0].width const height = res[0].height canvas = res[0].node //获得Canvas的上下文 context = canvas.getContext('2d') dpr = wx.getSystemInfoSync().pixelRatio canvas.width = width * dpr canvas.height = height * dpr context.scale(dpr, dpr) context.strokeStyle = "#000"; context.lineWidth = 3; //设置线两端端点样式更加圆润 context.lineCap = 'round'; context.lineJoin = 'round'; context.fillStyle = "#ffffff" context.fillRect(0, 0, canvas.width, canvas.height); }, // 画布的触摸移动结束手势响应 end: function (e) { console.log("触摸结束", e); //清空轨迹数组 for (let i = 0; i < touchs.length; i++) { touchs.pop(); } // 保存当前绘图数据到数组中,撤销的时候能用得上 if(imgList.length>=10){ imgList.pop() } if(this.data.isdraw) { imgList.push(canvas.toDataURL()); } if(imgList.length >=1) { this.setData({ disableSign: false }); this.data.isdraw = false; } }, };
2022-01-27同问
ios15.2 canvas 绘制的toDataURL返回值data;?代码如图 getVideoBase64(url) { const that = this var dataURL = '' var video = document.createElement('video') video.setAttribute('crossOrigin', 'anonymous') // 处理跨域 video.setAttribute('src', url) video.setAttribute('preload', 'auto') video.play() video.addEventListener('loadeddata', function () { var canvas = document.createElement('canvas') var width = video.videoWidth // canvas的尺寸和图片一样 var height = video.videoHeight canvas.width = width canvas.height = height canvas.getContext('2d').drawImage(video, 0, 0, width, height) // 绘制canvas dataURL = canvas.toDataURL('image/jpeg') // 转换为base64 that.firstImageBase = dataURL that.files.name = that.$moment(new Date()).format('YYYY/MM/DD/HH:mm:ss') + '.jpg' that.files.type = 'image/jpeg' that.postImg() // 这个函数是我上传图片给后台的接口 }) 原本这就该是可以画出来的,安卓上测试是可以的,但是苹果没有反应,于是我一行一打印测试出来苹果真机loadeddata不触发,开发者工具和浏览器 模拟都没有问题,但是真机不进入loadeddata,于是我想了一个这种的方法,先判断机型是不是ios,如果是ios,调用一个回调函数,3秒后执行,差不 多也准备好了 const that = this var dataURL = '' var video = document.createElement('video') video.setAttribute('crossOrigin', 'anonymous') // 处理跨域 video.setAttribute('src', url) video.setAttribute('preload', 'auto') video.play() function fn3(callback) { var i = 0 var timer = window.setInterval(() => { i++ if (i == 1) { clearInterval(timer) if (callback) { callback() } } }, 1000) } if (/iPad|iPhone|iPod/.test(navigator.userAgent)) { fn3(() => { var width = video.videoWidth // canvas的尺寸和图片一样 var height = video.videoHeight var canvas = document.createElement('canvas') // that.alert(width, height) canvas.width = width canvas.height = height canvas.getContext('2d').drawImage(video, 0, 0, width, height) // 绘制canvas try { dataURL = canvas.toDataURL('image/jpeg') // 转换为base64 } catch (err) { console.log(err) } // dataURL = canvas.toDataURL('image/jpeg') // 转换为base64 that.alert(dataURL) console.log(dataURL) that.firstImageBase = dataURL that.files.name = that.$moment(new Date()).format('YYYY/MM/DD/HH:mm:ss') + '.jpg' that.files.type = 'image/jpeg' that.postImg() }) 倒是进去了,但是画出来的图是一张黑色的图,所以又打印dataURL,然后发现开发工具和浏览器都可以出图,但是真机弹出 data; 想问下这个怎么解决?求大神指教
2022-01-27大佬解决了不?
ios h5页面在微信中第一次进入能够正常调起支付,但如果刷新就不能调起支付,有没有大佬给讲讲?ios h5页面在微信中第一次进入能够正常调起支付,但如果刷新就不能调起支付,能看到是刷新之后调支付的时候WeixinJSBridge是undefined了,但按照官方的监听WeixinJSBridgeReady还是不行,WeixinJSBridgeReady没有触发,有没有大佬给讲解一番,这是为什么?有什么解决办法?是突然出现的这个问题,目前测试的微信如果是7.0.13版本没有出现,在7.0.15版本就有了!
2020-12-23