27
www.itsci.mju.ac.th/sayan INTRODUCTION TO IT311 SERVER SIDE PROGRAMMING SAYAN UNANKARD 1/2562 0 1

INTRODUCTION TO IT311 SAYAN UNANKARD SERVER SIDE … · 2019-06-30 · • การเขียนโปรแกรมแบบวิธีการน าเสนอ(Markup) •

  • Upload
    others

  • View
    9

  • Download
    0

Embed Size (px)

Citation preview

www . i t s c i .m ju . ac . t h / sayan

INTRODUCTION TO IT311 SERVER SIDE PROGRAMMING

SAYAN UNANKARD1/2562

0 1

WHAT IS IT311?

ทส 311 การโปรแกรมฝงเซรฟเวอร 3 หนวยกตIT 311 Server Side Programming

วชาบงคบกอน : ทส 214 การโปรแกรมเชงวตถ

ค าอธบายลกษณะรายวชา

การโปรแกรมผานเวบโดยเนนทางดานเซรฟเวอรโดยการสรางสครปตเพอจดการท างานของเวบเซรฟเวอร โดยใชเทคโนโลยประเภทเซรฟเวอรเพจ รวมไปถงการขยายความสามารถของเวบเซรฟเวอรประเภทเวบเอนจนทเหมาะสม เพอชวยจดการตดตอกนระหวางไคลเอนตและเวบเซรฟเวอร สถาปตยกรรมการท างานของเวบแบบหลายชน ตลอดจนการจดระบบความปลอดภย รวมไปถงซอฟตแวรทใชในการจดการเวบไซตขนาดใหญ

(บรรยาย 2 ชวโมง ปฏบต 3 ชวโมง ศกษาดวยตนเอง 5 ชวโมง/สปดาห)

2

WHAT IS IT311?

3

WHAT IS IT311?

4

WHAT ARE THE CONTENTS?

• ความรเบองตนเกยวกบ Java Server Pages

• การประมวลผลตามความตองการของไคลเอนต (Processing the Client Request)

• Sessions และ Cookies

• การโปรแกรมบนเวบตดตอกบระบบฐานขอมล (JDBC)

• รปแบบการพฒนาเวบแบบ Model-View-Controller และ ตวอยางการพฒนาเวบแบบ MVC

• การพฒนาเวบในรปแบบ Spring MVC Framework

• Spring MVC + Hibernate

5

WHAT? LEARNING OBJECTIVES

• เพอใหนกศกษาสามารถพฒนาเวบแอปพลเคชนฝงเซรฟเวอรได

• เพอใหนกศกษาสามารถพฒนาเวบเพอตดตอระหวางฝงไคลเอนตและเซรฟเวอรได

• เพอใหนกศกษาสามารถน าความรไปประยกตใชในการพฒนาเวบเพอตดตอกบระบบฐานขอมลได

• เพอใหนกศกษาสามารถแสดงความคดเหนและรบฟงความคดเหน รวมถงการท างานเปนทมได

• ผลลพธการเรยนรระดบรายวชา (Course-level Learning Outcomes: CLOs)เมอสนสดการเรยนการสอนแลว นกศกษาท ส าเรจการศกษาในรายวชาสามารถ

CLO1: สามารถอธบายการน าความรความสามารถดานเทคโนโลยสารสนเทศไปใชในประกอบการ

ท างานในดานตาง ๆ

CLO2: สามารถพฒนาในรปแบบเวบแอปพลเคชนทงในสวนของ Client และ Server ทสามารถตดตอกบระบบฐานขอมลได

6

WHO?

Instructor

อ.ดร.สายณห อนนนกาศ

www.itsci.mju.ac.th/sayan/it311

Email: [email protected]

TAs

พไปรท พแตง พเปป พไนท และ พมารท

7

HOW? WORKLOAD

โครงงานขนาดเลก (Mini project - 20 %)• เปนงานกลม ๆ ละ 2 คน

• ใชระบบจดการฐานขอมลเปน MYSQL หรอ ORACLE

• ออกแบบหนาจอ Web

• พฒนา Java Web Application ดวย Spring MVC

• เอกสารรายงาน 1 เลม

เครองมอและซอฟตแวร• JDK 8 ขนไป• Eclipse IDE for Java EE Developers• Apache Tomcat 8 ขนไป

8

HOW? GRADE

Homework assignments และ/หรอ quizzes 15 %

Midterm exam 30 %

Final exam 30 %

Mini-Project 20 %

