码迷,mamicode.com
首页 > 其他好文 > 详细

canvas图片跨域问题

时间:2017-11-25 16:11:24      阅读:139      评论:0      收藏:0      [点我收藏+]

标签:draw   cvs   access   doc   src   sso   跨域问题   style   -o   

canvas的drawImage使用跨域图片时候,会报错,解决方法如下:

1. 使用base64替换跨域图片

如果图片不大,且只有几张,可以使用base64,来代替跨域引用图片。

2. 设置image的crossOrigin属性,并且设置服务端的 Access-Control-Allow-Origin:* (或允许的域名)

var cvs = document.getElementById(‘canvas‘);
var ctx = example.getContext(‘2d‘);
var img = new Image();
//配合服务端的Access-Control-Allow-Origin
img.crossOrigin = ‘‘; 
img.onload = function(){
    ctx.drawImage(img,0,0,cvs.width,cvs.height);
    var imgData = ctx.getImageData(100, 100, 1, 1);
};
img.src = "test.png";

 

canvas图片跨域问题

标签:draw   cvs   access   doc   src   sso   跨域问题   style   -o   

原文地址:http://www.cnblogs.com/mengff/p/7895279.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!