Web Base Application การพัฒนาการใช้งานในระบบเว็บ รายการเนื้อหา Web Server  Web Browser  การติดต่อระหว่าง Web Server กับ Web Browser    Static Webpage Dynamic Webpage.

Download Report

Transcript Web Base Application การพัฒนาการใช้งานในระบบเว็บ รายการเนื้อหา Web Server  Web Browser  การติดต่อระหว่าง Web Server กับ Web Browser    Static Webpage Dynamic Webpage.

Web Base Application
การพัฒนาการใช้งานในระบบเว็บ
1
รายการเนื้อหา
Web Server
 Web Browser
 การติดต่อระหว่าง Web Server กับ Web Browser



Static Webpage
Dynamic Webpage
2
Client/Server System
ในการทางานของ Webpage จะอาศัย การทางานในลักษณะ
Client/Server คือ ระบบคอมพิวเตอร์ จะต้องมีเครื่ องคอมพิวเตอร์ 2 ส่ วนที่
ทางานร่ วมกันผ่านระบบเครื อข่าย ซึ่ งได้แก่ เครื่ องคอมพิวเตอร์ ที่ทาหน้าที่
เป็ น Server และเครื่ องคอมพิวเตอร์ที่ทาหน้าที่เป็ น Client
โดยปกติ เครื่ อง Server เพียงเครื่ องเดียว ส่ วน Client จะมีจานวน
ตั้งแต่ 2 เครื่ องขึ้นไป ด้วยเหตุผลดังกล่าวในระบบ Webpage ก็จาเป็ น
จะต้องมีโปรแกรมที่ทางานอยูบ่ นเครื่ อง Server และโปรแกรมที่ทางานบน
เครื่ อง Client.
3
Web Server / Browser
คอมพิวเตอร์ ที่เป็ น Server ในความหมายของ Internet คือ เครื่ อง
คอมพิวเตอร์ ที่ติดตั้งโปรแกรม Web Server เช่น โปรแกรม Internet
Information Server (IIS), Personal Web Server (PWS),Apache (Freeware)
ไว้
ส่ วนเครื่ องคอมพิวเตอร์ ที่เป็ น Client จะได้แก่เครื่ องที่มีการติดตั้ง
โปรแกรม Browser เช่น โปรแกรม Internet Explorer, Netscape ไว้
4
Web Server / Browser
ซึ่งในกรณี ที่เครื่ องที่ทาหน้าที่เป็ น Web Server และ Client อยูก่ นั คน
ละเครื่ อง จะเรี ยกการติดต่อระหว่างเครื่ อง Web Server กับ Client ว่าเป็ น
การติดต่อแบบ Remote Connection
Server
Remote
Client
แต่ถา้ เครื่ องที่ทาหน้าที่เป็ น Web Server และ Client อยูใ่ นเครื่ อง
เดียวกัน จะเรี ยกการติดต่อระหว่างWeb Server กับ Client ว่าเป็ นการติดต่อ
แบบ Local Connection
5
Web Server / Browser
การทางานของโปรแกรม Web Server และโปรแกรม Web Browser
จะมีการทางานที่สมั พันธ์กนั คือ
Browser จะเป็ นส่ วนติดต่อกับผูใ้ ช้ จึงมีหน้าที่รับข้อมูลจากผูใ้ ช้ และ
นาข้อมูลที่ส่งกลับมาจาก Web Server มาแสดงผล
Client
Browser
Web Server
6
Web Server / Browser
ส่ วนหน้าที่หลักของ Web Server คือ จะทาการจัดเก็บ, ประมวลผล
และทาการส่ งข้อมูลของ Web Pages ไปแสดงผลที่ Web Browser ตาม
ความต้องการที่ส่งมาจากโปรแกรม Web Browser
Web Server
Client / Browser
ส่ งข้อมูลตามที่ร้องขอ
ร้องขอข้อมูล
HTML, CGI, Image…
7
Static Web Page
ในยุคแรก Web Page จะอยู่
ในรู ปแบบของ Static Web Page
ซึ่ งเป็ นเพ็ จ ที่ ต อบสนองความ
ต้ อ ง ก า ร ข อ ง ผู ้ ใ ช้ อ ย่ า ง จ า กั ด
เนื่ อ งจากการกระท าต่ า งๆ ได้ถู ก
กาหนดไว้ล่วงหน้าเท่านั้น ดังนั้น
รู ปแบบของเพ็จจะเป็ นแบบเดิมอยู่
เสมอไม่ ว่ า ผูเ้ รี ย กเพ็จ นั้น จะเป็ น
ใคร , เวลาใด หรื อ เข้า มาดู จ ากที่
ไหน
Static web page
8
Dynamic Web Page
เว็บไซต์แบบ Dynamic คือเป็ นเว็บที่ผใู ้ ช้
หรื อผูด้ ูแลเว็บ(Web Master) สามารถที่จะ
update ข้อมูลในเว็บไซต์สามารถโต้ตอบกับ
ผูใ้ ช้ได้ โดยอาศัยหลักการของ CGI หรื อ
Common Gateway Interface คือ การรับข้อมูล
จาก Client ไปประมวลผลที่ Server และส่ ง
ผลลัพธ์กลับไปให้ Cilent ภาษาโปรแกรมที่
สนับสนุนหลักการทางานของ CGI มีหลาย
ภาษา แต่ที่ใช้กนั โดยส่ วนใหญ่ มีอยูก่ นั 3 ภาษา
หลัก ๆ ได้แก่ Perl PHP ASP
9
Dynamic Web Page
Webpage ที่มีลกั ษณะเป็ น Dynamic
1. เว็บเพจแบบ Dynamic ที่ฝั่ง Server : จะมีการทางานที่ Server แล้ว
ส่ งผลที่ได้ไปแสดงที่ Browser เช่น ASP, PHP, JSP เป็ นต้น
2. เว็บเพจแบบ Dynamic ที่ฝั่ง Client : จะมีการทางานที่ฝั่งผูใ้ ช้งานโดย
จะมีการเปลี่ยนสภาพแวดล้อมตามผูใ้ ช้งาน เช่น DHTML, JavaScript, เป็ น
ต้น
10
Script Program
โปรแกรม Script จะแบ่งออกเป็ น 2 ประเภทดังนี้
1. โปรแกรม Client-Side Script
2. โปรแกรม Server-Side Script
11
Script


