ประกาศจัดงาน Techno : HTML5, WP7 Developers, Social ครั้งที่ 1

เชิญผู้สนใจร่วมงาน Techno <Tags> (by MVPs) ครั้งที่ 1

โดยจะนำเสนอ และถ่ายทอดความรู้ทางเทคโนโลยี ที่น่าสนใจในปัจจุบันและกำลังจะเป็นที่นิยมในอนาคต โดยในครั้งนี้ จะเป็นการเน้นเนื้อหาไปที่ การพัฒนาเว็บเพื่อให้เป็นเว็บแห่งอนาคตด้วย HTML5, ทักษะที่จำเป็นในการพัฒนา App สำหรับ Windows Phone 7, การสร้างเว็บเพื่อเชื่อมต่อกับระบบ Social ของ  Facebook และ Twitter และ การบริหารงานเว็บไซต์ และ hosting ภายใต้ BSD License เหมาะสำหรับ ผู้สนใจในการพัฒนาเว็บด้วย HTML5 , ผู้สร้าง App สำหรับ Windows Phone 7
งานนี้เกิดจากความร่วมมือของ Developer Communities และ MVPs ได้แก่ CodeToday.net, CoreSharp.net ,Greatfrinds.Biz และ MVPs โดยร่วมมือกันจัดงานนี้ขึ้น และได้รับการสนับสนุนต่างๆ จากทาง บ.ไมโครซอฟท์ ประเทศไทย

กำหนดจัดงาน : วันอาทิตย์ที่ 12 มิถุนายน 2554 เวลา 10:00น.- 15:30น.

สถานที่ : ห้อง Auditorium 1-3 บ.ไมโครซอฟท์ ประเทศไทย ชั้น 38  ตึก CRC All Season Place ถ.วิทยุ

การลงทะเบียน : รับลงทะเบียนจำกัด โดยกรอกข้อมูลลงทะเบียนผ่านระบบลงทะเบียนเท่านั้น เต็มแล้วปิดทันที ลงทะเบียนได้ถึงวันศุกร์ที่ 10 มิย 2554 นี้ ก่อน 17:00น.

http://bit.ly/TechnoTagsRegis01

(**ขอความร่วมมือทุกท่านลงทะเบียนแล้วขอให้มาร่วมงานได้ เพื่อไม่เป็นการกันสิทธิ์ผู้อื่น**)

Agenda:
10:00 – 10:30      การบริหารงานเว็บไซต์ และ hosting server ด้วย WebistePanel ที่เป็น OpenSource ภายใต้ BSD License
10:30 – 11:30      HTML5 ตอนที่ 1 The First Look ทำเว็บให้พร้อมสำหรับ HTML5 (อ.สุพจน์ พันธ์สกุล Microsoft MVP ASP.NET)
11:30 – 12:30      From Zero to Hero พัฒนา App บน Windows Phone (คุณจิรวัตน์ ผดุงกิจจานนท์ Microsoft MVP Windows Phone)
12:30 – 13:30      พักกลางวัน
13:30 – 14:30      HTML5 ตอนที่ 2 HTML5 In Action (สงวน ธรรมโรจน์สกุล)
14:30 – 15:30      How it works – อยากทำเว็บให้เชื่อมต่อกับ Facebook และ Twitter  (สุวิชชา จันทร Microsoft MVP)

การใช้งาน JavaScript Form Validations

ข้อมูลอื่น ๆ เพิ่มเติม และ Download JavaScript Form Validations ได้ที่ http://www.javascript-coder.com/html-form/javascript-form-validation.phtml

1. ทำการแทรก

[CODE] [/CODE]

ไว้ก่อนหน้า </head>

2. สร้าง form โดยมีการตั้งชื่อ form ด้วย เช่น

[CODE]


[/CODE]

3. แทรกคำสั่งด้านล่างต่อไปนี้

[CODE] [/CODE]

โดยที่ myform คือชื่อของ form นั้นๆ

4. คำสั่งสำหรับตรวจสอบ form input ต่าง ๆ ใช้คำสั่งนี้

[CODE] [/CODE]

โดยที่

