navigation
search
Differences
This shows you the differences between two versions of the page.
| — |
cs-142:cgi [2015/01/07 16:16] (current) ryancha created |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| + | This is a brief tutorial on how to create web pages that call your code. It is possible to have the web page call your C++ code, but we are going to use another language that is like C++ in order to make this tutorial more simple. | ||
| + | First we need to talk about how a web server works. It takes the Universal Resource Locator (URL) that you type into your browser and can convert it into a folder and file structure. All of you have a folder on a web server in the Computer Science Department that you can put things into so they can be seen on the web server. | ||
| + | |||
| + | On the lab computers you can go to Start/Computer/username(//samba1(F:) to access this folder. Open this folder and go to the public_html folder. This is where the web server will look when you enter a URL like | ||
| + | <pre> | ||
| + | http://students.cs.byu.edu/~username | ||
| + | </pre> | ||
| + | |||
| + | You can also access these files from a macintosh by opening a terminal window and then "ssh schizo.cs.byu.edu". | ||
| + | |||
| + | You can create files in this folder that will be seen on the web server. Open notepad and enter the following: | ||
| + | <syntaxhighlight lang="html4strict"> | ||
| + | <html> | ||
| + | Hello World | ||
| + | </html> | ||
| + | </syntaxhighlight> | ||
| + | |||
| + | Save this file as text in F:\public_html\hello.html | ||
| + | |||
| + | You should now be able to see it at | ||
| + | <pre> | ||
| + | http://students.cs.byu.edu/~username/hello.html | ||
| + | </pre> | ||
| + | |||
| + | If you have never written html pages before, you can find a good tutorial at [[http://www.w3schools.com/ w3schools]]. But you would really like to have code executed when you enter a URL. In order to do this, you need to write a form and a CGI script that will be executed when you press the submit button on that form. | ||
| + | |||
| + | Open notepad and enter the following: | ||
| + | <code html4strict> | ||
| + | <html> | ||
| + | <form method="post" action="name.cgi" enctype="multipart/form-data"> | ||
| + | |||
| + | What's your name? | ||
| + | <input type="text" name="name" /> | ||
| + | <p> | ||
| + | What's your favorite color? | ||
| + | <select name="color" > | ||
| + | <option value="red">red</option> | ||
| + | <option value="green">green</option> | ||
| + | <option value="blue">blue</option> | ||
| + | <option value="chartreuse">chartreuse</option> | ||
| + | </select> | ||
| + | <input type="submit" name=".submit" /> | ||
| + | </form> | ||
| + | </html> | ||
| + | </code> | ||
| + | |||
| + | This will create a form that will let you enter your name and your favorite color. When you press the submit button, it will call the cgi script "name.cgi" that we will write next. | ||
| + | |||
| + | Save this file as text in F:\public_html\form.html | ||
| + | |||
| + | Now you want to write code that will be executed when you click on the submit button. | ||
| + | |||
| + | Open notepad and enter the following: | ||
| + | <code perl> | ||
| + | #!/usr/bin/perl | ||
| + | |||
| + | use strict; | ||
| + | use CGI qw/:standard/; | ||
| + | print header; | ||
| + | print start_html('Simple Script'); | ||
| + | if (param) { | ||
| + | print "Your name is ",param('name')," "; | ||
| + | print "Your favorite color is ",param('color'),"<p>"; | ||
| + | } | ||
| + | print end_html; | ||
| + | </code> | ||
| + | |||
| + | Save this file as text in F:\public_html\name.cgi | ||
| + | |||
| + | This program is written in a language called [[http://www.perltutorial.org/ perl]] | ||
| + | |||
| + | It is a lot like C++ and you should be able to pick it up easily and write code that will run from a web page. | ||
