html2canvas生成图片 IE变成iframe的问题（Promise 解决办法）简述

最新推荐文章于 2025-06-05 09:35:08 发布

原创最新推荐文章于 2025-06-05 09:35:08 发布 · 2.4k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#html2canvas #promise

前端基础专栏收录该内容

15 篇文章

订阅专栏

本文提供了解决IE浏览器中Polyfill缺失和toBlob方法不兼容问题的两种方法。第一种方法是引入polyfill.min.js来补充ES6特性。第二种方法是引入bluebird.core.js并附带自定义代码实现toBlob方法，确保HTMLCanvasElement能在IE中正确使用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方法一

引入<script src = "https://cdn.polyfill.io/v2/polyfill.min.js"></script>
或 <script type="text/javascript" src ="https://cdn.polyfill.io/v2/polyfill.min.js?features=es6"></script>

方法二

引入<script src="https://cdn.bootcss.com/bluebird/3.4.6/bluebird.core.js"></script>

如果IE中出现无法加载toBlob方法的问题
请加入以下代码：

 if (!HTMLCanvasElement.prototype.toBlob) {
                Object.defineProperty(HTMLCanvasElement.prototype, 'toBlob', {
                    value: function (callback, type, quality) {
                        var canvas = this;
                        setTimeout(function () {
                            var binStr = atob(canvas.toDataURL(type, quality).split(',')[1]);
                            var len = binStr.length, arr = new Uint8Array(len);

                            for (var i = 0; i < len; i++) {
                                arr[i] = binStr.charCodeAt(i);
                            }

                            callback(new Blob([arr], { type: type || 'image/png' }));
                        });
                    }
                });
            }

（完毕）