nameforminput คือชื่อของ form input ของเรา
validation คือคำสั่งที่ต้องการตรวจสอบ ซึ่งจะมีดังต่อไปนี้

  1. required หรือ req เป็นการตั้งให้ใส่ form input นี้เสมอ
  2. maxlen=??? หรือ maxlength=??? เป็นการตรวจสอบค่าที่ใส่ลงไปว่ามีจำนวนตัวอักษรได้ไม่เกินค่าที่กำหนด เช่น ไม่เกิน 25 ตัวอักษรก็ใช้คำสั่ง "maxlen=25"
  3. minlen=??? หรือ minlength=??? เป็นการตรวจสอบค่าที่ใส่ลงไปว่ามีจำนวนตัวอักษรได้ไม่ต่ำกว่าค่าที่กำหนด เช่น ไม่เกิน 25 ตัวอักษรก็ใช้คำสั่ง "minlen=25"
  4. alphanumeric หรือ alnum เป็นการตรวจสอบค่าที่ใส่ที่ครอบคลุมทั้งตัวเลขและตัวอักษร
  5. num หรือ numeric เป็นการตรวจสอบตัวเลข
  6. alpha หรือ alphabetic เป็นการตรวจสอบตัวอักษร
  7. email เป็นการตรวจสอบความถูกต้องของรูปแบบอีเมล
  8. lt=??? หรือ lessthan=??? เป็นการตรวจสอบค่าของข้อมูลว่าต้องเป็นตัวเลข และมีค่าไม่เกินเท่าไหร่ เช่น ต้องการค่าที่เป็นตัวเลขและไม่เกิน 1000 ก็ใส่ "lt=1000"
  9. gt=??? หรือ greaterthan=??? เป็นการตรวจสอบค่าของข้อมูลว่าต้องเป็นตัวเลข และมีค่ามากกว่าเท่าไหร่ เช่น ต้องการค่าที่เป็นตัวเลขและมากกว่า 1000 ก็ใส่ "gt=1000"
  10. regexp=??? เป็นการสร้าง regular expression ตามรูปแบบอื่น ๆ เช่นต้องการให้ใส่ตัวอักษรได้ไม่เกิน 10 ก็ใช้คำสั่ง "regexp=^[A-Za-z]{1,20}$"
  11. dontselect=?? เป็นการตรวจสอบค่าใน selected input items ว่ามีการเลือกค่าไว้หรือเปล่า โดยกำหนดว่าค่าเริ่มต้นที่ห้ามเลือกคืออะไร เช่น selected input items กำหนดค่าเริ่มต้นไว้ที่ 0 ที่มี label ว่า Select one นั้นหมายความว่าห้ามเลือก label Select one เพราะเป็นค่าเริ่มต้น เราจะกำหนดแบบนี้ "dontselect=0"

textalert ส่วนนี้เป็นใส่คำเตือนมีมีการตรวจสอบค่านั้น ๆ แล้วตรงตามเงื่อนไข จะได้เป็น

[CODE] [/CODE]

ตัวอย่างการใช้งานโดยรวมทั้งหมด

[CODE]

First Name
Last Name
EMail
Phone
Address
Country
 

[/CODE]

เขียน รับ get / post ใน form method ระวังโดน hack หรือเป็นรูโหว่

นี่เป็นปัญหามาก ในเป็นการสร้างนิสัยเสียในการเขียนโปรแกรมในภาษา PHP ในเรื่องการที่คนเขียน นิสัยเสีย หรือติดจากหนังสือบางเล่ม ที่ไม่ค่อยใช้ GET หรือ POST ในการรับค่าจาก form ต่างๆ ใน method ต่างๆ มันยังผลไปสู่การ Hack หรือการเจาะได้ เช่น เมื่อเร็วๆ นี้ ทำ script PHP สำหรับการ vote freshy boys/girls ที่ ม. ที่ผมเรียนอยู่ ผมหล่ะปวดกับการหล่ะหลวม ของตัวผมเองในการเขียน script ระบบ vote อย่างแรง ตัว form คือ
[HTML]





[/HTML]
ตัวอย่างด้านล่าง มีช่องโหว่ครับ เพราะว่าในระบบ จะรับ แค่ poll_id เท่านั้นส่วน vote_for และ action ไม่ได้ทำการกรอง อ่าน POST หรือ GET แต่ประการใด จากด้านล่าง
[PHP]
$poll_id = $_POST[“poll_id”];
require (“poll/poll_cookie.php”);
include(“poll/booth_inc.php”);
[/PHP]
ทำให้เกิด !!!!
[CODE]


<body> </body>
[/CODE]
เห็นไหมคืออะไร เค้ายิงผ่าน GET Method แทนครับ อ่านหมด 3 ตัวแปรเลย เพราะอะไร ? อย่างแรกครับ $poll_id = $_POST[“poll_id”]; ไม่พอต่อการดัก method จาก GET แต่อย่างใด เพราะว่ายังไง ตัวแปรใน poll_id ที่อยู่ใน form มันก็ยังมาใส่ใน $poll_id ได้จาก GET Method ที่ไม่ได้ lock ซึ่งเช่นเดียวกับ vote_for เช่นกัน ที่มันก็ไปใส่ใน $vote_for ใน script ด้วยเช่นกัน ทำให้เกิดการตั้งเวลาการ vote ได้โดยที่คน vote ไม่ต้องอยู่ที่เครื่อง แค่เปิด browser page นี้ไว้ เท่านั้นเอง แถมถ้าเปิดไว้สัก 100 เครื่องนี่มหาศาลมากทีเดียว ผมเลยต้องกลับลำ และแ้ก้ระบบ script ใหม่หมดอีกครั้งโดยดัก 2 ตัวพอ เพราะว่า action อันนี้ไม่ค่อยสำคัญเท่า vote_for กับ poll_id ที่เป็นตัวจักรสำคัญ แก้คือ ดักทั้ง GET และ POST เราต้องการให้ Method ไหนเข้ามาก็ให้มันผ่านไปเท่าที่เราต้องการเท่านั้น
[PHP]
if(empty($_POST[“poll_id”])) {
$poll_id = $_GET[“poll_id”];
}
else {
$poll_id = $_POST[“poll_id”];
}
if(!empty($_GET[“vote_for”]) or !empty($vote_for)) {
header(“Location: index.php”);
exit;
}
else {
$vote_for = $_POST[“vote_for”];
}
require (“poll/poll_cookie.php”);
include(“poll/booth_inc.php”);
[/PHP]

