[英]Amazon S3 CORS issue with SVG on All major browser
I have correctly setup S3 ( I believe so !! ) because other images, and webfonts are correctly loading from S3.我已经正确设置了 S3(我相信是这样!!)因为其他图像和 webfonts 正在从 S3 正确加载。 However, in my HTML design, I have this -
但是,在我的 HTML 设计中,我有这个 -
<svg><use xlink:href="assets/img/i.svg#i-facebook"></use></svg>
Somehow, it is not loading on all browsers ( I have tested on Chrome and Firefox ).不知何故,它并没有在所有浏览器上加载(我已经在 Chrome 和 Firefox 上进行了测试)。 On chrome it gives a error atleast, firefox dismisses it silently.
在 chrome 上,它至少给出了一个错误,firefox 默默地驳回了它。
I have just found one similar resource - https://github.com/jonathantneal/svg4everybody/issues/16 .我刚刚找到了一个类似的资源 - https://github.com/jonathantneal/svg4everybody/issues/16 。
How to get past this issue.如何解决这个问题。
After a number of days looking into this, there is NO SOLUTION to this in the way we imagine that SVG <use>
tag should work with CORS.经过几天的研究,我们认为 SVG
<use>
标签应该与 CORS 一起工作,没有解决方案。
It is a feature that browser developers are waiting for from the SVG Working Group .这是浏览器开发人员正在等待SVG 工作组提供的一项功能。
Generally speaking this is normally because Cross-Origin Resource Sharing (CORS) has not been enabled on your S3 bucket.一般来说,这通常是因为您的 S3 存储桶尚未启用跨域资源共享 (CORS)。
You can find a walk-through to enable it here .您可以在此处找到启用它的演练。 Check the part headed with "How Do I Enable CORS on My Bucket?".
检查标题为“如何在我的存储桶上启用 CORS?”的部分。
the following code fixes the problem以下代码解决了问题
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<AllowedMethod>HEAD</AllowedMethod> <!-- optional line -->
<MaxAgeSeconds>3000</MaxAgeSeconds> <!-- optional line -->
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
the easiest way could be https://s3browser.com/ , Buckets > CORS configuration ..paste the XML code, that's it最简单的方法可能是https://s3browser.com/ ,Buckets > CORS 配置..粘贴 XML 代码,就是这样
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.