สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

01-406-093-203

การพัฒนาเว็บแอปพลิเคชันด้วยเฟรมเวิร์ค

โดย นายศุภมิตร จันทร์โทวงศ์

สาขาวิชาระบบสารสนเทศ คณะบริหารธุรกิจ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 1 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เช็คชื่อเข้าชั้นเรียน

ให้นักศึกษาสแกน QR Code นี้เพื่อเข้าสู่ระบบเช็คชื่อเข้าเรียน
ระบบจะทำการบันทึกประวัติการเข้าเรียนในวิชานี้อัตโนมัติ

สแกนเพื่อเช็คชื่อเข้าชั้นเรียน (สัปดาห์ที่ 12)

ระบบเช็คชื่อปิดการลงทะเบียนชั่วคราว

ผู้สอนยังไม่ได้เปิดระบบเช็คชื่อสำหรับบทเรียนสัปดาห์นี้ หรือหมดเวลากรอกข้อมูลแล้ว

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 2 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

Authentication (ระบบลงชื่อเข้าใช้งาน)

ระบบตรวจสอบความเป็นตัวตนเพื่ออนุญาตให้สมาชิกเข้าสู่ระบบจัดการข้อมูลที่มีการป้องกัน
Laravel จัดเตรียมเครื่องมือติดตั้งสำเร็จรูปยอดนิยม (Starter Kits) เช่น Laravel Breeze เพื่อลดความยุ่งยากของการเขียนระบบล็อกอินเอง
มีการจัดการสร้างตารางผู้ใช้งาน ระบบสร้างรหัสผ่านแฮช (Bcrypt) และฟังก์ชั่นกู้คืนรหัสผ่านให้เสร็จสรรพ
สามารถเข้าถึงข้อมูลของผู้ใช้ที่ล็อกอินเข้าสู่ระบบได้ทันทีผ่านตัวช่วย auth()->user()

code-example.php

// ตรวจการล็อกอินและแสดงอีเมลผู้ใช้งานปัจจุบัน
if (auth()->check()) {
    $email = auth()->user()->email;
}

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 3 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

ตั้งค่า Layout (Authentication)

การดัดแปลงและจัดระเบียบโครงสร้างหน้าหลักให้ตอบสนองกับระดับผู้เข้าชมที่เปลี่ยนไป
ใช้แท็กคำสั่งคุม @auth ในการเจาะข้อความให้มองเห็นเฉพาะแถบเครื่องมือคนล็อกอินแล้วเท่านั้น
ใช้แท็กคำสั่ง @guest ควบคุมหน้ากากการสมัครสมาชิกหรือปุ่มล็อกอินเพื่อปิดบังข้อมูลเฉพาะบางกรณี
ตัวอย่างการเขียนการเช็กระบบตรวจสอบเพื่อซ่อนหน้าจอยอดขาย

code-example.php

<!-- ใน Navbar.blade.php -->
<nav>
    @auth
        <span>ยินดีต้อนรับ, {{ auth()->user()->name }}</span>
        <a href="/logout">ออกจากระบบ</a>
    @endauth
    
    @guest
        <a href="/login">เข้าสู่ระบบ</a>
        <a href="/register">สมัครสมาชิก</a>
    @endguest
</nav>

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 4 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

ตั้งค่า Middleware (Authentication)

Middleware ทำหน้าที่เป็นผู้คุมประตูตรวจใบเบิกทางในระบบ Routing ก่อนจะส่งต่อผู้ใช้ไปที่ Controller
ใช้ Middleware คีย์ 'auth' บังคับให้เฉพาะผู้ที่ลงชื่อเข้าใช้ระบบสำเร็จแล้วเท่านั้นที่จะเข้าถึงเส้นทางนั้นได้
หากไม่มีประวัติ ลิงก์ระบบจะเด้งหน้าจอให้กลับไปทำการล็อกอินที่ช่องเข้าใช้งานหลักโดยอัตโนมัติ
ตัวอย่างการเขียนป้องกันกลุ่มหน้าหลังบ้านของแอปพลิเคชัน

