html2canvas - 解决办法之图片跨域导致的截图空白
1. 后端支持:图片要是cdn上的地址,并且允许图片跨域,header头中设置应为
2. 前端配置
var opts = {
scale: scale, // 添加的scale 参数
canvas: canvas, //自定义 canvas
logging: false, //日志开关,便于查看html2canvas的内部执行流程
width: width, //dom 原始宽度
height: height,
useCORS: true // 【重要】开启跨域配置
};
使用
let shareContent = document.getElementById('XXX');
html2canvas(shareContent,opts).then(function(canvas) {
//...
})
html2canvas - 解决办法之图片跨域导致的截图空白的更多相关文章
- 快速解决Canvas.toDataURL 图片跨域的问题
出现Canvas.toDataURL 图片跨域问题怎么解决呢?下面小编就为大家带来一篇Canvas.toDataURL 图片跨域问题的快速解决方法.一起跟随小编过来看看吧 如题,在将页面的图片地址进行 ...
- html2canvas截图问题,图片跨域导致截图空白
年前的一个项目,要做一个H5截屏分享的功能,使用的是html2canvas插件,截图功能是实现了,但是跨域的图片死活不出来, 经过几天谷歌百度和不断的尝试,终于找到解决办法了,一共经历了让人心力憔悴的 ...
- JavaScript跨域总结与解决办法 什么是跨域
什么是跨域 1.document.domain+iframe的设置 2.动态创建script 3.利用iframe和location.hash 4.window.name实现的跨域数据传输 5.使用H ...
- 解决Canvas.toDataURL 图片跨域问题
如题,在将页面的图片地址进行本地输出时(Html2Canvas.js),因不同源存在跨域问题,会出现toDataURL访问权限问题: [Redirect at origin 'http://sub1. ...
- 访问本地json文件因跨域导致的问题
我使用jquery的getJSON的方法获取本地的json文件,并进行操作,获取json 数据代码如下: $.getJSON("invite_panel.json",functio ...
- 解决阿里云OSS跨域问题
解决阿里云OSS跨域问题 现象 本人项目中对阿里云图片请求进行了两次,第一次通过img标签进行,第二次通过异步加载获取.第一次请求到图片,浏览器会进行缓存,随后再进行异步请求,保存跨域失效. 错误信息 ...
- Vue-cli proxyTable 解决开发环境的跨域问题
Vue-cli proxyTable 解决开发环境的跨域问题 proxyTable: { '/list': { target: 'http://api.xxxxxxxx.com', pathRewri ...
- Access to Image at 'file:///Users canvas本地图片跨域报错解决方案
1.设置跨域 添加跨域条件 crossorigin="anonymous" 前提是后端支持这个图片跨域 2.上面加了之后还是报错 如标题所示 你需要把你的项目放到服务器上面跑 ...
- 我是如何一步步编码完成万仓网ERP系统的(七)产品库设计 3.品牌图片跨域上传
https://www.cnblogs.com/smh188/p/11533668.html(我是如何一步步编码完成万仓网ERP系统的(一)系统架构) https://www.cnblogs.com/ ...
随机推荐
- R语言绘制带errorbar 的柱状图
代码示例: data <- data.frame(mean = c(10, 15), sd = c(12, 17)) rownames(data) <- c("case" ...
- 9款赏心悦目的HTML5/CSS3应用特效
经过几天的收集,在html5tricks网站上又增加了不少HTML5的教程和应用,今天我把几款赏心悦目的HTML5/CSS3应用特效总结了一下,一共9款HTML5特效,分享给大家. 1.HTML5 W ...
- Java Number类
一般地,当需要使用数字的时候,我们通常使用内置数据类型,如:byte.int.long.double等. 例如: int i = 5000; float gpa = 13.65; byte mask ...
- Nginx + Tomcat 反向代理 如何在高效的在一台服务器部署多个站点
上一篇分享了 Nginx + Tomcat 反向代理 负载均衡 集群 部署指南,感觉还是相当实用型的,但是一般集群部署是基于大访问量的,可能有的企业用不到,类似一些企业官网,访问量并不是很大,基于这个 ...
- 混合线路接入时,360、QQ管家等测速显示电信IP或任意线路的IP
最近很多人QQ上问我,我有电信.联通接入,用户测速的时候有的时候显示联通的IP,可是我想让他显示为电信的IP,怎么办? 3年前开始使用联通的线路时,就这样设置了,有些人还拿这个设置当宝贝了???? 其 ...
- 算法-Java组合
code: import org.assertj.core.util.Lists; import java.util.ArrayList; import java.util.Collections; ...
- 国内各大安卓(Android)市场的上传方式、认领、通过审核有哪些不同,有什么值得注意的地方?
6 个回答 赞同89反对,不会显示你的姓名 唐元鹏,扯淡爱好者 Jc droid.李明亮.知乎用户 等人赞同 作为一个android菜鸟开发者,代码水平不咋样,却练就了一身上传app的本领,大体说一下 ...
- Adb 获取手机信息
adb shell getprop [ro.product.board]: [herring][ro.product.brand]: [google][ro.product.cpu.abi2]: [a ...
- Git项目协同开发学习笔记1:项目库开发基础git命令
这年头git基本都是项目开发的标配,之前刚好碰到了就花了两天时间系统学习了下.本文内容基本来自以下tutorial:Learn Git(建议直接去看原文,因为这个网站是有更新的).这个是我看过对git ...
- [转]WPF入口Application
1.WPF和 传统的WinForm 类似, WPF 同样需要一个 Application 来统领一些全局的行为和操作,并且每个 Domain (应用程序域)中只能有一个 Application 实例存 ...