Class attendance 5 %

9

50 55 60 65 70 75 80F D D+ C C+ B B+ A

INTRODUCTION TO WEB PROGRAMMING

การพฒนาซอฟตแวรในปจจบนจงมงเนนใหสามารถท างานผานระบบเครอขายอนเตอรเนตเปนจ านวนมากขน โดยมเปาหมายเพอใหเขาถงกลมผบรโภคหรอลกคาไดอยางรวดเรวและเปนไปโดยงาย ซงลกษณะการพฒนาซอฟตแวรทไดรบความนยมในปจจบนแบงเปน 5 ประเภทดงน

• การเขยนโปรแกรมแบบมโครงสราง (Procedural)

• การเขยนโปรแกรมแบบไมมโครงสราง (Nonprocedural)

• การเขยนโปรแกรมแบบวธการน าเสนอ (Markup)

• การเขยนโปรแกรมแบบสครปต (Scripting)

• การเขยนโปรแกรมภาษาเชงวตถ (Object-Oriented Languages)

10

HTTP คออะไร

ยอมาจากโปรโตคอลการโอนยายขอมลแบบขอความ (Hypertext Transfer Protocol) เปนภาษาทใชในการก าหนดรายละเอยดวธการทเอกสารถกสงผานออกไปในระบบอนเตอรเนต ก าหนดกฎเกณฑโดยระบวาเบราเซอรใดทท าการ รองขอ (Request) และเซรฟเวอรซงท าหนาทตอบรบ (Responses)

HTTP มลกษณะเปนการเชอมตอ (Connection oriented) โดยเซรฟเวอรจะท าการเปดการเชอมตอไวเทาทมการใหบรการกบรองขอ และไมมการจดจ าการเชอมตอในแตละครง (Stateless)ซงแตละครงทมการรองขอและตอบรบจะไมขนอยกบสวนอนๆ

11

เทคโนโลยไคลเอนต และ เซรฟเวอร

เปนวธการทใชส าหรบการกระจายขอมลตางๆ ผานระบบเครอขายตงแต ระบบเครอขายระยะใกล (Local Area Network - LAN) เครอขายระยะไกล (Wide Area Network - WAN) หรอระบบอนเตอรเนต สวนทเปนซอฟตแวรฝงเซรฟเวอร ใชส าหรบการเขาถงสวนฮารดแวรของเซรฟเวอร

โดยคนหาไฟลทถกรองขอ (Requested) และสงกลบไปยงไคลเอนตทมการรองขอ จากนนจะรอรบค ารองขอจากไคลเอนตอน ๆ ตอไป

Web Server

Client

HTTP Request

HTTP Response

12

การท างานระหวางเซรฟเวอรและไคลเอนต

เบราเซอรแบงวธการเขาถงขอมลของอนเตอรเนตออกเปนสามสวนคอ • โปรโตคอล HTTP• ชอเซรฟเวอร • ไฟลทถกรองขอ

ซงเบราเซอรจะตดตอกบชอของเซรฟเวอร (Domain Name Server – DNS) เพอแปลงชอของเซรฟเวอรเชน "www.itsci.mju.ac.th" ใหอยในรปของไอพ แอดเดรสเพอตดตอกบไอพนน ๆ

เบราเซอรจะท าการรบการรองขอส าหรบไฟล index.jsp จากนนเซรฟเวอรจะสง HTML กลบไปยงไคลเอนต

13

การท างานระหวางเซรฟเวอรและไคลเอนต

ไคลเอนตรองขอไฟล index.jsp

เซรฟเวอรhttp://www.itsci.mju.ac.th/index.jsp

เซรฟเวอรคนคาไฟลทมการรองขอ

ไคลเอนตคลกลงคไปยงหนาตอไป

เซรฟเวอรคนคาไฟลทมการรองขอ

อน ๆ

ไคลเอนต

14

วธการเขาถงไฟลขอมล

วธการเขาถงขอมลของอนเตอรเนต ใชส าหรบระบทรพยากรทตองการจากเซรฟเวอรอน ๆ โดยปกตแหลงขอมลอาจถกแสดงผลหรอถกดาวนโหลดในรปของไฟลจากดสก

โปรโตคอล พอรต

โฟลเดอร

ไฟลเอกสาร

http://www.itsci.mju.ac.th:80/jsp/index.jsp

ชอเซรฟเวอร

15

การท างานของ HTTP

1. เปดการเชอมตอ2. HTTP รองขอจากเวบเพจ