code-example.php

// การนำ middleware เข้าไปปิดกั้นป้องกันเส้นทางเข้าหน้าจัดการระบบ
Route::get('/admin/users', function () {
    return 'หน้าแก้ไขข้อมูลผู้ใช้เฉพาะพนักงาน';
})->middleware('auth');

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 5 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 1)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 6 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 2)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 7 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 3)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 8 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 4)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 9 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 5)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 10 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 6)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 11 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 7)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 12 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 8)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 13 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

แบบทดสอบก่อนเรียน (Pre-test)

1. คำสั่งใดใช้ในการสร้างเส้นทางเชื่อมโยง (Symbolic Link) ระหว่างที่เก็บข้อมูลส่วนตัวไปยังโฟลเดอร์สาธารณะ?

A. php artisan storage:link

B. php artisan make:symlink

C. laravel link:storage

D. composer storage:link

2. โฟลเดอร์ใดในระบบของ Laravel ที่เก็บอัปโหลดไฟล์ส่วนตัวที่ไม่ควรให้คนภายนอกเข้าถึงได้โดยตรง?

A. storage/app/

B. public/uploads/

C. resources/files/

D. config/filesystems.php

3. เมื่อจัดเก็บไฟล์อัปโหลดเสร็จเรียบร้อยและต้องการนำที่อยู่ไฟล์มาบันทึกลงฐานข้อมูล ควรบันทึกข้อมูลแบบใด?

A. บันทึกไฟล์ภาพทั้งภาพลงฐานข้อมูลโดยตรง (BLOB)

B. บันทึกเพียงพาร์ทที่อยู่ไฟล์ (File Path) เป็นข้อความ string

C. แปลงไฟล์เป็นเลขฐานสิบหก

D. ไม่ต้องบันทึกอะไรเลย

4. เมธอดใดใช้จัดเก็บไฟล์อัปโหลดลงในดิสก์ที่กำหนด โดยระบบจะตั้งชื่อสุ่มให้เพื่อป้องกันการซ้ำซ้อนของชื่อไฟล์?

A. $file->store('folder_name')

B. $file->save('folder_name')

C. $file->upload('folder_name')

D. $file->move('folder_name')

5. หากต้องการดึงค่า URL สมบูรณ์สำหรับแสดงผลภาพอัปโหลดของตารางสินค้าที่เก็บในโฟลเดอร์ public ต้องเขียนฟังก์ชันใด?

A. Storage::url($path)

B. asset($path)

C. Storage::get($path)

D. public_path($path)

6. การตั้งค่าไดรฟ์จัดเก็บไฟล์ (Storage Disks) เช่น เลือกระหว่างจัดเก็บบนเซิร์ฟเวอร์ตนเองหรือ Amazon S3 สามารถตั้งค่าได้ที่ไฟล์ใด?

A. config/filesystems.php

B. config/database.php

C. app/Providers/AppServiceProvider.php

D. bootstrap/app.php

7. หากต้องการลบไฟล์ภาพที่ไม่มีความจำเป็นต้องใช้งานแล้วออกจากระบบดิสก์ ต้องสั่งด้วยคลาสคำสั่งใด?

A. Storage::delete($path)

B. Storage::remove($path)

C. File::destroy($path)

D. Storage::erase($path)

8. หากต้องการกำหนดชื่อของไฟล์ด้วยตนเองขณะทำการอัปโหลด (ไม่ต้องการให้สุ่มชื่อ) ต้องสั่งจัดเก็บด้วยเมธอดใด?

A. $file->storeAs('folder', 'filename.ext')

B. $file->storeWithName('folder', 'filename.ext')

C. $file->saveAs('folder', 'filename.ext')

D. $file->uploadAs('folder', 'filename.ext')