ผมเลยดักด้วยการรับค่า poll_id จากทั้ง GET และ POST Method ทั้งหมดด้วยการดักไว้ก่อน ตามด้วย Condition ตรวจสอบ ว่าต้องไม่มีการใส่ vote_for ใน GET Method หรือ มีการลักลอบใส่ผ่าน $vote_for มาแต่อย่างใดถ้ามีก็เด้งไป index.php ทันที แต่ถ้าไม่มีก็รับค่าจาก POST มาเลย แล้วทำการ run ตัว script ต่อไปครับ นี่เป็นสิ่งที่รูโหว่ของคนที่ไม่ชอบใช้ POST / GET Method ใน PHP ครับ หรือตั้งชื่อตัวแปรที่มารับ POST / GET Method ที่เหมือนกัน ทางแก้คือ

  1. ใช้ GET / POST Method เสมอๆ ในการรับค่าผ่าน form ต่าง script กัน
  2. ตั้งตัวแปรใน script ที่แตกต่างจาก GET /POST Method เข้าไว้ครับ
  3. ถ้าจำเป็นต้องตั้ง ก็ต้องมี function ในการเช็คตัวแปรที่ส่งผ่านเข้าออก script ให้มากครับ
  4. ใช้ function / class มาแก้ปัญหานี้ครับ ช่วยได้มาก สำหรับคนที่มีเวลาเขียนโปรแกรม หรือ optimize / debug เยอะๆ ครับ (อันนี้เร่งๆ พอสมควรครับ) อันนี้เป็นสิ่งเตือนในการเขียน script ที่เป็น public ได้มากเลยหล่ะครับ

ซึ่งปัญหานี้เกิดจากการใช้ register_global ใน php ที่ตั้ง enable ไว้นั้นเอง ถ้าปิดไปการใช้ตัวแปรภายใน php script ปลอดภัยมากขึ้น

MSN Mail คิดช้าไปหรือเปล่าเนี่ย

จริงๆ มันก็น่าจะมาตั้งนานแล้ว ต้องรอให้ Gmail ใช้มาร่วมปีกว่า คิดช้าไป หรือว่า CPU ของคนทำงาน MSN มันประมวลผลช้าหว่า …… -_-”

แต่เรื่องที่ Gmail ทำงานได้เร็วเพราะ AJAX หรือ Asynchronous JavaScript and XML นั้นเอง ซึ่งมันทำงานโดยใช้

# HTML/XHTML/CSS เพื่อแสดงผล
# Document Object Model ทำการส่งค่า html และทำงานโดยผ่าน JavaScript เพื่อทำการแสดงผลแบบ dynamic ให้กับ HTML/XHTML/CSS มากขึ้น
# XMLHttpRequest เพื่อทำการส่งข้อมูลเข้า และออก web server เพื่อประมวลผล

Web browser ที่สนับสนุนคือ

– Apple Safari 1.2 ขึ้นไป
– Konqueror ทุกรุ่น
– Microsoft Internet Explorer (and derived browsers) 4.0 ขึ้นไป
– Mozilla Firefox (and derived browsers) 1.0 ขึ้นไป
– Netscape 7.1 ขึ้นไป
– Opera 7.6 ขึ้นไป
– ฯลฯ ในอนาคต

ซึ่งจริงๆ แล้วเป็น Technology ที่ใช้ใน Outlook Web Access อยู่แล้ว ซึ่งทำงานผ่าน Microsoft Exchange Server โดยทำงานบน Microsoft Internet Explorer 4.0 ต่อมาในปี 2005 นั้น Google ก็เอามาใช้ใน Google Groups, Google Maps, Google Suggest และ Gmail

ดูเพิ่มเติมที่ http://en.wikipedia.org/wiki/AJAX

ซึ่งการมาครั้งนี้น่าสนใจดี แต่คงไม่ต่างกับ Gmail เท่าไหร่นัก แต่น่าสนใจคือ .Net รุ่นใหม่ และงานด้าน Web Application น่าจะมีการปรับโฉมการทำงานใหม่ไปในทางนี้มากขึ้นแน่นอนทีเดียวเลย

ไม่ใช่อะไรหรอก เพราะว่ามันทำงานได้เร็วมากเลยหล่ะ ถ้าใครได้ลองใช้งาน Gmail จะรู้ว่าเร็วแค่ไหนในการทำงาน