Simple but Useful Web Applications with your Favorite Scripting Language Hands-on Lab - Part 1 of 2

Web applications using your favorite scripting language (Hands-On Lab) –
part 1 Matthew Finlayson IBM Corporation August 25, 2009 1:30 – 2:30 PM Share Session 2258

* All other products may be trademarks or registered trademarks
of their respective companies. Java and all Java-related trademarks and logos are trademarks of Sun Microsystems, Inc., in the United States and other countries. Linux is a registered trademark of Linus Torvalds in the United States, other countries, or both. Microsoft, Windows and Windows NT are registered trademarks of Microsoft Corporation. UNIX is a registered trademark of The Open Group in the United States and other countries. SET and Secure Electronic Transaction are trademarks owned by SET Secure Electronic Transaction LLC. Notes: - Performance is in Internal Throughput Rate (ITR) ratio based on measurements and projections using standard IBM benchmarks in a controlled environment. The actual throughput that any user will experience will vary depending upon considerations such as the amount of multiprogramming in the user's job stream, the I/O configuration, the storage configuration, and the workload processed. Therefore, no assurance can be given that an individual user will achieve throughput improvements equivalent to the performance ratios stated here. - IBM hardware products are manufactured from new parts, or new and serviceable used parts. Regardless, our warranty terms apply. - All customer examples cited or described in this presentation are presented as illustrations of the manner in which some customers have used IBM products and the results they may have achieved. Actual environmental costs and performance characteristics will vary depending on individual customer configurations and conditions. - This publication was produced in the United States. IBM may not offer the products, services or features discussed in this document in other countries, and the information may be subject to change without notice. Consult your local IBM business contact for information on the product or services available in your area. - All statements regarding IBM's future direction and intent are subject to change or withdrawal without notice, and represent goals and objectives only. - Information about non-IBM products is obtained from the manufacturers of those products or their published announcements. IBM has not tested those products and cannot confirm the performance, compatibility, or any other claims related to non-IBM products. Questions on the capabilities of non-IBM products should be addressed to the suppliers of those products. - Prices subject to change without notice. Contact your IBM representative or Business Partner for the most current pricing in your geography. The following are trademarks of the International Business Machi The following are trademarks of the International Business Machines Corporation in the United States and/or other countries. nes Corporation in the United States and/or other countries. IBM* IBM eServer IBM e(logo)server* IBM logo* Language Environment* MVS On demand business logo * Registered trademarks of IBM Corporation Trademarks OS/390* Parallel Sysplex* RACF* System z9 z/Architecture z/OS* zSeries*

Designing useful CGI web applications does not require WebSphere and
a team of experts. Using simple scripting languages and a basic knowledge of CGI programming and HTML, you can develop your own simple, yet very useful, web application! In this lab, you will learn the basics of CGI programming and HTML coding and develop your own CGI web application using the scripting language of your choice. Some knowledge of one of these languages will be helpful, however, beginners will still acheive success as step-by-step guides will be available for creating a CGI application using Perl, PHP, REXX and /bin/sh. Note: This lab uses the IBM HTTP Server (IHS) Powered by Apache, however, most of the generic concepts presented also apply to the original IHS. Session Abstract

For the exercises in this lab and to view a
copy of this presentation, open a browser and go to the following page: http://mvs1.centers.ihost.com:8420/~finlay This page contains links to information you will need for the lab exercises. Note: This page will be referred to as the "Lab Home Page" To Get Started

High Level Goals of the Presentation Provide a successful experience
in creating a simple CGI application. Introduce basic CGI, HTML, and programming concepts Provide techniques and references for continuing to develop your skills on your own Provide techniques for debugging your programs In general, to demystify the creation of CGI programs Knowledge will be helpful to admins installing and supporting CGI applications.

Not covered in this presentation Complete specs on protocols (HTTP,
HTML, CGI, Apache server configuration, etc) Simply not enough time and not really needed for level of this course. Detailed programming instruction Again, not enough time. Will provide examples and leave further education up to you and your interest. Security issues Will touch on because important, but presumption is that scope of application is internal use, intranet, etc.

