csImageFile and csASPUpload - Demo of uploading, resizing and saving images in ASP

This demonstration shows how to capture images that are uploaded in an html form, resize them and save them to disk on the server. The files needed can be downloaded below, together with the trial components.

There are 4 web pages which must all be put in the same folder. A sub folder must be created below this with the name "files". The Internet Guest User must have Modify permission on this sub folder because the demo will need to be able to create and delete files. The demo assumes the trial versions of csASPUpload and csImageFile are being used although it can easily be modified to use the full versions.

Download the example - fileresize.zip (4 KB)

Download the trial csImageFile component - csift.zip (4.3 MB)

Download the trial csASPUpload component - csupt.zip (2.2 MB)

The sample files are listed below. The readme.txt file contains a description of what each file does and how to make the demo work.

File Description
fileupload.htm The starting page. It contains an html form for uploading a file.
filesave.asp This is the script that handles the form data. It uses the csASPUpload & csImageFile components to capture, resize and save the image.
view.asp This script uses the File System Object to list the files already uploaded.
delete.asp This script uses the File System Object to delete selected files that have been uploaded.
readme.txt A description of the application.

Some of the key points will be explained here, although a description is given in the readme.txt file.

fileupload.htm - The HTML form that uploads the file

This is the starting page. It contains an HTML form with an input type of file. It is important to set the "enctype" attribute:

<form method="post" action="filesave.asp" enctype="multipart/form-data">
<input type="file" name="filesent">
<input type="submit" value="Send File">

filesave.asp - The script that resizes and saves the image

This is the script that uses the components to resize and save the file. First the instances of each component are created. These lines must be modified if you use the full or 64 bit versions.

Set Upload = Server.CreateObject("csASPUpload32Trial.Process")
Set Image = Server.CreateObject("csImageFileTrial.Manage")

The main part of the script consists of an If..Then..Else construct which checks if a file has been uploaded, passes it to csImageFile, resizes and saves it. If no file was attached it shows a message. It is recommended to always use the FileQTY property to check for a file before attempting to process it. Further error handling could be introduced by using "On Error Resume Next" before the ReadVariant command to allow a graceful failure if the image is unreadable. We have removed this to keep the example simple.

Width = 200
Height = 100
If Upload.FileQty > 0 Then
  Image.ReadVariant Upload.FileData(0)
  Image.ResizeFit Width, Height
  Image.WriteFile Server.MapPath("./files/") & "\" & Upload.FileName(0)
  'The file has been stored
  'No file was received
End If

The ReadVariant method takes the binary data of the image as a parameter. The FileData property is the file in the appropriate binary format. Note FileData requires an index which is always zero when a single file is uploaded.

view.asp & delete.asp - Scripts to view and delete uploaded files

These two scripts are included to make the demo application more usable. view.asp links to each file in the "files" folder and provides a delete button for each file.

We have variation of this demo available that uses our csASPUpload component on its own to save uploaded files.

There are some working exmples in our live demonstration area.

For a full list of available ASP demos and tutorials - Click Here.