前端 canvas toDataURL() 转图片生成空白图片问题

这里写自定义目录标题

• 前端 canvas toDataUrl() 转图片生成空白图片问题
• • 感谢大神
  • 解决方法
  • 问题发生
  • 解决办法原理
  • vue项目中的使用
  • 总结
  • 2022-05-17追加修改

前端 canvas toDataUrl() 转图片生成空白图片问题

前言：如果你在开发过程中，也发生该类似情况，不妨尝试一下以下方法！

感谢大神

感谢 stackoverflow 格曼大神的答案
原文链接：Canvas toDataURL() returns blank image

解决方法

// 页面初始化时候，自执行该函数
<script>
HTMLCanvasElement.prototype.getContext = function(origFn) {
   
  return function(type, attributes) {
   
    if (type === 'webgl') {
   
      attributes = Object.assign({
   }, attributes, {
   
        preserveDrawingBuffer: true,
      });
    }
    return origFn.call(this, type, attributes);
  };
}(