Reading and writing to / from files Running shell commands
password protecting directories using .htaccess using cookies redisplaying form data java-script techniques for: validating input data pop-up windows Follow-up questions/work from this session Session 2259 ”Web applications using your favorite scripting language (Hands-On Lab) Part 2" (Tuesday, 3:00pm in this same room) is the follow-on, or part two, for this session and will cover the following: Covered in the Follow-up Session

Agenda What is a CGI Application and why would you
want to create one? CGI environment Exercise 1: Viewing headers URL format & encoding Exercise 2: Write a simple CGI program Debugging tips (and possible exercise) How data is passed to CGI programs Simple HTML Form Exercise 3: Write a CGI program that accepts data

What is CGI? CGI - Common Gateway Interface A protocol
for interfacing an external application (such as a web- browser) with a server and typically, an application running on that server. If you understand CGI and server environment, you can create a CGI application using any language. Some languages just make it easier or are more popular, but there are no hard requirements. Note that very little HTML is required to understand this process. A CGI application is one that interfaces with the server using the CGI protocols typically stored in /cgi-bin directory and often referred to as "cgi- bins”

Why create a CGI Application? Make data on your z/OS
system accessible from a browser (don't need to logon) • Ex: view log files, view data from a database, view source files Facilitate access to system functionality (perhaps for those who do not have/need accounts or who don't need to understand the TSO or unix shell). • Ex: start programs such as program builds. Because the HTML/browser user interface is better for your needs. easier to program user interface than alternatives your users might not have access to the same tools. browser interface is more universal You would like to reformat the output (using html or other) To expand your horizons!

This diagram shows a simplified web-browser and server environment. It
will be used on following pages to demonstrate the interaction between web-browser and server and CGI programs. CGI Environment Diagram 1

This diagram shows the process of requesting a single file.
In this case it is an html file, but it could be an mp3, zip file, etc. Important! Communication between browser and server is done in ASCII! The z/OS webserver translates text data to and from EBCIDC. Within the z/OS system, data is represented in EBCDIC. There are some "gotchas" to be aware of. CGI Environment Diagram 2

Example of Header and Data

Exercise 1: View Header Records This exercise will show you
what is returned to the browser when a page is requested. Go to the Lab Home Page and click on Exercise 1 When writing your own CGI programs, you will need to make sure your program generates a correct "Content- type" header record. The rest are generated automatically by the server.

URL= Uniform (also "universal") Resource Locator Format (basic): http://somedomain.com:port/dir/file.htm?var1=data&var2=data... Where:
http:// Identifies http (web page) protocol. Optional in most browsers. Could also be https, ftp, etc. :port Port. By default, 80 for webserver. somedomain.com Domain name. Resolves to, and could be, an I.P. address /dir/file.htm Path and file name. Will default to root (/) and index.html (or similar) if not specified. ?var1=data&var2=data Variable data passed from user to server. URL Format (Basic)

http://google.com hTtP://GoOgLe.CoM (domains are case insensitive) http://www.google.com http://google.com:80 google.com http://google.com/
http://google.com/index.html http://64.233.167.99 ("ping google.com") http://mvs1.centers.ihost.com:8420/ (URL of server for this lab) URL Example: simple/common

http://ibm.com/servers/eserver/zseries/zos/unix/port_tools.html Webpage name is "port_tools.html". This URL is different than:
http://ibm.com/servers/eserver/zseries/zos/unix/ (because the above defaults to index.html) http://mvs1.centers.ihost.com:8420/~finlay "~finlay" refers to the root directory for user finlay. http://www.php.net/docs.php "docs.php" is a php script (a cgi app) which generates a web page. This cgi app does not require input data. URL Example: path & filename

http://us3.php.net/results.php?q=url&l=en&p=all ? delimiter between path/filename and data q=url variable "q"
has value "url" & delimiter between variable=value pairs l=en variable "l" has value "en" & delimiter between variable=value pairs p=all variable "p" has value "all" http://buyfromme.com/order.pl?custid=ss110Ag72 This is a fictional URL. Demonstrates how a single id can be use to associate data with a session/user "id". An alternative to "cookies". Instead of carrying all data on each URL, data is saved on server and associated with this ID. URL Example: with data

