Amazon S3 图像的临时 URL 在 IE 和 Firefox 中有效,但在 Safari 中无效
我正在使用 Amazon S3 来托管图像。 S3 存储桶是私有的,因此我生成一个临时 URL(使用 Right AWS),有效期为 5 分钟允许渲染图像。 URL 看起来像这样(注意:下面的 URL 不起作用):
https://mybucket.s3.amazonaws.com:443/attachments%2F30%2Fsmall.png?Signature=J%2BXzQd95myCNv0Re8arMhuTFSvk%3D&Expires=1235511662&AWSAccessKeyId=1K3MW21E6T8LWBY94C01
这工作正常,我可以将 URL 粘贴到 Firefox 中并显示图像。 IE 也一样。 但是,当我在 Safari 中尝试时,URL 似乎可以解析,但没有显示图像。 同样,如果我尝试使用网页上 IMG 标记的 src 属性中的 URL,Safari 不会呈现任何内容(在所有其他浏览器中都正常),例如:
替代文字 http://lylo.co.uk/screenshot.png
有人看过这个吗之前的行为,你能指出我可能做错了什么(如果有的话)吗?
I'm using Amazon S3 to host images. The S3 bucket is private, so I generate a temporary URL (using Right AWS) with a 5-minute expiry to allow the image to be rendered. The URL looks like this (note: URL below will not work):
https://mybucket.s3.amazonaws.com:443/attachments%2F30%2Fsmall.png?Signature=J%2BXzQd95myCNv0Re8arMhuTFSvk%3D&Expires=1235511662&AWSAccessKeyId=1K3MW21E6T8LWBY94C01
This works fine, and I can paste the URL into Firefox and the image is displayed. Same for IE. However, when I try it in Safari the URL appears to resolve but no image is displayed. Similarly, if I try and use the URL in the src attribute of an IMG tag on a web page, nothing is rendered by Safari (fine in all other browsers), e.g:
alt text http://lylo.co.uk/screenshot.png
Has anyone seen this behaviour before and can you point out what, if anything, I might be doing wrong?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
通过对我正在使用的 S3 库进行一些挖掘,我发现了这里的问题。
当您将文件上传到 S3 时,您必须设置
Content-Type
标头。 在我的情况下,我上传了两个文件,一个是内容类型为application/pdf
的原始 PDF 文件,另一个是 PNG 格式的缩略图预览。 我用来上传到 S3 的库确实设置了Content-Type
标头,但它将原始 PDF 和 PNG 缩略图的标头设置为application/pdf
。看来 Firefox 和 IE 会很高兴地从 S3 渲染 PNG 图像,即使它有错误的
Content-Type
标头,而 Safari 根本不喜欢这样,因此不会渲染图像。因此,修补我正在使用的 S3 库,以便在 PNG 缩略图上正确设置正确的
Content-Type
标头解决了该问题。唷。
With a bit of digging around in the S3 library I'm using I have found the problem here.
When you upload a file to S3 you have to set the
Content-Type
header. In my situation I was uploading two files, one was an original PDF file with a Content-Type ofapplication/pdf
, the other was a thumbnail preview in PNG format. The library I was using to upload to S3 does set theContent-Type
header, but it was setting the header toapplication/pdf
for both the original PDF and the PNG thumbnail.It seems that Firefox and IE will happily render a PNG image from S3 even though it has the wrong
Content-Type
header, whereas Safari doesn't like this at all and consequently won't render the image.So, patching the S3 library I'm using such that the correct
Content-Type
header is correctly set on the PNG thumbnails solved the issue.Phew.
AWS 无法识别您的 URL:
它实际上应该显示为:
在实际提交请求之前,Firefox 将将所有 URL 编码实体(在“?”查询标记之前)替换为其相应的 ASCII 表示形式(即Firefox 会将上例中的
%2F
替换为/
),而 Safari 可能不会。 在这种情况下,AWS 可能会向 Safari 回复 HTTP 404。确保您的 URL 格式适合 AWS。 仔细研究图像检索成功后 Firefox 地址栏中的 URL 与图像检索失败后 Safari 地址栏中的 URL 之间的差异被检索。
Your URL is not recognized by AWS:
It should actually read:
Firefox will replace all URL-encoded entities (prior to the '?' query marker) with their corresponding ASCII representations before actually submitting the request (i.e. Firefox will replace
%2F
with/
in the example above), whereas Safari might not. AWS will likely reply with HTTP 404 to Safari in such circumstances.Make sure that your URL is well formed for AWS. Study carefully any differences between the URL that Firefox has in its address bar after the image is successfully retrieved, vs. the URL that Safari has in its address bar after the image fails to be retrieved.