Internet / Intranet Fall 2000 Class 7. Brandeis University Internet/Intranet Spring 2000 2 Class 7 Agenda Project / Homework Discussion Forms Validating

Internet / Intranet

Fall 2000

Class 7

Brandeis University Internet/Intranet Spring 2000 2

Class 7 Agenda

Project / Homework DiscussionFormsValidating FormsServer Side IncludesIntro to CGI


HTML FormsA Method to Allow Users to Pass Information to a CGI ScriptForms Allow Information to Be Entered Via:

Text FieldsSelectable ListsCheckboxesRadio ButtonsSubmit / Reset Buttons

Each Field Is Identified by a NameOptional Default ValueE.g.

<INPUT TYPE=“Text” Name=“Field1” Value=“Default”><INPUT TYPE=“Submit” Value=“Click Here”>

Example


HTML Forms (2)Submit Button Sends Data to CGI Script

Name/Value Pairs Separated By &METHOD = “GET”

Uses HTTP Get MethodParameters are Sent in URL

“Command Line” ArgumentsData Follows “?”

Easily Visible to UsersSome Servers Truncate the URLPassed to Perl as QUERY_STRING Environment Variable

METHOD = “POST”Data is Sent in HTTP Message Body Passed to Perl as stdin

ACTION=“URL”Identifies the Target URL

ACTION =“mailto:xxx”Data is Mailed to Target email Address

Example


Forms – Text Fields

Text Box: Type=Text<INPUT Type=“Text” Name=“Field1” Value=“Default” Size=“15” Maxlength=“20”>

Size – Size of Text Box in CharactersMaxlength – The Maximum Number of Characters Allowed

Type=PasswordSame, Except User Input is Echoed as *’s

Note: Password is Still Sent to Server in Plain Text Pwd

Example

Example


Forms – Multiline Text Fields

Multiline Text<TEXTAREA Name=“Fname” Value=“Default” Rows=“5” Cols=“30” WRAP=“Virtual”>

Rows, Cols – The Size of the Field in CharactersNote: This Only Controls the Size of the Display Box.

Scroll Bars Allow More Data.Wrap=Off

No Wrapping. Horizontal Scroll Bar for Additional Text.Wrap=Virtual, Physical

Wrap Text Based on Number of ColumnsWrap=Virtual –Do Not Send Inserted Carriage ReturnsWrap=Physical – Send Inserted Carriage Returns

Example


Forms – CheckBoxes and Radio Buttons

Radio Buttons Allow Only One Option to Be SelectedCheckboxes Allow Multiple Selections

<INPUT Type=“CheckBox” Name=“CB1” Value=“A” CHECKED>Pick1<INPUT Type=“CheckBox” Name=“CB1” Value=“B”> Pick2

Name - Identifies the Grouping. Value – The Value Passed to the Server if This Item is Selected.

For Multiple Selections, Values are Concatenated CHECKED – Indicates the Default Status is Checked

Examples:If the User Checks Pick1:

Sent to Server: CB1=AIf the User Checks Pick1 and Pick2:

Sent to Server: CB1=AB

Example


Forms – List Boxes<SELECT Name=“LBox” Size=“5” Multiple=“5”><OPTION Value=“Choice1” >First Choice<OPTION> Second Choice</SELECT>

Size – The Number of Rows to Display Access Additional Rows Via Scroll BarSize=1 Creates a Drop-Down List

Multiple – The Maximum Number of Items That Can Be Selected From List

Values are Concatenated When Sent to ServerValue – If Specified, This is Sent to Server When Row is Selected

Unspecified – Text in Row is Sent to Server as the Value

Example


Forms – Submit and Reset Buttons

Submit <INPUT type=“submit” value=“press here to submit”>

Reset<INPUT type=“reset” value=“press here to reset”>Sets all Fields to Their Default Values

Example


Forms –Uploading FilesAllows a User to Upload Contents of a File Instead of Text<INPUT Type=“File” Name=“FileField”>

Browser Displays a Text Field and a Browse Button to Allow User to Select a File

If the Form has ENCTYPE=“multipart/form-data”Contents of File Are Uploaded in This Field

ElseThe Filename is Uploaded in This Field

BE CAREFUL!Can Be a Security Hole if Uploaded Files are Stored in Web Accessible DirectoriesAccidentally Selecting a Large File Can Affect Performance

Example


Forms – Hidden Fields

Allows You to Create “Variables”Passed to Server as if Entered By UserNot Displayed to User in Form

Fully Visible in the HTMLTherefore, Not For Sensitive Info (e.g. Passwords)