What if your path, filename, or variable data uses one
of the characters that has a special meaning? ( "?", "=", "&", etc). Question:

What if your path, filename, or variable data uses one
of the characters that has a special meaning? ( "?", "=", "&", etc). Answer: Only alphanumerics [0-9a-zA-Z], the special characters "$-_.+!*'()," and reserved characters used for their reserved purposes may be used unencoded within a URL. Otherwise, they are replaced with hexidecimal representations of their ASCII values, or in some cases, such as the space character, replaced with a "+". So, for example: the following characters are replaced as shown: Char Replacement Char Replacement ---- ----------- ---- ------------ "?" %3F "~" %7E "&" %26 " " %20 (filename) or "+" (in data) "=" %3D "+" %2B Question:

URL Encoding Examples Name of html file contains a space:
"a space.html" • Ex: http://mvs1.centers.ihost.com:8420/~finlay/a%20space.html Value of a variable name (equals ”Matthew Finlayson") contains a space: • Ex: http://somedomain.com/register.pl?name=Matthew+Finlayson Value of a variable subject (equals "does this work?") contains a question mark: • Ex: http://somedomain.com/email.pl?subject=does+this+work%3F

This diagram shows the process of requesting a php CGI
program without passing any data with the request. Note that it is possible for the CGI program to access data, databases and programs which are not directly accessible by URL or normally accessible to the server uid (if using suexec function).. Simple CGI Application

So, minimally, to write CGI program… Your program simply has
to return (write to STDOUT): A "Content-type" record which identifies the type of information you are returning. Typically this will be either: "Content-Type: text/plain" "Content-Type: text/html" Followed by the data The server doesn't care how the program functions as long as it returns the above.

Exercise 2: “Hello World” CGI program In this exercise, you
will write a simple CGI program that displays a "Hello World!" webpage. Go to the Lab Home Page and click on Exercise 2

Debugging your program Verify the program runs from command line:
Does the program run from the command line? (note, it might not run exactly the same as it would under the server, but you can rule out most syntax problems). Verify that the "shbang" statement is correct Check syntax if language supports it. For example, for Perl or PHP: • perl -c program_name • php -l program_name • (This will compile but not execute the program) Check that server has permission to access the directory and execute the program. Does "ls -l" show "other" permissions of execute? (ex: -rwxr-xr-x). Do all parent directories have execute permission? Is the "content-type" record the first thing printed and is it correctly formatted (ends with a blank line)? Run program from command line to confirm.

Debugging your program (cont) Check that your cgi-bin directory is
authorized: Install a simple known working script such as our hello.pl and test Contact webserver admin to verify server configured correctly Run curl against your URL to view headers Is the programming language installed? (Perl and PHP are not provided with base z/OS!). Check server log if you have permission to access it. Usually named "error_log" . On SHARE lab system, it is in directory /usr/lpp/apache/logs/ Insert debug print and exit statements into code at beginning of program and gradually move them deeper into the code as you rerun program and verify early code is correct. Be aware that the server environment might be different from your command line environment. (PATH, LIBPATH, access to directories/files). You may need to recreate input data sent from server.

Anyone have a problem with their "hello world" CGI program
that we can use as a debug exercise? Debug Exercise?

This diagram shows the process of requesting a php CGI
program where data is passed with the request. This is also same process that would be followed if the data were submitted via an HTML form. Prior to invoking the CGI program, the server makes the data available to the program via environment variables. (Which environment variables are set varies based on whether the data was passed via a Get versus a Post request). Knowing how to get this data from the environment is one of the keys to writing CGI programs. Fortunately, most scripting languages provide functions that simplify this. CGI program which receives data

How data is passed to CGI programs Get Method used
when data passed on URL Default for html <forms> when no method specified. Server puts data in QUERY_STRING environment variable before invoking program. Post Method used when "post" specified on html forms Server pipes data to STDIN and sets length of data in CONTENT_LENGTH environment variable

