Overview/Questions So I got some HTML pages and stuff. How do I - - PDF document

overview questions
SMART_READER_LITE
LIVE PREVIEW

Overview/Questions So I got some HTML pages and stuff. How do I - - PDF document

CS101 Lecture 04: Web Publishing -or- How do I make my web page show up on the internet? John Magee 2 July 2013 1 Overview/Questions So I got some HTML pages and stuff. How do I make them show up on the web? What are web


slide-1
SLIDE 1

1

1

John Magee

2 July 2013

CS101 Lecture 04: Web Publishing

  • or-

“How do I make my web page show up on the internet?”

2

Overview/Questions

– So I got some HTML pages and stuff. How do I make them show up on the web? – What are web servers, anyway? – How do we transfer files to a web server? – Who can see my pages? – URLs, absolute path, and relative path revisited.

slide-2
SLIDE 2

2

3

The World Wide Web

The World Wide Web A system of interlinked hypertext documents and

  • ther resources accessed via the Internet.

Uniform Resource Locator (URL) A standard way of specifying the location of a resource, it’s name, and how to get it. Example: http://www.bu.edu/index.html http://bu.facebook.com/login.php

4

Displaying a WWW Page

Figure 16.1 A browser retrieving a Web page

How do you “visit a website”?

slide-3
SLIDE 3

3

5

Displaying a WWW Page

– Browser decodes URL to parse out host name and document location. – Browser makes network connection to server. – Client requests resource, and waits for the server to respond (using the hypertext transfer protocol). – Browser parses the response, requests any embedded data, and formats/displays output.

6

Protocol

A protocol is a standard way of doing something. Hyper Text Transfer Protocol (HTTP) specifies how to request and deliver content (e.g. web pages).

slide-4
SLIDE 4

4

7

Hyper Text Transfer Protocol

HTTP is a protocol which specifies requests and responses between clients and servers. It assumes/builds upon:

– The Internet exists/computer is connected – Reliable transport of data – Web servers are waiting to service clients

HTTP is not limited to web pages -- It can be used to transfer any kind of data.

8

How to Publish a Web Page

 Create HTML document, locate ancillary

files (e.g images).

 Transfer files to web server  Set permissions for read access  Test the URL in your browser

slide-5
SLIDE 5

5

9

Recall: Displaying a WWW Page

10

What’s a Web Server?

Is it hardware?  yes! Is it software?  yes! How is it both? What hardware is needed? What software is needed?

slide-6
SLIDE 6

6

11

What’s a Web Server?

Web server: a software application which waits for /responds to HTTP requests. Tim Berners-Lee wrote 2 applications to make the web:

– A web browser called WorldWideWeb – A server called HTTPd

The first WWW Server at CERN.

12

What’s a Web Server?

Today’s web servers use high-performance hardware like this: (fast network and disk access)

Pictured: IBM Blade Servers hosting files.myopera.com, photo from Wikipedia

slide-7
SLIDE 7

7

13

What’s a web server?

The Apache HTTP Server is the most popular web server (since 1996). Roles:

– Processing HyperText Transfer Protocol – Logging – Delivering static content from the file system – Running scripts to deliver dynamic content

14

LAMP Model

The most common structure for web applications uses this configuration: Linux operating system for a server Apache web server software MySQL database software PHP/Perl/Python scripting language to create dynamic HTML

slide-8
SLIDE 8

8

15

How a Web Server Works

 Receives HTTP Request  Search for resource (file) on disk  Send HTTP Response (status code + data)

– If not found: status 404 (NOT FOUND) – If not permitted: status 403 (FORBIDDEN) – … – Else: status 200 (OK) + send data

16

cs-people.bu.edu

Our WWW server is cs-people.bu.edu. The web server has a file system which it searches for a URI (resource pathnames).

– /var/www/html/ maps to http://cs-people.bu.edu/ – Subdirectories for individual users:

  • http://cs-people.bu.edu/<username>

