Display PNG from database using WideImage

Question

Using the WideImage extension, I am attempting to render an Image Blob from the database using this function:

protected function renderControlNonEditable()
    {
        assert('$this->model instanceof Item || $this->model->getModel() instanceof Item');
        $content = null;
        if ($this->model->files->count() > 0)
        {
            $content  .= '<ul class="attachments">';
            foreach ($this->model->files as $fileModel)
            {
                $filecontent = FileContent::getById($fileModel->id);
                $filecontent = $filecontent->content;
                $content .= '<li><span class="icon-attachment"></span>';
                $content .= FileModelDisplayUtil::renderDownloadLinkContentByRelationModelAndFileModel($this->model,
                                                                                                       $fileModel);
                $content .= ' ' . FileModelDisplayUtil::convertSizeToHumanReadableAndGet((int)$fileModel->size);
                $content .= '</li>';
                $content .= WideImage::load($filecontent);
            }
            $content .= '</ul>';
        }
        return $content;
    }

But when the $content is rendered it shows the following BLOB string instead of rendering the image.

�PNG  IHDRd$��8:IDATh�ݛy|Օ����

How can I ensure the proper headers are being issued? What can I do to fix this?

public function actionImage($model, $fileModel)
    {
         $filecontent = FileContent::getById($fileModel->id);
                $filecontent = $filecontent->content;
        $content = WideImage::load($filecontent);

        return $content;
    }

Answer 1

Well, as other people mentioned you cannot dump the output of wideimage (or any image) on a html page. Your best solution (and only too I guess) is to create another function that handles just the image.

You should create the html just like you do now and instead of

$content .= FileModelDisplayUtil::renderDownloadLinkContentByRelationModelAndFileModel($this->model, $fileModel);            

that I believe is getting the image content, have a

$content .= '<img src="'.$this->createUrl('image',array('file'=>$fileModel)).'">'

Your function (actionImage) should be in the same controller (in my example anyway) should get the blob, do whatever you want to do and then output the image (and only the image, no html).