How a CGI program parses this data In the "old"
days, cut-n-paste code such as the following to parse and store data in variables: Example in Perl. • $buffer= $ENV{'QUERY_STRING'}; • # Split the name-value pairs • @pairs = split(/&/, $buffer); • foreach $pair (@pairs) { • ($name, $value) = split(/=/, $pair); • # Un-Webify plus signs and %-encoding • $value =~ tr/+/ /; • $value =~ s/%([a-fA-F0-9][a-fA-F0-9])/pack("C", hex($1))/eg; • $FORM{$name} = $value; • } • So, if the data passed in QUERY_STRING was: "name=steve+stiert&question=why%3F", the above would store the variables and their values in the following hash array: • $FORM{'name'}="steve stiert" • $FORM{'question'}="why?"

How a CGI program parses this data Good news! Today,
most scripting languages provide robust library routines that greatly simplify this process and minimize chance of errors. We'll look at those for Perl, PHP, and Rexx on the following pages.

How to read data in Perl Use the CGI library:
Example: display_data.pl • #!/usr/lpp/perl/bin/perl • use CGI; • my $query= CGI->new(); • print $query->header(-type => 'text/plain'); • @params=$query->param; # Generate array of variable names • foreach $name (@params) • { • # assign value to hash array member • $FORM{$name}=$query->param($name); • # display variable and value • print "variable $name=\"$FORM{$name}\"\n"; • } Refer to Lab Home Page "display_data" link for working example

How to read data in PHP PHP automatically parses input
data: Example: display_data.php • #!/usr/lpp/php/5.1.2/bin/php • <?php • header('Content-type: text/plain'); • • foreach ( $_REQUEST as $key => $value ) • { • print $key . " " . "=" . " " . $value . "\n"; • } • ?> Refer to Lab Home Page "display_data" link for working example

How to read data in Rexx Use bpxwunix module: Example:
display_data.rex • /* REXX */ • /* Credit to Keith Watts, CA, Inc, for providing examples for which parts of • this code were modeled after. */ • call bpxwunix 'cgiparse -form', , formdata. • say "content-type: text/plain" • say "" • data =formdata.1 • do loop=1 while data <> '' • parse var data pair ';' data • parse var pair 'FORM_' varname "='" value "'" • say varname "=" value • /* Assign value to variable of form FORM.varname for later possible reference */ • rc=value(FORM.varname,value) • end loop Refer to Lab Home Page "display_data" link for working example

The simple HTML form below was generated by the HTML
code shown on the following page. A Simple HTML From

<html> <head><title>A simply input form</title></head> <body> <h2>A simple input form</h2>
<p> <form method="get" action=/~stiert/cgi-bin/display_data.pl> Enter a filename<br>  <input name=filename size=20 maxsize=100> <input type=submit value="Click to Submit"> </form> </body> </html> Source code can be viewed in ~finlay/exercise3/simpleform.htm Simple HTML Form

Calling system commands z/OS Unix system commands can be invoked
from within scripts. Often much easier and just as efficient as figuring out equivalent in scripting language. Perl syntax: $output=`ls -l /tmp/somefile`; PHP syntax: $output=`ls -l /tmp/somefile`; • (yes, syntax is the same for Perl and PHP) Rexx syntax: • bpxwunix('ls -l /tmp/somefile',,output.)

#!/usr/bin/perl # Program: syscalls.pl # Purpose: Calls shell commands to
compile # program and prints timestamp #--------------------------------------------------------------- print "Content-Type: text/plain\n\n"; $timestamp=`/bin/date "+%H:%M:%S"`; print "Compile started at: $timestamp:\n"; $c89out=`/bin/c89 -o hello hello.c 2> errors`; if ( $? != 0) # "$?" holds return code { print "c89 failed\n"; } else { print "c89 successful\n"; } System call: example in Perl

Exercise 3: Create write a CGI program that accepts data
In this exercise, you will write a CGI program that accepts data from the user. Go to the Lab Home Page and click on Exercise 3

Simple but Useful Web Applications with your Fa...

Simple but Useful Web Applications with your Favorite Scripting Language Hands-on Lab - Part 1 of 2

More Decks by Matthew Finlayson

Other Decks in Programming

Featured

Transcript