Question

If a user uploads an image, and I resize it using PIL, I get a PIL Image object.

How do I display a PIL Image file in a template, before it has been saved to the database? Can it even be passed in as an image and rendered?

Answer 1

For a limited set of browsers, you can base64 encode the image and use inline images. See Embedding Base64 Images.

A solution that works for all browsers is an image tag referencing a view that returns the image.

[update]

All I want is for the user to submit the original image, and then be prompted by another form to input a caption for the image (with the resized image to the left of the caption field). Then when the user hits “submit” the image and the caption get saved in a model instance.

Well… When you use <img src="foo">, foo is always retrieved by a GET perhaps that is why it is not working – request.FILES will not be available in a GET request. If you open firebug or the chrome debug toolbar, in the network tab, you will see the POST request with the uploaded image and after that a GET request to fetch the image.

You have to save the image somewhere between both steps.

how else could i save it? I would love for it to be temporary. Do you think there’s a really easy way to do this, or should I go look into those options?

Popular choices are redis and memcached. You can think of them as giant shared python dict with an expire date. If the images are small, like an avatar, you can also save the image data in a session variable.