<

Uploading files to your webpage in WhizBase

Published on
5,391 Points
2,291 Views
1 Endorsement
Last Modified:
Have you ever wanted to upload your files to your hosting, or have you ever want to make a simple images gallery and let the visitors upload their pictures.

In this tutorial I will show you how simple is to write a script for uploading your files online (with no need for complicated web scripts like ASP or PHP) by using WhizBase. I have been a WhizBase developer for 6 months now, I also have been a PHP developer for 7 years.

Simple HTML uploading form

If you want to upload images you will need a form, it is made in pure HTML, a page where you click on "Browse" and select the file you want to upload. Fortunately HTML provides us with the elements, we do not need to write scripts to list files on our computer.

 
<html>
<head>
<title>Upload an Image</title>
</head>
<body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<form action="upload.wbsp" method="post" ENCTYPE="multipart/form-data">
Select file (*.jpg;*.gif - max. 100KB): <input type="file" name="image" size="20"> <input type="submit" name="sButt" value="Upload">
</form>
</body>
</html>

Open in new window


Let take a look in some important elements in this code, first the Form tag, without it our code will not work, the form tag must contain information like action (where to send the file data), method (there is two general methods - get and post; when sending files use post) and enctype(there is a lot of encoding types, multipart/form-data is used for uploading files).

Also we need to use the input of type file, that input is the one which let us browse our computer files. Last is the submit input, it is the button which people will click to send or upload the file.

Save this file as index.htm and put it in a folder so you do not loose it.

The butter of the work

Now we want to make the server-side file, it is the script which takes the file, save it on the hosting server.

 
[FormFields]
WB_AllowMultipart=T

[Upload]
WB_Disallow=![jpg,gif,png,bmp]
WB_UploadDir=/
WB_Overwrite=T
WB_MaxFSize=102400

<!--WB_BeginTemplate-->
<html>
<head>
<title&rt;File uploaded</title>
</head>
<body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
Your file have been uploaded!
</body>
</html> 

Open in new window


OK, do not get afraid, it is not complicated as it seems, I will explain every line before the HTML tag, make yourself a coffee or a tea and sit down and read.

Let me explain first that what is used as a scripting language is WhizBase Server Pages. WhizBase is simple but powerful scripting language on the server-side, it is made for non-programmers to simplify creating database-driven websites without the need for high experience in high-level programming languages. It is not a programming language but it can do everything you need for a web page. You will need to have WhizBase installed on your server, for more information please visit WhizBase.

Now in English, it is a scripting language for everyone, simple and easy for you to use. Let me show you how.

The header section

Every WBSP page have a header, it is a place where we put information needed by the server, everything we write in this section will not appear in our page. This section contains the variables that are essential for processing WBSP file. Here you put information about the database, recordset, template, error template, log file, redirection, etc.

In the code we have [FormFields] which is a tag giving a notice to the WhizBase engine to start interpreting the main commands of the WBSP file.

Then we have WB_AllowMultipart = T. This variable controls if the current WBSP page will accept uploaded files (sent by client using multipart form). If this variable is set to TRUE WhizBase will accept and process uploaded files. This is a security measure so WBSP processes and stores the files that are uploaded.

The second tag is [Upload] which is a notice for the WBSP engine to start receiving information about the uploading process. Now ask yourself, do you want allow anyone to upload viruses or a porn dialer on your server? If no, you need to use WB_Disallow=![jpg,gif,png,bmp], which tells the WBSP engine that we do not want users to be able to upload any file, we only want images. This tag disallows every file which does not have one of the listed extensions.

Where do you want to put your pictures, you need an upload directory, so we use WB_UploadDir=/, this variable defines the name of the directory on the server where WhizBase will save files uploaded using current WBSP file.

Do you want to overwrite your image? WB_Overwrite=T is a variable which defines if the file with same name that already exists on the server will be overwritten by newly uploaded file. We will use T as True. If you define it as F (False) WhizBase will generate a unique file name for the new one and save it like that.

If you do not want visitors to block your server, you need to limit their file's upload size, so you use WB_MaxFSize=102400 which is a variable which defines the maximum size (in bytes) of a single file that can be uploaded using current WBSP file. We have entered 102400 bytes.

Finally we put  to let the server know that now we are starting the body section, where we put our HTML code and what we want to show for visitors.

As you see, we can control everything when uploading files. And that how you simply make an upload form which works without the need of PHP or ASP.

For more information about WhizBase please visit WhizBase site or contact me on NurAzije [at] Gmail [dot] com.

NurAzije is a PHP and WhizBase programmer, who at the time of article publication is working in partnership with WhizBase on several projects.
1
Comment
Author:NurAzije
0 Comments

Featured Post

Cloud Class® Course: CompTIA Cloud+

The CompTIA Cloud+ Basic training course will teach you about cloud concepts and models, data storage, networking, and network infrastructure.

Join & Write a Comment

Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

Keep in touch with Experts Exchange

Tech news and trends delivered to your inbox every month