Synopsis

Describes how to display images stored in a database.

Discussion

It is often useful to serve images from the database through the Web application server instead of storing copies of the images in the Web server's document directory. WebObjects 4.0 adds enhancements to WOImage and WOActiveImage to ease this process.

In the EOModel for the Movies example database, the TalentPhoto class has a photo attribute that stores an NSData representing the photograph image of an actor or director. You can use recent enhancements to the WOImage component to display the image of the actor in an application. This example uses the new data and mimeType bindings to accomplish this.

The following steps illustrate how to add database-stored images to an application. The example uses the Movies EOModel and a Wizard-generated application. To prepare the example, perform the following steps:

Start Project Builder.

1. Create a new WebObjects Application project, selecting Wizard for assistance and Java as the primary language.
2. Choose the "existing model" option and select the Movies.eomodeld file.
3. Select the Talent entity.
4. Choose Selected Record and Paginated for the layout.
5. Include the firstName and lastName attributes to display, and lastName for the hyperlink.

To add the image, perform the following steps:

Open the Main.wo component in WebObjects Builder.

1. Add a WOImage component to the WOForm (available from the Dynamic elements toolbar or from the Elements->WebObjects menu).
2. In the inspector for the WOImage, add two attributes, one labeled data and the other labeled mimeType .
3. Create the following bindings:

In the data field, enter talentDisplayGroup.selectedObject.photo.photo

For mimeType , select image/gif.

1. Build and run the example. When you select a talent that has an image in the database, the WOImage should display it.

In this example, the data in the database is assumed to be a GIF image. If different image types are stored, you could create an accessory on the class that either stores the type or determines it on-the-fly and returns the appropriate MIME type.

It is also possible to serve images created on-the-fly by the application. Bind the data attribute to a method returning the dynamically generated image. For an example of this, see the CreatePlots example in the Developer/Examples/WebObjects/WebScript folder.

See Also

• Providing for File Uploads
• CreatePlots Example Application
• WOImage specification in the WebObjects Dynamic Element Specifications
• WOActiveImage specification in the WebObjects Dynamic Element Specifications

Questions

• How do I display an image in my application when the image is in the database?

Keywords

• WOImage
• WOActiveImage
• Components
• Database
• Images

Revision History

22 July, 1998. Timothy Joransen. First Draft.
19 November, 1998. Clif Liu. Second Draft.