การสร้างฐานข้อมูลสำหรับ Login
|
| |
1. เข้า google chrome
2. พิมพ์ localhost ที่ address แล้วกด enter จะปรากฏหน้าจอดังภาพ
|
| |
|
| |
3. คลิก 
จะปรากฏดังภาพ
|
| |
|
| |
4. ช่อง Username พิมพ์ root
5. ช่อง Password พิมพ์ w12345678
6. คลิก Sign in
7. คลิกเลือกฐานข้อมูล dw-db |
| |
|
| |
8. คลิก dw-db (1) ด้านซ้าย เลข (1) หมายถึงมีตาราง 1 ตาราง
|
| |
|
| |
8.1 สร้างตารางเพิ่ม
8.1.1 ชื่อ : admin_system
8.1.2 Number of fields : 4
8.1.3 คลิก ลงมือ
8.1.4 กำหนด “ชื่อฟิลด์” ข้อมูลตามภาพ |
| |
|
| |
8.1.5 คลิก บันทึก
8.1.6 คลิกชื่อตาราง admin_system (ด้านซ้าย)
|
| |
|
| |
8.1.7 คลิก แทรก เพื่อทดสอบเพิ่มข้อมูล
|
| |
|
| |
8.1.8 กรอกข้อมูลลงไป 2 record
|
| |
|
| |
8.1.9 คลิก ลงมือ
|
| |
สร้าง Folder เก็บไฟล์
1.
เข้าโปรแกรม Dreamweaver 
2. คลิกขวา Site – watra (c:\AppServ\www\dw-db)
|
| |
|
| |
3. คลิก New Folder
์ |
| |
|
| |
4. ตั้งชื่อ admin กดปุ่ม Enter
|
| |
|
| |
5. คลิกขวาที่โฟร์เดอร์ admin
|
| |
|
| |
การสร้างไฟล์ Login/Logout ด้วย PHP
การสร้าง Logi |
|
1. คลิก New File
|
| |
|
| |
|
2. ตั้งชื่อ index.php |
| |
|
| |
3.
ดับเบิ้ลคลิก index.php เพื่อเปิดไฟล์
|
| |
|
| |
4. ที่ Title : Admin Login ตั้งชื่อหัวเว็บเพจ Admin Login
|
| |
|
5. คลิก Panel  insert |
| |
|
| |
|
6. คลิก Formss (จะขึ้นเส้นปะสีแดง แสดงว่าสามารถสร้างเฟอร์มได้แล้ว) |
| |
|
| |
6.1 คลิก Text Field |
| |
|
| |
6.2 กำหนดรายละเอียด “ชื่อผู้ใช้” ดังรูปภาพด้านล่าง
6.2.1 ID : uname
6.2.2 Label : Username :
6.2.3 คลิก OK
จะปรากฏดังรูปภาพด้านล่างนี้ |
| |
|
| |
6.3 คลิกด้านหลังช่อง Input กดปุ่ม Shift + Enter ขึ้นบรรทัดใหม่
|
| |
|
| . |
6.4 คลิก Text Field |
| |
|
| . |
6.5 กำหนดรายละเอียด “รหัสผ่าน” ดังรูปภาพด้านล่าง
6.2.1 ID : Pword
6.2.2 Label : Password :
6.2.3 คลิก OK
|
| |
|
| . |
6.6 คลิกช่อง Password (เพื่อให้เวลาพิมพ์เป็นสัญญาลักษณ์ จุด
จุด “...” แทนตัวอักษร)
|
| |
|
| . |
6.7 คลิกท้าย input ของ Password (ท้ายช่อง Password)
|
| |
|
| . |
6.8 เคาะปุ่ม Spacebar ที่แป้นคีย์บอร์ด 1 หรือ 2 ครั้ง
6.9 ที่ Panel 
Forms
Button
|
| |
|
| . |
6.9.1 กำหนดรายละเอียดปุ่ม ตกลง หรือปุ่ม Submit ดังนี้
1) ID : btnLogin
2) Style : No label tag
3) คลิก OK
|
| |
|
| . |
จะได้ดังภาพ
|
| |
|
| . |
6.10 คลิกที่ปุ่ม 
6.11 เปลี่ยน Submit เป็น Login ที่ Panel Properties
|
| |
|
| . |
| . |
| |
การสร้างไฟล์ “for-admin.php” (ตอนนี้สร้างหลอก เพื่อนำไปลิงค์ข้อมูล)
7. สร้างไฟล์ใหม่ ( กด Ctrl + N
เลือก PHP
คลิก Create ) หรือทำตามขั้นตอนด้านล่าง (เพื่อสร้างไฟล์ for-admin.php)
7.1 คลิกเมนู File
7.2 คลิก New
|
| |
|
| . |
7.3 คลิกเลือก PHP |
| |
|
| . |
7.4 คลิก Create 
จะปรากฏหน้าจอเปล่า
|
8. บันทึกข้อมูล ชื่อ for-admin.php
8.1 คลิกเมนู File
คลิก Save as หรือ กด Ctrl + S เพื่อทำการบันทึกไฟล์ (กรณีบันทึกครั้งแรก)
|
| |
|
| . |
8.2 คลิกลง Folder
 admin
