HTML5技术

解决Canvas.toDataURL 图片跨域问题 - GIS流水

字号+ 作者:H5之家 来源:H5之家 2016-05-16 11:00 我要评论( )

如题,在将页面的图片地址进行本地输出时(Html2Canvas.js),因不同源存在跨域问题,会出现toDataURL访问权限问题: 】 解决方案: 根据错误分析需要在控制头增加 Access-Control-Allow-Origin ,即允许访问源文件权限,那么我们对这个页面【注意是要输出页

如题,在将页面的图片地址进行本地输出时(Html2Canvas.js),因不同源存在跨域问题,会出现toDataURL访问权限问题:



解决方案:
根据错误分析需要在控制头增加“Access-Control-Allow-Origin”,即允许访问源文件权限,那么我们对这个页面【注意是要输出页面的图片】这样处理:

var img = new Image; img.onload = myLoader; img.crossOrigin = 'anonymous'; //可选值:anonymous,* img.src = 'http://myurl.com/....';

或者是HTML中

">

核心是请求头中包含了 Origin: "anonymous"或"*" 字段,响应头中就会附加上 Access-Control-Allow-Origin: * 字段,问题解决。



 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • [移动端] IOS下border-image不起作用的解决办法 - 小路_同学

    [移动端] IOS下border-image不起作用的解决办法 - 小路_同学

    2017-05-02 12:04

  • 完美解决微信下拉上拉 - wangweisheng

    完美解决微信下拉上拉 - wangweisheng

    2017-04-09 17:04

  • 浓缩的才是精华:浅析GIF格式图片的存储和压缩 - 腾讯云技术社区

    浓缩的才是精华:浅析GIF格式图片的存储和压缩 - 腾讯云技术社区

    2017-04-07 15:08

  • HTML5本地图片裁剪并上传 - QxQstar

    HTML5本地图片裁剪并上传 - QxQstar

    2017-03-25 14:00

网友点评
"