Howto Create a HTML form and read CGI script

Site hosted by Angelfire.com: Build your free website today!

Howto Create a HTML form and read it into a CGI script

To test CGI scripts you need to install a local web server.
PROGRAMMING BY AMATEURS, FOR AMATEURS!
Under "Installing Apache web server" choose you OS's install.

New that Apache 2 is installed and configured. Let test it.
In you web browser's address bar type 127.0.0.1 (Loop back address).
It did not work??
Lets start the web server.
If the httpd.exe console window is open. Close it and then click on the httpd.exe shortcut.
In web browser type 127.0.0.1
You'll see "It works!" and a Send button. Press it.
If the CGI script executed. You will see "Hello world".
The "Hello world" CGI test script is in
https://russellman128.angelfire.com/ApacheWindowsInstall.htm
All this is necessary because you need to know that the web server is setup right.

Lets create an HTML form and name it AddressForm.html.
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>xBase 3 address book html form.</title> </head> <body> <p>. <center><h3>xBase 3 address book html form</h3></center> <FORM ACTION="http://localhost/cgi-bin/AddressBook.cgi" METHOD="POST"> <br>Last Name <input type="text" name="FName" size="40" maxlength="40"> <br>First Name <input type="text" name="LName" size="40" maxlength="40">  <br>Age <input type="text" name="Age" size="3" maxlength="3"> <br>Phone Number xxx-xxx-xxxx. <input type="text" name="FNum" size="12" maxlength="12"> <br><INPUT TYPE="SUBMIT" VALUE="POST"> </body> </html>
Copy this and save as AddressForm.html. And copy it to C:\Apache24\htdocs.
Create a html link to it in the index.html file.
By adding this line to the index.html file.
<A HREF="AddressForm.html">Add adress</A>
New you have a like to AddressForm.html in your index.html file.
Click on it.
If an error saying "Not Found".
Look at the AddressForm.html and see if your text editor add a ".txt" to the end of it.
If so remove the .txt .

Wright a CGI script to Receive, transcribe, And display the form's input.
Open Codeblocks and create a console app called AddressBook.
Copy the code below into the main.cpp file (overwriting it).
Compile it.
Rename the AddressBook.exe to AddressBook.cgi and copy it to the C:\Apache24\cgi-bin directory.

