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/ ...
随机推荐
- EF5+MVC4系列(2) EF5报错 无法确定“XXX”关系的主体端。添加的多个实体可能主键相同
情景:用户表和订单表是一对多的关系,即 一个 Userinfo 对应对应有 多个 Order表 如果我在EF中,先创建一个用户,然后创建3个订单,然后关联这1个用户和3个订单的关系,毫无问题. ...
- mysql错误代码对照表较完整 mysql_errno()
From: http://blog.csdn.net/aidenliu/article/details/5925604 mysql错误代码对照表较完整 0101 属于其他进程的专用标志. 0102 ...
- u3d 发布的程序 窗口位置的改变
using System; using System.Runtime.InteropServices; using UnityEngine; public class WindowMOD : Mono ...
- Link1123:转换到COFF期间失败:文件无效或损坏
当在编译VS项目时,出现如下错误: 这个错误,表明在连接阶段出错.COFF为Common Object File Format,通用对象文件格式,它的出现为混合语言编程带来方便 ...
- LinuxMint下tty.js的安装指南
1.简介 tty.js是使用Node.js开发的开源Web-based SSH.通过浏览器即可远程访问shell. 关于Web-based SSH的介绍参考https://en.wikipedia.o ...
- Android学习之——单击ActionBar实现ListView返回顶部
不知道大家在刷微博时,有没有遇到过,刷新太多,想返回顶部看之前的微博的情况.其实,单击顶部的ActionBar能返回顶部.而不用一直向下拉. 废话不多说,讲讲Android中怎么实现这一功能. 首先, ...
- 将nosetests的echo结果保存到本地文件
nose是很好用的python 测试框架. 但是一直很纠结如何将结果保存到本地.采用nosetests -h查看相关的options,找到一个xunit的东西,似乎可以实现功能. 测试结果: 可见,已 ...
- Nginx 反向代理的正确配置
server { listen 80; server_name 127.0.0.1; #charset koi8-r; #access_log logs/host.access.log main; l ...
- memcache和redis的区别
1.定义 Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,并提供多种语言的API Memcache是一个高性能的分布式的内存对象缓存系 ...
- 8 -- 深入使用Spring -- 3...3 使用Resouce作为属性
8.3.3 使用Resouce作为属性 当应用程序中的Bean实例需要访问资源时,Spring可以直接利用依赖注入. 如果Bean实例需要访问资源,有如下两种解决方案: ⊙ 在代码中获取Resourc ...