Content-disposition:inline header won't show images inline?

hamstar picture hamstar · May 14, 2010 · Viewed 18.8k times · Source

I'm trying to show an image inline on a page. It is being served by a codeigniter controller.

class Asset extends MY_Controller {

    function index( $folder, $file ) {

        $asset = "assets/$folder/$file";

        if ( !file_exists( $asset ) ) {
            show_404();
            return;
        }

        switch ( $folder ) {
        case 'css':
            header('Content-type: text/css');
            break;
        case 'js':
            header('Content-type: text/javascript');
            break;
        case 'images':
            $ext = substr( $file, strrpos($file, '.') );
            switch ( $ext ) {
            case 'jpg':
                $ext = 'jpeg';
                break;
            case 'svg':
                $ext = 'svg+xml';
                break;
            }

            header('Content-Disposition: inline');
            header('Content-type: image/'.$ext);
        }

        readfile( $asset );
    }

}

When I load a image in Chrome of FF its pops up the download window. I know when the browser can't display the content inline it will force a download anyway, but these are PNG and GIF images which display in the browser fine otherwise. In IE it doesn't force a download but it displays the image in ASCII.

If I comment out the entire image case it FF and Chrome both display the ASCII but not the image.

I thought setting the content type would allow FF and Chrome to show the actual image, and also allow the location to be used as an src.

The javascript and css shows fine of course.

Anyone got any ideas how I can make the images show properly?

Answer

Artefacto picture Artefacto · May 14, 2010

Try removing the Content-disposition header. By default, they should be displayed inline anyway.

Anyway, you should be doing something wrong. I've just tested in Opera and IE and they do indeed display the image inline with the content-disposition header. I used:

<?php
header('Content-Disposition: inline');
header('Content-type: image/png');

readfile('Untitled.png');

Use the dev tools of your browser to check the response header.

EDIT

Probably this bug is causing the problem:

<?php
echo substr( "file.ext", strrpos("file.ext", '.') );

gives ".ext" not "ext". Substitute for strrpos() + 1.