#include <iostream> #include <string.h> ///strcat(). #include <fstream> ///File function. /* It's a command prectus to use using namespace std; Avid it if possible. It add 100's of key words. causing conflict with outer code. In this case char *data; data. use std::ofstream line 126. */ /// GLOBLES /// ///#define are aliases. Without a type. #define rolls 4 ///The number of elements on the form. #define minlength 20 ///Test if form's fields are empty. char *data; ///Raw HTML string, No terminater. char *bdest; ///Decoded HTML string. With the HTML symbles removed. bool MPOST = false; char buffer2[rolls][256]; ///2D array to hold the key/value pair. /// /////////////// Prints to HTML page /////////////////// /// ///////////////////////// ///Prints the key/value pairs on the HTML page. void cgi_debug(char *a,char *b,char *c,char *d) { printf("<BR><BR>OUTPUT"); printf("<BR>%s<BR>%s<BR>%s<BR>%s<BR>\n",a,b,c,d); } /// ///////////////////////// ///HTML header. void header() { ///You need this line. To tell the web browser whot to do. printf("%s%c%c\n","Content-Type:text/html;charset=iso-8859-1",13,10); printf("<html>\n"); printf("<head><title>CGI Output</title></head>\n"); printf("<body>\n"); } /// ///////////////////////// ///HTML foot. At the end of the HTML file. void foot() { printf("</body>\n"); printf("</html>\n"); } /// ///////////////////////// ///HTML body. Prints 2 variables on the HTML page. void output(char *str1,char *str2) { printf("<br>OUTPUT = "); printf("%s %s",str1,str2); } /// ///////////////////////// ///HTML error. Prints errors on the HTML page. void error(char *eerror) { printf("<H3>CGI ERROR!</CENTER></H3>"); printf("<br>ERROR = %s",eerror); } /// /////////////////////////////////////////////////////// /// ///////////////////////// ///Is it POST or Get. char * MethodType() { ///If not POST it GET. casting string to string pointer. char *method = (char *)"GET"; ///Get the method type. POST or GET. method = getenv("REQUEST_METHOD"); if(method == NULL) { ///Is there an error. header(); error((char *)"No REQUEST_METHOD!\n"); foot(); return (char *)"-1"; } if(strcmp(method,"POST")==0) { MPOST = true; } return method; } /// ///////////////////////// ///Convert string HTML symbol to charters. void unencode(char *src, char *last, char *dest) { for(; src != last; src++, dest++) if(*src == '+') *dest = ' '; else if(*src == '&') //*dest = ' '; ///Output to a string. *dest = '\n'; ///Output to a file. else if(*src == '=') *dest = '='; ///Live the = in. Key=value pares. //*dest = ' '; ///Remove the =. else if(*src == '%') { int code; if(sscanf(src+1, "%2x", &code) != 1) code = '?'; *dest = code; src +=2; } else *dest = *src; *dest = '\n'; ///new line. *++dest = '\0'; ///end of file. } /// ///////////////////////// ///Removes the key part, and the =, of the key/value pair. void RemoveKets(char *buffer) { ///static increment between function calls. static int x; ///Decoded string position counter. int y=0; ///buffer position counter. ///Gets rid of the leading keys (like nam). while(bdest[x] != '=') { x++; } ///remove the =. x++; ///While string charter is not new line. Loop. while(bdest[x] != '\n') { ///Assign bdest[x] to buffer[y] = bdest[x]; y++; ///Move the y counter 1 space. x++; ///Move the x counter 1 space. }///End while('\n'). ///Add a NULL character to the end of the value buffer. buffer[y] = '\0'; //output(buffer,(char *)"\n"); ///DEBUG/// } /// ///////////////////////// ///Create a file. And append values to it. void cfile(char *filename) { std::ofstream myfile; myfile.open (filename,std::ios_base::app); for(int x=0;x<rolls;x++) { myfile << buffer2[x]; myfile << "\n"; } myfile.close(); } /// ///////////////////////// /// //////////////////// MAIN ///////////////////////////// int main(int argc, char *argv[]) { ///This is a NULL character. End of string character. char ee[] = "\0"; ///A pointer to the NULL character. char *endf = &ee[0]; char *method; ///POST or GET. ///Is a string representing the CONTENT_LENGTH. eturned from getenv(). char *lenstr; long len; ///A long integer converted from lenstr. ///Get the method type of the form. method = MethodType(); if(strcmp(method,"-1")==0) { return false; } ///Print the HTML header to web page. header(); ///Print method to web page. output((char *)"Method is ",method); ///Get string length as a string. lenstr = getenv("CONTENT_LENGTH"); ///Converts lenstr into an integer. And error(); sscanf(lenstr,"%ld",&len); if(len < minlength) { output((char *)"Post: string to short!",NULL); return 0; } ///Creates 2 buffers./// char buffer[len+1]; ///The raw HTML string. char outbuf[len+1]; ///The buffer to hold the decoded string. ///Get the raw HTML string. POST only. ///buffer does not have a null termination. if(fgets(buffer, len+1, stdin) == NULL) { error((char *)"POST: fgets() error."); return 0; } ///Creates a char pointer to the first charter of buffer array. data = &buffer[0]; ///strncat() adding a null termination. /// To the end of the raw string. len+1. strcat(data,"\0"); ///Print the Raw string to web page. output((char *)"Raw data is ",data); ///Convert the HTML symbol to charters./// ///Loop tell it reaches the null termination. added with strcat(). unencode(buffer, endf, outbuf); ///Creates a pointer to the first charter of outbuf array. bdest = &outbuf[0]; ///Print decoded string to web page. output((char *)"Dec data is ",bdest); ///Remove the key and the = from the key/value pair. /// And stores them in the 2D array. Intermenting the rows. for(int x=0;x<rolls;x++) { RemoveKets(buffer2[x]); } ///Create an apend text file. /// And add the 4 key/value pairs. One roll at a time. cfile((char *)"output.txt"); ///Print value part of the key/value pair. /// One roll at a time to web page. cgi_debug(buffer2[0],buffer2[1],buffer2[2],buffer2[3]); ///Print the HTML footer. foot(); return 0; } /*  <CENTER> <form action="http://localhost/cgi-bin/AddressBook.cgi" method="post"> <br>First Name <input type="text" name="fname" size="25" maxlength="25"> <br>Last Name <input type="text" name="lname" size="25" maxlength="25"> <br>age <input type="text" name="age" size="3" maxlength="3"> <br>Phone <input type="text" name="phone" size="14" maxlength="14"> <br><input type="submit" value="POST"> </CENTER> </form> */

Copy this to the bottom of the index.html file.
<CENTER> <form action="http://localhost/cgi-bin/AddressBook.cgi" method="post"> <br>First Name <input type="text" name="fname" size="25" maxlength="25"> <br>Last Name <input type="text" name="lname" size="25" maxlength="25"> <br>age <input type="text" name="age" size="3" maxlength="3"> <br>Phone <input type="text" name="phone" size="14" maxlength="14"> <br><input type="submit" value="POST"> </CENTER> </form>

So what have we done so far.
Created a link to a HTML form.
How to have 2 forms on the same page.
Code to receive data, transcribe data, send data.

Sending and receiving data: POST and GET.
We need to know something about how CGI script's send the data.
There is 2 method. POST and GET.
The basic difference is:
GET append the string to the end of the address, in plain text.
And has a limit of 256 charters. It is used by most search engines.
Post limit is the amount of memory you have avoidable. And send it through the environment variable.
When receiving data by POST or GET. Always check the length of the data.
You do not wont someone to send you the ecclesiastical britannica and over loading the server. (DOS attack).
We are using POST.
If you use GET and sent the data. The data would look like this.
http://localhost/cgi-bin/AddressBook.cgi?FName=John&LName=Doe&Age=101&FNum=555-121-1212
POST data look like this.
FName=John&LName=Doe&Age=101&FNum=555-121-1212
The first thing we need to do to the data revived is transcribes it.

/// ///////////////////////// ///Convert string HTML symbol to a charters or space. void unencode(char *src, char *last, char *dest) { for(; src != last; src++, dest++) if(*src == '+') *dest = ' '; else if(*src == '&') //*dest = ' '; ///Output to a string. *dest = '\n'; ///Output to a file. else if(*src == '=') *dest = '='; ///Live the = in. Key=value pares. //*dest = ' '; ///Remove the =. else if(*src == '%') { int code; if(sscanf(src+1, "%2x", &code) != 1) code = '?'; *dest = code; src +=2; } else *dest = *src; *dest = '\n'; ///new line. *++dest = '\0'; ///end of file. }
Basely all this code does replace one charter with a charter or space.
With one exception '%' line and it does 2 charters.

Add data to the Xbase 3 file