8.3 ตั้งชื่อไฟล์ File name: for-admin
8.4 คลิกปุ่ม Save
|
| |
|
| . |
9. คลิก Tab
index.php
|
| |
|
| . |
10. คลิก panel
Insert คลิกลูกศรชี้ลง 
11. คลิกเลือก
Data |
| |
|
| . |
12. คลิกที่ลูกศร
User
Authentication :
13. คลิกเลือก Log In User 
|
| . |
| .
|
| . |
|
14. จะปรากฏดังรูปภาพด้านล่าง ให้กำหนดรายละเอียดตามรูปภาพ
|
| |
|
| |
|
14.1 Get input from from : form1
14.2 Username field : uname
14.3 Password field : Pword
14.4 Validate using connection : MyConnect
14.5 Table : admin_system
14.6 Username column : user_name
14.7 Password column: user_pass
14.8 if login succeeds, go to : for-admin.php
คลิก Browse… เลือกไฟล์ตามที่กำหนด
14.9 if login fails, to to : index.php
คลิก Browse… เลือกไฟล์ตามที่กำหนด
14.10 คลิก OK
15. กด Ctrl + S เพื่อทำการบันทึกอีกครั้ง หรือ คลิกเมนู File
คลิก Save (บันทึกงานเดิม)
|
| |
|
| |
|
16. กดปุ่ม F12 ที่แป้นคีย์บอร์ดเพื่อทดสอบ
|
| |
|
| |
|
17. พิมพ์ Username และ Password ตามที่ได้เคยกรอกไว้
18. คลิกปุ่ม Login
|
| |
|
| |
| |
|
การสร้าง Logout
1. คลิก Tab for-admin.php
(ถ้าไม่มีให้เปิดไฟล์ขึ้นมา ถ้ายังไม่ได้สร้างให้กลับไปทำ ข้อ 10. การสร้างไฟล์ Login/Logout) |
| |
|
| |
|
2. คลิกที่ลูกศร
User
Authentication :
3. คลิกเลือก Log Out User 
|
| |
|
| |
|
. จะปรากฏไดอะล็อกบล็อก Log Out User
4. คลิกปุ่ม Browse…
|
| |
|
| |
|
5. คลิกเลือกไฟล์ index.php
6. คลิก OK
|
| |
|
| |
| |
7. คลิก Tab
index.php
ถ้าไม่มีให้เปิดไฟล์ index.php
ถ้าไม่ได้สร้างกลับไปทำ ข้อ 10. การสร้างไฟล์ Login/Logout การสร้าง Login
|
| |
|
| |
8. กดปุ่ม F12 เพื่อทดสอบ (สังเกตจะมีคำว่า Log out ปรากฏขึ้นมาให้)
|
| |
|
| |
9. คลิก Log out เพื่อทำการทดสอบ
จะกลับสู่หน้า index.php |
| |
|
| |
9. คลิก Log out เพื่อทำการทดสอบ
จะกลับสู่หน้า index.php |
| |
|
| |
| เป็นอันเสร็จสิ้นการกำหนด Log in และ Log out
|
| |
| |
การตรวจสอบสิทธิ์
/ ข้อความตอบรับ (Restrict Access)
การตรวจสอบสิทธิ์ในการใช้งาน และการแสดงข้อความต้อนรับ Username
Restrict Access เป็นการจำกัดการเข้าถึง
1. คลิก Tab ไฟล์ 
index.php
ถ้าไม่มีให้เปิดไฟล์ index.php
ถ้าไม่ได้สร้างกลับไปทำ ข้อ 10. การสร้างไฟล์ Login/Logout การสร้าง Login |
| |
|
| |
2. คลิก Tab ไฟล์
for-admin.php
ถ้าไม่มีให้เปิดไฟล์ for-admin.php
ถ้าไม่ได้สร้างให้กลับไปทำ ข้อ 10. การสร้างไฟล์ Login/Logout
การสร้าง Login
ตั้งแต่หัวข้อย่อ ข้อ 7 - ข้อ 8 และการสร้าง Logout ข้อ 1 – ข้อ 6
|
| |
|
| |
3. คลิก panel Insert เปลี่ยนเป็น Data
|
| |
|
| |
4. คลิกที่ลูกศร
User Authentication :
5. คลิกเลือก Restrict Access To Page
 |
| |
|
| |
|
จะปรากฏหน้าจอดังรูปภาพ
|
|
| |
6. คลิกเลือก Username and password
7. คลิกปุ่ม Browse…
|
| |
|
| |
8. คลิกเลือกไฟล์ index.php
9. คลิก OK |
| |
|
| |
10. คลิก OK (หน้าต่าง Restrict Access To Page)
11. กลับไปที่ไฟล์ index.php ทำการทดสอบ
12. กดปุ่ม F12 ที่แป้นคีย์บอร์ด
|
| |
|
| |
13. คลิก Tab for-admin.php
14. คลิกหน้า คำว่า “Log out”
15. กดปุ่ม Enter เว้นบรรทัด
เพื่อพิมพ์ข้อความ |
| |
|
| |
16. คลิกเลือก Panel
BINDINGS
|
| |
|
| |
16.1 คลิกเครื่องหมายบวก 
16.2 คลิกเลือก Session Variable |
| |
|
| |
16.3 ช่อง Name : MM_Username
16.4 คลิก OK
|
| |
|
| |
16.5 ที่ Tab BINDINGS
ลากคำว่า MM_Username มาวางไว้ด้านหลัง ขอต้อนรับ :
|
| |
|
| |
จะปรากฏดังหน้าจอด้านล่าง
|
| |
|
| |
16.6 กด Ctrl + S บันทึกข้อมูล
17. กลับไปที่ Tab ไฟล์
index.php
18. กดปุ่ม F12 ที่แป้นคีย์บอร์ด เพื่ดทดสอบการทำงาน
|
| |
|
เป็นอันเสร็จสิ้นการทำงาน |
| |
