html2canvas - 解决办法之图片跨域导致的截图空白

1. 后端支持:图片要是cdn上的地址,并且允许图片跨域,header头中设置应为

  Access-Control-Allow-Origin:  *

2. 前端配置

1     var opts = {
2           scale: scale, // 添加的scale 参数
3           canvas: canvas, //自定义 canvas
4           logging: false, //日志开关,便于查看html2canvas的内部执行流程
5           width: width, //dom 原始宽度
6           height: height,
7           useCORS: true // 【重要】开启跨域配置
8       };

使用

let shareContent = document.getElementById('XXX');

html2canvas(shareContent,opts).then(function(canvas) {
   //... 
})

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏闪电gogogo的专栏

sublime学习笔记

1 sublime的几个优点 1.操作简单上手快 2.支持多点编辑:ctrl + 光标 3.基于Package Control强大的包管理功能 4.闪电一样的查...

3066
来自专栏数据科学学习手札

(数据科学学习手札50)基于Python的网络数据采集-selenium篇(上)

  接着几个月之前的(数据科学学习手札31)基于Python的网络数据采集(初级篇),在那篇文章中,我们介绍了关于网络爬虫的基础知识(基本的请求库,基本的解析库...

1504
来自专栏软件测试经验与教训

XSS漏洞总结

同源策略 影响源的因素:host,子域名,端口,协议 a.com通过以下代码:

1602
来自专栏前端说吧

html2canvas - 解决办法之图片跨域导致的截图空白

4647
来自专栏阮一峰的网络日志

Vim 配置入门

Vim 的配置不太容易,它有自己的语法,许许多多的命令。我总是记不清楚,所以就整理了下面这篇文章,列出主要配置项的含义。

1341
来自专栏猿说1024

Linux 常用脚本

2333
来自专栏前端那些事

起步 - vue-router路由与页面间导航

vue-router 我们知道路由定义了一系列访问的地址规则,路由引擎根据这些规则匹配找到对应的处理页面,然后将请求转发给页进行处理。可以说所有的后端开发都是这...

34610
来自专栏Albert陈凯

2018-11-28 最常用的Intellij IDEA快捷键

除了上面的快捷键之外,还有非常多有用的快捷键,几乎每一个在Intellij中的操作都有一个等同的快捷键。 我们很难一下全部学习到位,需要一定的时间和练习。 我每...

1032
来自专栏Google Dart

AngularDart4.0 英雄之旅-教程-02启动应用

码云项目页:https://gitee.com/scooplolwiki/toh-0

812
来自专栏静默虚空的博客

Babel 入门指南

Babel 入门指南 ​⚠ 注意: Babel 可以与很多构建工具(如 Browserify、Grunt、Gulp 等)进行集成。由于本教程选择 Webpa...

2135

扫码关注云+社区