Google app engine Fancybox图像库+；布尔斯托

为了从blobstore检索图像，我通常会执行以下操作，并且效果良好：

<img src="/image?blob_key={{ blob_key }}"></img>

---

听起来您的图像处理程序返回了错误的内容类型。确保您在响应中正确设置了

内容类型

标题。

使用备选方案解决：

            options.push({
                    'href'  : 'image_url',
                    'class' : 'iframe'
                });

            $.fancybox(options, {
                'padding'           : 0,
                'transitionIn'      : 'none',
                'transitionOut'     : 'none',
                'type'              : 'image',
                'changeFade'        : 0
            });

---

在这个URL之后你得到了什么？图像的二进制内容？什么mime类型？是的…那些像“？4567898CDEFGHcdefghhi…”那么，问题是它的内容类型无效？是的..显然..它显示的是一大堆数字和字符而不是图像。我应该设置什么内容类型？我已经编辑了我的问题以包含handler类。正如我所解释的，当我使用元素请求图像时，它工作得很好。那么，如果我使用的是element，我应该怎么做才能让它工作？@MrCooL

image/png

如果是png，

image/jpeg

如果是jpeg，等等。如果你使用标准blobstore上传处理程序上传文件，这应该已经设置好了-你可以用wget或浏览器的开发工具确认。你的意思是这样的吗，抱歉…我不是想问太多问题…但我真的对Blobstore的用法感到困惑…此外，我对web开发还是新手…希望你能给我一个更清楚的例子…@MrCool，更改URL不会有任何效果-你需要在提供图像的请求的响应头中设置mimetype。不过，首先，您应该使用浏览器的开发人员工具查看当前提供的mimetype。

$("a[rel=photo_collections]").fancybox({
'transitionIn'      : 'none',
'transitionOut'     : 'none',
});

<a rel="photo_collections" href="/image/photo.png"> Photos </a>
<a rel="photo_collections" href="/image/photo2.png"> Photos </a>

// This part, the fancybox works but it doesn't display the image correctly. All it shows were some sort of binary data instead of image
<a rel="photo_collections" href="/image?blob_key={{ blob_key }}"            

class RemoteDisplayImageHandler(blobstore_handlers.BlobstoreDownloadHandler):
    def get(self):

    blob_key = self.request.GET.get('blob_key', None)
    blob_info = blobstore.BlobInfo.get(blob_key)

    logging.debug('blob_key=%s', blob_key)
    logging.debug('blob_info=%s', blob_info)

    if not blob_info:
        raise Exception('Blob Key does not exist')

    self.send_blob(blob_info)

            options.push({
                    'href'  : 'image_url',
                    'class' : 'iframe'
                });

            $.fancybox(options, {
                'padding'           : 0,
                'transitionIn'      : 'none',
                'transitionOut'     : 'none',
                'type'              : 'image',
                'changeFade'        : 0
            });