google-chrome - 资源解释为文档，但使用 MIME 类型 image/jpeg 传输

Question

我正在使用 Filepicker.io 来处理我在我的网站上上传的图片。

我还使用 FancyBox 来显示一个不错的滑块。如果我使用像这样的常规图像，一切正常：http://i.imgur.com/asdf.jpeg作为<img src="">. 这意味着我单击图像，滑块正确弹出。

但是，当我切换出那些静态图像 url 并使用我的 Filepicker 地址时，当我单击图像打开 fancybox 时，图像就会被下载。

这是我在 Google Chrome 上的控制台中收到的消息：

资源解释为文档，但使用 MIME 类型 image/jpeg 传输：“https://www.filepicker.io/api/file/yknn4hWSOOm2NLZYGR3O?dl=false”。

有什么建议么？

Answer 1

由于您的链接：

https://www.filepicker.io/api/file/yknn4hWSOOm2NLZYGR3O?dl=false

没有image扩展名（jpg、png、gif），fancybox 不知道type需要处理哪些内容。您需要通过添加 API 选项来告诉它，"type": "image"例如：

$(".fancybox").fancybox({
   "type": "image"
});

这是记录在这里http://fancybox.net/faq，第 6 号（如果使用 v1.3.4），或这里http://fancyapps.com/fancybox/#support，FAQ 选项卡，第 5 号（如果使用 v2 。X）。

有关如何处理此问题的更多选项，请参见此处： https ://stackoverflow.com/a/17554660/1055987

Answer 2

另一种选择是将文件名附加到 url 上，例如： https ://www.filepicker.io/api/file/yknn4hWSOOm2NLZYGR3O+photo.png?dl=false

Filepicker.io 会忽略 + 号之后文件链接上的任何内容，以使您的 url 更“适配器友好”