3. เซรฟเวอรคนคาเวบเพจ4. ปดการเชอมตอ

ขนตอนท 1 เมอไคลเอนตเปดการเชอมตอไปยงเซรฟเวอรทพอรต 80 เชนรองขอไปยง www.itsci.mju.ac.th การตดตอกนจะกระท าผาน TCP/IP โดยการเปดทพอรต 80 ผใชระบ http://<ชอโฮส>:<พอรต> เชนhttp://www.itsci.mju.ac.th เวบเซรฟเวอรจะตรวจสอบคาจากพอรตทก าหนดไว พอรตของเซรฟเวอรอาจเปน Apache: 8080 หรอ IIS: 4040

ขนตอนท 2 ไคลเอนต จะท าการสงการรองขอไปยงเซรฟเวอรโดย HTTP Request จะถกแบงออกเปน 4 สวนคอ - request line ประกอบดวย แหลงขอมล โปรโตคอล

เวอรชน เชน GET /jsp/web01.jsp HTTP/1.1- Request Headers - Empty line- สวนทเปนขอมลของผใช

ขนตอนท 3 เซรฟเวอรจะสง HTTP response กลบไปยงไคลเอนตซงประกอบไปดวย 4 สวน คอ - status line เชน HTTP/1.1 200 OK- response headers- Empty line- ขอมลทมการรองขอ

สถานะ (Status code) เปนตวเลข 3 หลก ดงน1xx แสดงใหเหนถงขอมลทเปนขอความเทานน2xx แสดงวาการท างานส าเรจ3xx สงไฟลไปยง URL อน ๆ4xx ระบวาเกดความผดพลาดในสวนของไคลเอนต5xx ระบวาเกดความผดพลาดในสวนของเซรฟเวอรเชน 200 OK The request succeeded.

404 Not Found.500 Server Error

16

การท างานของ HTTP

1 โปรแกรมเมอรเขยนชดค าสง

2 ไคลเอนตรองขอเวบเพจ

3 เวบเซรฟเวอรหาไฟลทไคลเอนตรองขอ

4 เวบเซรฟเวอรประมวลผลค าสงและสราง HTML

5 คนคากลบไปยงเบราเซอร

6 เบราเซอรประมวลผลและแสดงผล HTML

Client

Web Server

17

การสรางเวบม 2 แบบ

เวบแบบคงท (Web Static content)

ไคลเอนตจะใชเวบเบราเซอรเพอตดตอกบเวบเซรฟเวอรและใช HTTP เพอรองขอเวบเซรฟเวอรส าหรบ เอกสาร HTML เวบเซรฟเวอรจะท าการสงเอกสารการรองขอกลบไปยงเวบเบราเซอร ซงจะแสดงผลเอกสารตามทถกก าหนดไวโดย HTML ไปยงไคลเอนต โดยปกตจะใชส าหรบขอมลทไมตองการเปลยนแปลง บอย ๆ ไมมการโตตอบกบผใช

1. เบราเซอรสงการรองขอไปยงเวบเซรฟเวอร

3. เวบเซรฟเวอรสงไฟล html ไปยงเบราเซอร

2. เวบเซรฟเวอรอานไฟลจากดสก

เบราเซอร

เวบเซรฟเวอร

18

การสรางเวบม 2 แบบ

เวบแบบไดนามก

เวบประเภททเปนไดนามกจะมการโตตอบกบผใช เปนใชโปรแกรมหรอสครปตทางฝงเซรฟเวอรในการสราง HTML แบบไดนามก ในสวนของโปรแกรม จะตองผานขนตอนคอมไพลกอน ดงนนคอมพวเตอรจงสามารถอานโคดได ขอดคอมความเรวสงกวาภาษาสครปต

1. เบราเซอรสงการรองขอ

5. คนคา HTML

ไคลเอนต เซรฟเวอร

2. โหลดโปรแกรม ซจไอจากดสก

โปรแกรมซจไอ

3. เรมประมวลผลซจไอ

4. สรางไฟล HTML

เบราเซอร เวบเซรฟเวอร

19

การโปรแกรมฝงไคลเอนต

• ภาษาทไดรบความนยมจะถกเขยนขนโดยจาวาสครปต และ วบสครปตซงมความรวดเรวเนองจากไมตองการตดตอกบเซรฟเวอร

