Embedded image

A client recently decided to start storing all of their images in a database and usually we would point the image source to a cfm page, where we'd do something like this:

CODE:
  1. request.uploadedPic = application.staffManager.getStaffImage(session.user.getId());
  2. context = getPageContext();
  3. context.setFlushOutput(false);
  4. response = context.getResponse().getResponse();
  5. out = response.getOutputStream();
  6. response.setContentType("image/jpeg");
  7. response.setContentLength(arrayLen(request.uploadedPic['staffPhoto'][1]));
  8. out.write(request.uploadedPic['staffPhoto'][1]);
  9. out.flush();
  10. response.reset();
  11. out.close();

Which worked nicely until I read about some performance issues with http calls and the cfdocument tag. Zac (yes his name pops up a lot in this blog), put me onto directly embedding the image into the source, like such:

CODE:
  1. <img src="data:image/jpeg;base64,&lt;cfoutput&gt;#BinaryEncode(request.uploadedPic['staffPhoto'][1],'Base64')#&lt;/cfoutput&gt;" alt="Embedded Image" />

No need to make a http call to display the image anymore.


About this entry