– Example:

  • http://cs-people.bu.edu/mageejo
slide-9
SLIDE 9

9

17

Your UNIX Home Directory

With the CS UNIX account, each user has a “home” directory: General form:

/cs/course/<section>/<username>/

Example:

/cs/course/cs101a2/mageejo/

This has a UNIX pseudonym of ~. Also mapped to your Windows Z:/ drive.

18

Your WWW Directory

The web server will map this URL: http://cs-people.bu.edu/<username>/ to your CS UNIX’s account’s ~/public_html/ directory (aka Z:/public_html/ on CS lab Windows computers).

slide-10
SLIDE 10

10

19

Locate files in Finder/Windows Explorer

Find your files on your local computer

20

How to Transfer Files to csa2.bu.edu

Use a file transfer client-program:

– Fetch (Mac) http://fetchsoftworks.com/ (a free academic license is available) – WinSCP (Windows) http://winscp.net/eng/index.php (also free)

  • SSH Secure Shell (Windows)
slide-11
SLIDE 11

11

21

Connecting by WinSCP:

– Hostname: csa2.bu.edu – Be sure to use the “SFTP” protocol

22

WinSCP to csa2.bu.edu

After you connect, transfer files by drag’n’drop. Then right- click to set permissions.

slide-12
SLIDE 12

12

23

File Protection

Users and Groups

Many operating systems (for example, Unix) have a concept of users (each with unique username/password). Users are organized into groups. Example: I’m in all of these groups: grad3 cswebapps cs108grades medical

snbench cs101web cs108stuff cs101grades cs108

Example: you are in one of these group: cs101a2, cs101a3, cs101a4, cs101a5,

cs101b2, cs101b3 or cs101b4

24

File Permissions

File Permissions

Each file has its own set of permissions for:

– Reading, writing or executing – Owner, group, or others – This leads to a 3x3 matrix of permissions:

slide-13
SLIDE 13

13

25

Setting Permissions by WinSCP

 Right-click to open this dialog  Set the permissions to 644  Use 755 for subdirectories

26

Transferring File by Fetch

 Use drag’n’drop interface to transfer files…  Then use the Get Info button to set permissions.

slide-14
SLIDE 14

14

27

Setting Permissions by Fetch

 Set permissions to 644  Use 755 for subdirectories

28

Testing the Webpage:

After uploading the files, test in your browser: There are two special filenames that the web server looks for automatically:

– home.html – index.html You can leave off the filename when typing the URL!.

slide-15
SLIDE 15

15

Troubleshooting

 404 Not Found

– Check that you typed the URL correctly. – File names are case sensitive on web servers: HELLO.html, hello.HTML, and hello.html are 3 different files names. – Be careful of hidden extensions on Windows computers, so you don’t end up with a file named: index.html.html

29

Troubleshooting

 403 Forbidden

– Check the file permissions

  • Files should be 644
  • Subdirectories should be 755

30

slide-16
SLIDE 16

16

Help, my images don’t show up!

– Make sure the images work on your own computer. – Check the <img src=“filename.jpg”> tag for typos. – Place images in same folder as HTML pages. – Filenames are case sensitive on web servers! – Check the file permissions for the image file. – Try to type in the URL of the image itself into the web browser. – Warning: NEVER use absolute local paths:

  • <img src=“z:\public_html\myimage.jpg”>
  • <img src=“c:\cs101\myimage.jpg”>

31 32

Take-Away Points

– Web server – UNIX home directory – File Transfer Protocol – UNIX File Permissions

slide-17
SLIDE 17

17

33

Student To Dos

Readings:

  • Reed ch 2, pp 19-35
  • Reed ch 3, pp 53-57

– HW 01 is a take-home quiz, due by Monday 7/8 @ 11:59pm. – No Class on Thursday 7/4 or Friday 7/5 (CLASS CANCELLED!)