<INPUT Type=“Hidden” Name=“HidVar” Value=“Myval”>

Example


Forms – Image Maps

<INPUT Type=“Image” NAME=“imb” SRC=“button.jpg”>Similar to a Submit Button

Graphic is Displayed as ButtonAlso Passes the Coordinates Where User Clicks

Server Can Process Coordinates(Server Side Image Maps)

Example


HTML Extensions for Forms“Tool Tips”

TITLE Attribute on Form Tags Label Associated With Form Entry

User Can Click On Label to Select Entry Field<LABEL FOR=“TextID”>Enter Name: </LABEL><INPUT TYPE=“Text” ID=“TextID” Name=“Tname”>

Shortcuts Alt-Character selects Entry FieldACCESSKEY=“X”

Tab OrderTABINDEX=3Negative Number Excludes Field From Tab Order

FieldSetGroups Controls Together (Outline Box)<Legend> Adds Text To Outline Box

Example


Document Object Model: Forms Properties

action – The URL Where Form Will be Submittedlength – The Number of Elements in the Formmethod – “Get” or “Post”name – Name as Specified by Name Attributetarget – If in a Frame, the Target Frame Name

Methodsreset() – Reset the Formsubmit() – Submit the Form

Objectselements[] – Array of input elements in the form.

EventsonResetonSubmit

Return false to Prevent Submission


Validating Forms Using JavaScript

Example


Server Side Includes(See Stein pp. 461-466).shtml Extension By Convention

Not Enabled on All ServersServer Side Include Directives:

echo – print certain variablesDOCUMENT_NAMEDOCUMENT_URIDATE_LOCALDATE_GMTLAST_MODIFIED

include – Include Another Filefsize, flastmod – File Size, Last Modified Date of a Specified Fileexec – Execute a System Shell Commandcgi – Execute a CGI scriptconfig – Adjust Error, Day/Time Formats

Example


CGI / ScriptingScripts are Programs Run By the Server

CGI – Common Gateway InterfaceMethodology For Server/Script Communication

Can Be Written in Any Language Supported By the ServerUNIX Origins

PERL is Most CommonScript Output is Returned to the BrowserAlternative Methodologies Exist

CGI is the Most Portable

PERL – Practical Extraction and Reporting LanguageUNIX Based Scripting LanguagePorted to Multiple Platforms

How Does Browser Know to Execute a Program?Program is in a Script Directory

Typically cgi-bin (Apache)

Or By Extension (e.g. .pl, .cgi)Scripts Must Have Executable Permissions


Scripting FeaturesScripts Can Have Input Parameters

Passed as Part of URL : ? Argument (Query String)Special Characters Passed as % Ascii Hex ValuesName/Value Pairs : Separated by &

Variable Passed in HTTP Header

Name/Value PairsMethod = Post HTML Forms

Passed in CookiesNetscape Origins, Now Widely AdoptedName/Value Pairs Associated With a URLStored on Client ComputerUsers May Turn off Cookies

Scripts Must Be Aware of How Parameters are Being Passed

Different Methodology to Access Each MethodParameters Also Used to Maintain State Information

Help Track a “Session”


Scripting Issues

Security ConcernsNo Limits on What CGI Scripts May AccessPotential to Execute Any System CommandHacker Can Cause Serious and Unforeseen ProblemsPotential to Affect More Than Just Your Web SiteMany ISP’s Limit CGI Capabilities

Performance ConcernsCGI Scripts are Run as a Standalone Process

E.g. Interpreter is Loaded and Initialized Each Time

Alternative to Posting FormsMailto Option


PerlWhy Should I Learn Perl?

S/W Engineers Need to Be Adept at Picking Up New Languages

Need a “Comfort Level” of ExpertiseAbility to Write Basic CodeAbility to View/Modify Existing CodeAbility to Learn More as Needed

Develop Reference “Library”Develop “Guru” Network

Large Public Archives of Perl ScriptsPerl Basics

InterpretedOriginally Used Primarily By UNIX Sys-Admins“Public Domain”The preferred language for CGI ScriptsPERL is Relatively Portable

Activestate ActivePerl (Windows / IIS) UNIX specific scripts dominate (Uses UNIX O/S Commands)


In Class Exercise

Create a Basic FormUse action=“mailto: xxx” to mail the form result to yourself

Documents

Internet / Intranet Fall 2000 Class 7. Brandeis University Internet/Intranet Spring 2000 2 Class 7 Agenda Project / Homework Discussion Forms Validating