Colorbox 将图像显示为二进制数据答案

【问题标题】：Colorbox displays image as binary dataColorbox 将图像显示为二进制数据
【发布时间】：2014-08-09 17:14:00
【问题描述】：

我正在尝试使用Colorbox 来构建使用Backbone.js 的网站。我有一个像这样的简单图像标签：

<a class="gallery" href="/document/123"><img class="attachment-preview" src="/document/123" /></a>

url /document/123 显示（简单的 png）图像。 123是图片的id，服务器从DB中获取base64编码的图片，解码后显示。当我在浏览器中输入 example.com/document/123 时，它会正确显示图像，并且图像也可以正确显示我在上面粘贴的标签。

然而，当我点击图片时，颜色框会打开并且只显示我猜的二进制数据：

�wQH*��:�R��hc�:+{�����d��j���}7u($��@�����[�6Ym}���^(_�i�~�H�>�� etc..

所以我的问题是：这怎么可能？更重要的是：我该如何解决？欢迎所有提示！

【问题讨论】：

【解决方案1】：

Colorbox会通过url的扩展名自动检测href目标的内容类型。例如，如果 url 目标是具有 .jpg、.png 或 .gif 扩展名的文件，则颜色框会将内容显示为图像。 Url "/document/123" 将被视为 html 内容，即使它返回一个图像。

您可以通过在初始化彩盒插件时添加 photo: true 属性来解决此问题。

$("a").colorbox({photo:true});

截图：

【讨论】：