Play! framework 2.0: How to display multiple images?

Question

I need to display a gallery of photos. So here is my template:

@(photos: List[Photo]) @title = { <bold>Gallery</bold> } @main(title,"photo"){ <ul class="thumbnails"> @for(photo <- photos) { <li class="span3"> <a href="#" class="thumbnail"> <img src="@photo.path" alt=""> </a> </li> } </ul> } 

And here is my controller method:

 public static Result getPhotos() { return ok(views.html.photo.gallery.render(Photo.get())); } 

And here is my bean photo:

  @Entity public class Photo extends Model { @Id public Long id; @Required public String label; public String path; public Photo(String path, String label) { this.path = path; this.label = label; } private static Finder<Long, Photo> find = new Finder<Long, Photo>( Long.class, Photo.class); public static List<Photo> get() { return find.all(); } public static Photo get(Long id) { return find.byId(id); } public static void create(Photo photo) { photo.save(); } public static void delete(Long id) { find.ref(id).delete(); } } 

I set the absolute path of the photo in the src attribute for img node but it does not work. What is the best way to achieve this?

PS: The image is outside the playback application.

Answer 1

Take a look at my very similar question: Direct file transfers due to the Play directory structure , finally I used my second sentence in a very basic sample, which can be shown as:

 public static Result serve(String filepath){ // some stuff if required return ok(new File("/home/user/files/"+filepath)); } 

(use an asterisk with *filepath to resolve lines with slashes inside):

 GET /files/*filepath controllers.Application.serve(filepath : String) 

(the absence of the @ character before photo.path not random)

 <img src="@routes.Application.serve(photo.path)" alt="@photo.alt" /> 

edit:

Of course, you do not need to serve files through the controller if you have an HTTP server and the ability to create a new subdomain / alias pointing to the directory. In this case, you can simply save the links as http://pics.domain.tld/holidays_2012/1.jpg or better still as holidays_2012/1.jpg (and then prefix the template with a subdomain).

Finally, you can configure some alias, i.e. with Apache to use your domain.tld/* as a pointer for the Play app and domain.tld/pics/* as a pointer to some folder

 <VirtualHost *:80> ProxyPreserveHost On ServerName domain.tld ProxyPass /pics ! ProxyPass / http://127.0.0.1:9000/ ProxyPassReverse / http://127.0.0.1:9000/ Alias /pics/ /home/someuser/somefolder_with_pics/ <Directory /home/someuser/somefolder_with_pics/> Order allow,deny Allow from all </Directory> </VirtualHost> 

in this case, it is important to place ProxyPass /pics ! before ProxyPass / http://...