今天群里有一位同学丢出来一段代码:
var canvas = document.getElementById('canvasBox'),
context = canvas.getContext('2d');
......
var dataUrl=canvas.toDataURL();
说道:FF正常,谷歌会报错。
有另外一个同学说:贴一下截图
这位同学的贴图如下:
可以看到, 他的报错信息是:"Uncaught Error: SECURITY_ERR: DOM Exception 18"。其实这个问题W3C的规范有提到。
那究竟是什么原因造成这个报错呢?
扫码关注w3ctech微信公众号
其实这个问题是因为他是基于file:// 进行调试的,而chrome做了安全相关的处理,主要是HTML5安全的CORS(跨域资源共享)的安全限制,造成出现这样的提示,如果你需要在自己的电脑上调试的话,只需要本地搭建一个服务器环境就可以了。
包括 dataUrl 也是跨站的。这个设计坏处挺多,至少 svg to png 就做不到了
用fiddler比搭服务器还省事,如果只是静态文件
共收到3条回复