9. ฟังก์ชันใดช่วยหาพาร์ททางกายภาพดิสก์แบบสมบูรณ์ (Absolute Path) บนเครื่องคอมพิวเตอร์เซิร์ฟเวอร์?

A. storage_path()

B. public_path()

C. app_path()

D. base_path()

10. หากต้องการจำกัดการอัปโหลดไฟล์ให้รับเฉพาะไฟล์ภาพประเภท JPEG/PNG เท่านั้น และขนาดห้ามเกิน 2MB ต้องเขียน Validation Rule อย่างไร?

A. required|image|max:2048

B. required|file|size:2MB

C. required|mimes:jpeg,png|limit:2048

D. required|photo|max:2

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 14 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 10)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 15 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 11)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 16 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

เนื้อหาเสริมการเรียนรู้บทเรียนที่ 12 (ตอนที่ 12)

ศึกษาเพิ่มเติมจากเอกสารประกอบการสอนหลักและคู่มือฝึกปฏิบัติ
ทบทวนหัวข้อสำคัญของบทเรียน โครงสร้างโค้ด และสถาปัตยกรรมระบบ
ฝึกฝนทักษะการเขียนโปรแกรมผ่านเวิร์กชอปท้ายบทเพื่อเพิ่มความชำนาญ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 17 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

แบบทดสอบหลังเรียน (Post-test)

1. คำสั่งใดใช้ในการสร้างเส้นทางเชื่อมโยง (Symbolic Link) ระหว่างที่เก็บข้อมูลส่วนตัวไปยังโฟลเดอร์สาธารณะ?

A. php artisan storage:link

B. php artisan make:symlink

C. laravel link:storage

D. composer storage:link

2. โฟลเดอร์ใดในระบบของ Laravel ที่เก็บอัปโหลดไฟล์ส่วนตัวที่ไม่ควรให้คนภายนอกเข้าถึงได้โดยตรง?

A. storage/app/

B. public/uploads/

C. resources/files/

D. config/filesystems.php

3. เมื่อจัดเก็บไฟล์อัปโหลดเสร็จเรียบร้อยและต้องการนำที่อยู่ไฟล์มาบันทึกลงฐานข้อมูล ควรบันทึกข้อมูลแบบใด?

A. บันทึกไฟล์ภาพทั้งภาพลงฐานข้อมูลโดยตรง (BLOB)

B. บันทึกเพียงพาร์ทที่อยู่ไฟล์ (File Path) เป็นข้อความ string

C. แปลงไฟล์เป็นเลขฐานสิบหก

D. ไม่ต้องบันทึกอะไรเลย

4. เมธอดใดใช้จัดเก็บไฟล์อัปโหลดลงในดิสก์ที่กำหนด โดยระบบจะตั้งชื่อสุ่มให้เพื่อป้องกันการซ้ำซ้อนของชื่อไฟล์?

A. $file->store('folder_name')

B. $file->save('folder_name')

C. $file->upload('folder_name')

D. $file->move('folder_name')

5. หากต้องการดึงค่า URL สมบูรณ์สำหรับแสดงผลภาพอัปโหลดของตารางสินค้าที่เก็บในโฟลเดอร์ public ต้องเขียนฟังก์ชันใด?

A. Storage::url($path)

B. asset($path)

C. Storage::get($path)

D. public_path($path)

6. การตั้งค่าไดรฟ์จัดเก็บไฟล์ (Storage Disks) เช่น เลือกระหว่างจัดเก็บบนเซิร์ฟเวอร์ตนเองหรือ Amazon S3 สามารถตั้งค่าได้ที่ไฟล์ใด?

A. config/filesystems.php

B. config/database.php

C. app/Providers/AppServiceProvider.php

D. bootstrap/app.php

7. หากต้องการลบไฟล์ภาพที่ไม่มีความจำเป็นต้องใช้งานแล้วออกจากระบบดิสก์ ต้องสั่งด้วยคลาสคำสั่งใด?

A. Storage::delete($path)

B. Storage::remove($path)

