locked
Web Controls & Upload/Download of Images - Best Practise? RRS feed

  • Question

  • User1018471933 posted

    Hi All,

    I am in the process of customising the CreateUserWizard for one of my projects and have to look at uploading a Profile (user) image as part of the new user's registration. I know from experience that if I expect hundreds or more people to eventually use my website, I would likely run into hassles due to a larger database file, because of these uploaded pictures.

    As such, what would the best practise be in situations like these? Do I create a separate database file and upload the users' images there (with a foreign key linking back to the Users Table?), or do I simply create a folder on the webserver where these pictures are saved to (with a src path <string> saved to the actual DB table?) and simply write code to load/display these pictures remotely when these users are viewing their Profile pages?

    What would be the best practise here? I do not want to take a course of action that would lead to reprogramming the DB (or web project) at a later stage...

    Looking forward to your valued help, as always!

     

    Friday, July 1, 2011 3:51 AM

Answers

  • User-389939489 posted

    Don't know if there is *a* best practice for this, but here is how I would approach the problem:

    I'd store images in the file system, not really because the database would grow too large, but because that makes it easier to access the pictures and even manipulate them (change, move, what-not) *outside* of the system.  This said, the logic could go like this:

    1.1) Constraint the uploaded image file type (by file extension): this can be done on the client-side by checking the file name provided in the file input box upon submit;  it can (and should, server-side logic is primary) be again checked on the server side by the same logic;

    1.2) Constraint the uploaded image file size:  this can be done at request level by setting a proper maxRequestLength in the web.config httpRuntime element (this also prevents denial-of-service attacks, see documentation on the httpRuntime element for details);

    2) On the server-side, upon the user posting the form, if the input is valid (as per the two previous points), resize the image to a specific bounding box:  e.g. allow only images up to 100 x 100 pixels (just an example), and resize down all images bigger than that;  (this should be made clear to the user on the registration page, say with a note beside the file input box;)

    3) Save the (resized) image to a designated folder and store in the database only a reference to the image:  note that this "reference" shouldn't really be an absolute file path or anything similar, otherwise you'd have a dependency that is then a nightmare in maintenance:  a reasonably clean way to do this is to give the saved image a name that is <user_id>.<file_ext> (so that you'd avoid any name conflicts, plus you would not even need a specific field to reference the image with this approach), and the image folder path could be simply defined in the web.config, and easily changed at any time;

    4) (Optionally, but reasonably) the image folder could be outside of the web root, in order to avoid users accessing each others' pictures, so you'd need an http handler to output the image upon request:  with the logic specified in point 3, all the handler would need to know for retrieving a picture would be the user id and the folder path specified in the web config.

    Hope that is enough as a starting point,

    -LV

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, July 2, 2011 6:07 AM