filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale");
有一段时间,这个工作完全正常,但现在我在控制台中收到这个错误:
Unsafe attempt to load URL data:image/svg+xml;utf8,http://www.w3.org/2000/svg’ height=’0′>#greyscale from frame with URL [my domain here]. Domains,protocols and ports must match.
不用说,灰度过滤器不再有效.
你可以解释出了什么问题吗?
>这可以修复,以便使用相同的CSS代码,没有错误被抛出,并且过滤器工作?
>考虑到它提到了相同的域和协议,虽然我不知道如何实现解决方案,因为我不明白的问题,我可以放置和链接文件在相同的域/子域与相同的协议,而不是使用外部网址
更新:
User @Potherca评论:
…worked in Chrome 52,broke in Chrome 53…
这也是我的经历. SVG面具在当前版本的Chrome(Chrome版本53.0.2785.116)中不起作用,但在以前的版本中起作用.它仍然可以在Firefox和Safari中工作.
更新2:
我尝试使用https,如xmlns =’http://www.w3.org/2000/svg’…但错误/ bug仍然存在.
更新3:
根据用户@Potherca建议,将SVG过滤器线移动到跨浏览器过滤规则列表的顶部消除了错误.注意:这是一种解决方法,但Chrome / Safari / webkit中仍然存在主要错误,但在此更新时,其他浏览器/工具包中并不存在.