C. File::destroy($path)

D. Storage::erase($path)

8. หากต้องการกำหนดชื่อของไฟล์ด้วยตนเองขณะทำการอัปโหลด (ไม่ต้องการให้สุ่มชื่อ) ต้องสั่งจัดเก็บด้วยเมธอดใด?

A. $file->storeAs('folder', 'filename.ext')

B. $file->storeWithName('folder', 'filename.ext')

C. $file->saveAs('folder', 'filename.ext')

D. $file->uploadAs('folder', 'filename.ext')

9. ฟังก์ชันใดช่วยหาพาร์ททางกายภาพดิสก์แบบสมบูรณ์ (Absolute Path) บนเครื่องคอมพิวเตอร์เซิร์ฟเวอร์?

A. storage_path()

B. public_path()

C. app_path()

D. base_path()

10. หากต้องการจำกัดการอัปโหลดไฟล์ให้รับเฉพาะไฟล์ภาพประเภท JPEG/PNG เท่านั้น และขนาดห้ามเกิน 2MB ต้องเขียน Validation Rule อย่างไร?

A. required|image|max:2048

B. required|file|size:2MB

C. required|mimes:jpeg,png|limit:2048

D. required|photo|max:2

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 18 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

คำถามท้ายบทเรียน

แท็ก Directives ตัวกรองใดของ Blade ที่สั่งแสดงโค้ดและข้อมูลด้านในเฉพาะกับผู้ใช้งานที่ยังไม่ได้ทำการล็อกอินระบบ (Guest)?

A. @auth

B. @guest

C. @notLogged

D. @nonUser

คำอธิบาย: แท็ก @guest ใช้ในการคลุมการแสดงเนื้อหาสำหรับผู้ชมภายนอกที่ยังไม่ได้ผ่านการล็อกอินเข้ามาในระบบ

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 19 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

Workshop 12: ติดตั้งระบบล็อกอินและจัดการความปลอดภัยการเข้าถึงเมนูแดชบอร์ด

1ติดตั้งและตั้งค่า Starter Kit (เช่น Laravel Breeze) เพื่อเตรียมระบบตารางและวิวล็อกอิน
2ออกแบบ Layout นำเสนอแบบแยกเฉพาะหน้าสมาชิกที่ผ่านระบบล็อกอินเรียบร้อย
3ใช้คำสั่งห่อหุ้ม @auth เพื่อดักแยกการเรนเดอร์เมนูออกหน้าบ้านสำหรับแขกและผู้ใช้ที่ล็อกอิน
4ผูกสิทธิ์คุมหน้า Dashboard ในระบบ Routing ผ่านการเรียกใช้งาน auth middleware

command_prompt.sh

Route::get('/dashboard', function () {
    return view('dashboard');
})->middleware(['auth']);

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 20 / 21

สัปดาห์ที่ 12 • ระบบยืนยันตัวตนและการเข้าถึง01-406-093-203 Laravel Course

ใบงานที่ 12: ระบบจัดการการเข้าถึงพื้นที่การสั่งซื้อสินค้าเฉพาะบุคคล

ทำระบบความปลอดภัยสำหรับหน้าจอตะกร้าและการชำระเงิน หากมีผู้ใช้นอกแอปพลิเคชันพยายามแอบป้อน URL ระบบต้องบล็อกและส่งผู้ใช้งานกลับไปที่หน้าล็อกอินโดยใช้ Middleware

เกณฑ์การตรวจประเมินผล:

การนำเข้าระบบและทำระบบล็อกอินได้ถูกต้องสมบูรณ์40%
การติดตั้งป้องกันเส้นทางเข้าด้วย Middleware สิทธิ์40%
การจัดแต่งหน้ากากแสดงสถานะผู้ล็อกอินและปุ่มล็อกเอาต์20%

อาจารย์ผู้บรรยาย: ศุภมิตร จันทร์โทวงศ์สไลด์ที่ 21 / 21