เว็บเพจที่กาหนดการกระทาต่างๆเพื่อสามารถรองรับสถานการณ์ ที่
คาดว่าจะเกิดขึ้นได้ทนั ที
Client-Side Script
 จะถูกแปล Script โดย Browser เช่น VBScript, JavaScript
Server-Side Script
 จะถูกแปลและประมวลผลโดย Web Server เช่น ASP , PHP ,JSP
12
ข้ อดี-ข้ อเสี ยของโปรแกรม Client-Side Script และ Server-Side Script
Client-Side Script จะถูกแปลและประมวลผลที่ Browser ซึ่งไม่ผา่ น
ระบบเครื อข่าย ส่ วน Server-Side Script จะประมวลผลที่ Web Server ซึ่ง
ต้องผ่านระบบเครื อข่าย ดังนั้น Client-Side Script จึงสามารถลดภาระของ
Web Server ซึ่งเป็ นผลให้ “Response Time” เร็ วกว่าโปรแกรม Server-Side
Script
Client-Side Script
Web Server
Client
• มี Response Time ที่เร็ ว
13
ข้ อดี-ข้ อเสี ยของโปรแกรม Client-Side Script และ Server-Side Script
ข้ อจำกัดของ Client-Side Script ได้แก่ โปรแกรมที่พฒั นาด้วย ClientSide Script ในภาษาใดภาษาหนึ่ง อาจไม่สามารถนาไปใช้งานกับ Browser ที่
ต่างกันได้ เช่น
Internet Explorer สามารถใช้ภาษา VBScript และ Jscript ได้
Netscape
สามารถใช้ภาษา JavaScript ได้
ซึ่งต่างจากโปรแกรม Server-Side Script ที่ไม่ข้ ึนอยูก่ บั ตัว Browser
14
ข้ อดี-ข้ อเสี ยของโปรแกรม Client-Side Script และ Server-Side Script
คาสั่งต่างๆ ที่เป็ น Client-Side Script สามารถเรี ยกดูได้ดว้ ยโปรแกรม
Browser ดังนั้นจึงเสี่ ยงต่อการถูกสาเนาโปรแกรม Client-Side Script ไปใช้
โดยผูอ้ ื่น
ส่ วนโปรแกรมที่เป็ นลักษณะ Server-Side Script นั้นจะไม่พบปั ญหา
ดังกล่าวนี้ เนื่องจากตัวโปรแกรม script จะอยูใ่ นส่ วนของ Web Server และ
Web Server จะส่ งเพียงผลลัพธ์ที่ได้จาก Script นั้นๆ ไปยัง Browser เท่านั้น
ซึ่งอยูใ่ นรู ป HTML ที่ไม่มีส่วนประกอบของคาสัง่ Server-Side Script
15
ภาษา PHP
PHP ย่อมาจาก Personal Home Pages ซึ่งเป็ นภาษาสคริ ปต์ที่ถกู ฝัง
ในเว็บเพจ โดยเว็บเพจที่มีสคริ ปต์ PHP แทรกอยูน่ ้ นั จะทางานที่เว็บ
เซิร์ฟเวอร์ (Server-Side Script) คือ จะถูกประมวลผลการทางานที่
เซิร์ฟเวอร์ก่อน แล้วจึงส่ งผลการทางานที่เป็ น HTML มาแสดงผลที่
Browser ของผูใ้ ช้งาน
16
้
Resource ทีใ่ ชในการพั
ฒนา
Dynamic Web Application
• โปรแกรม Web Server เพื่อจำลองเครื่ องคอมพิวเตอร์ให้สำมำรถบริ กำร
กำรเรี ยกดูขอ้ มูลเอกสำรเว็บ ผ่ำนโปรแกรม Web Browser ได้ -> Apache
• ภำษำโปรแกรมที่สนับสนุนหลักกำรทำงำนกำรทำงำนของ CGI -> PHP
• โปรแกรมระบบจัดกำรฐำนข้อมูล -> MySQL
• โปรแกรมช่วยจัดกำรฐำนข้อมูล -> PhpMyAdmin
17
Q&A
18