• ถกใชส าหรบการตรวจสอบความครบถวนและถกตองตามรปแบบของขอมล โดยปกตจะมความปลอดภยนอยกวาการท างานฝงเซรฟเวอร ซงซอรสโคดจะถกดาวนโหลดพรอมกบหนาเพจ และแปลงโคดโดยเบราเซอร ในขณะทหนาเพจ ถกโหลด

• มหลกการในการประมวลผลทงาย ภาษาทใชจะใกลเคยงกบทใชรวมกบ HTML

20

การโปรแกรมฝงเซรฟเวอร

• เปนเทคโนโลยส าหรบการพฒนาเวบเพจทประกอบไปดวยขอมลทมลกษณะเปนไดนามก

• สรางเวบเพจ ทประกอบไปดวยขอมลทอาจมการตดตอกบฐานขอมล แทนทจะใชการดาวนโหลดโปรแกรมและประมวลผลทไคลเอนต

• จะใชไคลเอนตในการรองขอ ประมวลผลโปรแกรมบนฝงเซรฟเวอร และ ดาวนโหลดผลลพธกลบไปยงไคลเอนต

• ซงขอดของการประมวลผลฝงเซรฟเวอร คอ สนบสนนการท างานแบบขามรปแบบได เพยงแตทดสอบโปรแกรมส าหรบระบบปฏบตการนน ๆ ท าใหมทางเลอกมากขนส าหรบแอปพลเคชน

21

การโปรแกรมฝงเซรฟเวอร

เทคโนโลยสครปตบนฝงเซรฟเวอรจะไดแก • จาวาเซรฟเวอรเพจ (Java Server Pages)

• แอคทฟเซรฟเวอรเพจ (Active Server Pages)

• พเฮชพ (PHP)

ในการเลอกใชเทคโนโลยฝงเซรฟเวอรจะตองพจารณาจากปจจยดงตอไปน คอ ความงายในการพฒนา ประสทธภาพการท างาน ปรมาณทรองรบ (Scalability) และทางดานความปลอดภย

22

ตวอยางโปรแกรมภาษา PHP

<html><head><title>Example</title></head><body>

<?phpecho "Hi, I'm a PHP script!";

?></body></html>

23

ตวอยางโปรแกรมภาษา ASP

<% @ Language=VBScript %><html><head><title>Using ASP PAges </title></head><body>

<% Response.Write("Information Technology MJU") %> </body> </html>

24

ตวอยางโปรแกรมภาษา JSP

<%@page contentType=text/html; charset=UTF-8 %>

<%!public java.util.Date showdate() {

return (new java.util.Date());}

%><html><body>

Date Time now is : <%= showdate() %></body></html>

25

การพฒนาเวบแอปพลเคชนดวย JSP มขอดดงน

ท างานโดยไมยดตดแพลตฟอรมใด ไมวาจะเปนระบบ Windows, Linux, Mac OS เปนตน ดงนนเมอพฒนาเวบดวย JSP ในแพลตฟอรมหนงกสามารถยายไปใชงานกบแพลตฟอรมอน ๆ ได

JSP สามารถเรยกใชงาน Java API ไดหลากหลาย ซง Java API คอกลมของคลาสทชวยอ านวยความสะดวกในการใชงานตาง ๆ เชนการจดการเกยวกบเนตเวรค การตดตอฐานขอมล การจดการทางดานกราฟก การจดการเกยวกบออบเจกตตาง ๆ เปนตน

น าคอมโพเนนตกลบใชไดอก โดยทไมตองเสยเวลาเขยนสครปต JSP เพอท างานนนทกครง จงพฒนาเวบไซตเสรจเรวขนมความยดหยนในการใชงาน

26

การพฒนาเวบแอปพลเคชนดวย JSP มขอดดงน

ในการเขยนสครปต JSP เราสามารถก าหนดแทกใหมขนมาใชงาน ใหเหมาะสมกบความตองการได รวมทงสามารถน าไปใชงานรวมกบ XML ไดอยางมประสทธภาพอกดวย

ความปลอดภยสง JSP มระบบการจดการขอผดพลาดตาง ๆ ไมวาจะเปนขอผดพลาดทเกดขนในระหวางการเขยนสครปต หรอขอผดพลาดทเกดจากเมอน าสครปต JSP ไปใชงานจรงลวนสามารถตรวจสอบและรายงานขอผดพลาดไดทนท

มระบบตรวจสอบความปลอดภย ทสามารถปองกนการเขยนสครปตทไมถกตอง ซงอาจจะสงผลกระทบตอการใชทรพยากรตาง ๆ ภายในเซรฟเวอร

27