ขอความกรุณาด้วยครับ สอบถามเรื่อง ajax login ครับ
จากบทความ www.goragod.com/knowledge-%E0%B8%9A%E0%B8%97%E0%B8%97%E0%B8%B5%E0%B9%88%207%20%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%97%E0%B8%B3%20Login%20%E0%B8%94%E0%B9%89%E0%B8%A7%E0%B8%A2%20AJAX.html
ซึ่งคุณ gOragod ได้เขียนไว้ เกี่ยวกับ การทำ Login ด้วย AJAX
ผมได้ลองทำดู ปรากฏว่าใช้งานได้ผลดีมากเลยครับ
ผมได้ลองทำตามคำแนะนำในบทความ เกี่ยวกับการใช้ cookie มาช่วยในการจำค่า login
ซึ่งผมติดขัดอยู่ตรงที่ ถ้าหาก อยากให้ user สามารถติ๊กเลือกได้เอง ว่าจะให้ login ถาวรหรือไม่
จะมีวิธีการเพิ่มเติม code ลงไปอย่างไรครับ ผมได้ทดลองดูหลายครั้ง แต่ไม่สำเร็จ
จึงขอความกุณาชี้แนะด้วยนะครับ
ขอบคุณครับ
ซึ่งคุณ gOragod ได้เขียนไว้ เกี่ยวกับ การทำ Login ด้วย AJAX
ผมได้ลองทำดู ปรากฏว่าใช้งานได้ผลดีมากเลยครับ
ผมได้ลองทำตามคำแนะนำในบทความ เกี่ยวกับการใช้ cookie มาช่วยในการจำค่า login
ซึ่งผมติดขัดอยู่ตรงที่ ถ้าหาก อยากให้ user สามารถติ๊กเลือกได้เอง ว่าจะให้ login ถาวรหรือไม่
จะมีวิธีการเพิ่มเติม code ลงไปอย่างไรครับ ผมได้ทดลองดูหลายครั้ง แต่ไม่สำเร็จ
จึงขอความกุณาชี้แนะด้วยนะครับ
ขอบคุณครับ
แล้วก็เพิ่มเติมตอนส่ง request req.send() ให้รวมค่า input ที่เพิ่มใหม่เข้าไปด้วย
แล้วก็ไปแก้ไขหน้าที่รับค่าจาก ajax ให้รับ input ใหม่นี้ด้วย หลังจากนั้นก็รับค่าไปจัดการต่อตามที่ต้องการ
แนวคิดจริงๆ ให้ทำความเข้าใจว่า มันก็คือ ฟอร์ม ธรรมดา และ การรับค่า ก็เหมือนกับการรับค่าจาก ฟอร์ม ทั่วๆไป
ต่างกันแค่ตอน submit ที่ใช้ Javascript ในการส่งเท่านั้นครับ
ขอความกรุณา ช่วยดู code ให้ผมด้วยนะครับ
ไม่ทราบว่ามีผิดพลาดตรงจุดไหนบ้าง ขอขอบคุณครับ
ไฟล์ checkuser.php ในส่วนสีแดง คือที่ผมเพิ่มลงไปครับ
<?
//สำหรับเมื่อใช้ภาษาไทย
header("content-type: application/x-javascript; charset=tis-620");
//ค่าที่รับมา
$user=$_POST["user"];
$passwd=$_POST["passwd"];
$action=$_POST["action"];
$fr=$_POST["fr"];
if (isset($action) && $action=='logout') { //ออกจากระบบชั่วคราว
setcookie("user", "");
setcookie("passwd", "");
unset($user);
$message="<font color=green size=1>ออกจากระบบเรียบร้อย</font><br><font color=#666666 size=1>กรุณากลับมาเยือนเราอีกครั้ง</font>";
} else { //ตรวจสอบชื่อกับฐานข้อมูล
//ค่ากำหนดของ ฐานข้อมูล
$host="localhost";
$username="root";
$password="";
$dbname="mydb";
$tablename="tbuser";
#เรียกข้อมูล - Member -
$db = mysql_connect($host,$username,$password) or die ("ไม่สามารถติดต่อกับฐานข้อมูลได้ในขณะนี้");
$sql = "select * from $tablename where user = '$user' AND passwd = '$passwd'";
$query = mysql_db_query($dbname,$sql) or die ("ไม่สามารถเรียกฐานข้อมูลสมาชิกได้ในขณะนี้");
$fetch = mysql_fetch_array($query);
$num = mysql_num_rows($query);
mysql_close($db);
if ($num != 0) { //ชื่อ และ รหัสผ่านถูกต้อง
//login สำเร็จ
if($fr == "ok") {
setcookie("user", $user, time() + 3600 * 24 * 365);
setcookie("passwd", $passwd, time() + 3600 * 24 * 365);
}
} else if (empty($action)) { //ครั้งแรก ไม่ได้ใส่ action มา
$message="<font color=#666666 size=1>ยินดีต้อนรับ สู่เว็บไซต์<br><font color=green>g-O-r-a-g-o-d.com</font></font>";
unset($user);
} else {
//ชื่อหรือ รหัสผ่านไม่ถูกต้อง
$message="<font color=red size=1>ชื่อ หรือ รหัสผ่าน ไม่ถูกต้อง</font>";
unset($user);
}
}
echo "<table cellspacing=5 cellpadding=0 width=100%>\n";
if (isset($user)) {
echo "<tr><td align=center><font color=#666666 size=1>ยินดีต้อนรับ คุณ <font color=green>$user</font> เข้าระบบ</font></td></tr>\n";
echo "<tr><td align=center><input type=button value=ออกจากระบบ class=red title=\"ออกจากระบบ ชั่วคราว\" onclick=\"check_user('', '', 'logout')\"></td></tr>\n";
} else {
if (isset($message)) echo "<tr><td align=center colspan=2>$message</td></tr>\n";
else echo "<tr><td align=center colspan=2><font size=1><font color=green>ผู้มาเยือน</font> กรุณาเข้าระบบ</font></font></td></tr>\n";
echo "<tr><td align=right><font color=#555555 size=1>user : </font></td><td><input size=15 type=text name=user maxlength=15></td></tr>\n";
echo "<tr><td align=right><font color=#555555 size=1>passwd : </font></td><td><input size=15 type=password name=passwd maxlength=15></td></tr>\n";
echo "<tr><td align=right>login ถาวร </td><td><input name=fr type=checkbox id=fr value=ok></td></tr>\n";
echo "<tr><td align=right></td><td><input type=button value=Login onclick=\"check_user(login_form.user.value, login_form.passwd.value, 'login')\"></td></tr>\n";
}
echo "</table>\n";
?>
ไฟล์ nlogin.php ในส่วนสีแดง คือที่ผมเพิ่มลงไปครับ
<html>
<title>g-O-r-a-g-o-d.com [AJAX บทที่ 3]</title>
<head>
<style>
body {
font-family: Tahoma, MS Sans Serif;
font-size: 8pt;
}
</style>
</head>
<body>
<font color=red>คลิกขวา View Source เพื่อดูซอร์สโค้ด</font>
<br>
<form name=login_form>
<table border=0 width=200 cellspacing=0 cellpadding=2>
<tr><td bgcolor=#D3E4F5 align=center>
<table bgcolor=#EEEEEE cellspacing=0 cellpadding=1 width=100%>
<tr><td id=login_table align=center>Loading...</td></tr>
</table>
</td></tr>
</table>
</form>
<pre>
ลองใส่ user : <font color="red">admin</font>
password : <font color="red">admin</font>
หรือ อื่นๆ
</pre>
</body>
</html>
<script language=Javascript>
function Inint_AJAX() {
try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} //IE
try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE
try { return new XMLHttpRequest(); } catch(e) {} //Native Javascript
alert("XMLHttpRequest not supported");
return null;
};
function check_user(username, passwd, fr, action) {
var cancle=false;
if (action=='login') {
if (username.length==0) {
alert('กรุณาป้อน Username ก่อน');
document.login_form.user.focus();
cancle=true;
} else if (passwd.length==0) {
alert('กรุณาป้อน Password ก่อน') ;
document.login_form.passwd.focus();
cancle=true;
}
}
if (cancle==false) {
var req = Inint_AJAX();
req.onreadystatechange = function () {
if (req.readyState==4) {
if (req.status==200) {
var ret=req.responseText; //รับค่ากลับมา
document.getElementById("login_table").innerHTML=ret;
}
}
};
req.open("POST", "checkuser.php"); //สร้าง connection
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=tis-620"); // set Header
req.send("user="+username+"&passwd="+passwd+"&fr="+fr+"&action="+action); //ส่งค่า
}
}
//โหลดครั้งแรก
check_user('<?=$_COOKIE[user]?>', '<?=$_COOKIE[passwd]?>', '');
</script>
ลองมองหาให้ทั่วๆ นะครับ
มันก็จำค่า login อ่ะครับ
ไม่ได้ผลสักทีครับ
ถ้าจะมีการใช้ประโยชน์ ก็ต้อง เขียนโค้ดเพื่อใช้ประโยชน์จากมันก่อน เช่น ทำการตรวจสอบว่า มี $fr ส่งมาหรือไม่
ถ้ามี ก็ให้บันทึก cookie ได้ ถ้าไม่มีก็ไม่ต้องบันทึก cookie ครับ
ลองทำดูนะครับ
ผมลองใช้ if ในการสร้างเงื่อนไขว่า ถ้าไม่ได้ติ๊ก เท่ากับว่า $fr ไม่ได้ส่งค่ามา ก็ไม่ค้องสร้าง cookie
แต่ถ้าติ๊ก $fr ก็มีการส่งค่า ก็ให้สร้าง cookie ได้
แต่ผมลอง echo ค่าของ $fr ที่ส่งออกมาดู ปรากฏว่า ไม่ว่าจะติ๊ก หรือไม่ติ๊ก ค่าที่ส่งก็คือ "ok" เสมอ (value ของ checkbox)
ผมคิดว่าปัญหาอาจจะมาจาก การส่งค่าในส่วนของ Javascript ผมอาจจะส่งผิดพลาด แต่ไม่ทราบว่าเป็นที่จุดไหนน่ะครับ
นี่เป็นส่วนที่ผมสร้างเงื่อนไขขึ้นครับ ในหน้า checkuser.php
if($fr == "ok") {
setcookie("user", $user, time() + 3600 * 24 * 365);
setcookie("passwd", $passwd, time() + 3600 * 24 * 365);
}
ในส่วนที่มีการส่งค่า ผมเขียน code ดังนี้ครับ ในหน้า login.php
req.send("user="+username+"&passwd="+passwd+"&fr="+fr+"&action="+action);
โดยหลักการ และแนวคิด ผมเข้าใจครับว่า ควรศึกษาด้วยตนเองเพิ่มเติมจนเกิดความเข้าใจ
แต่ผมแก้ไข ทดลองมานานก็ไม่ได้ผล ผมรู้สึกว่ากำลังอ้อมโลกออกไปไกล
ขอบคุณมากครับสำหรับคำแนะนำ
ทำไมถึงคิดว่าการ พยายามเรียนรู้ด้วยตัวเองเป็นการอ้อมโลกละครับ ?
โดยส่วนตัว ผมใช้วิธีการศึกษาด้วยตัวเองมาตลอด ซึ่งผมจะเน้นเป็นพิเศษในการทดลองทำด้วยตัวเอง ซึ่งผมใช้วิธีนี้ มาตั้งแต่ สมัย มัธยมแล้ว มีเหตุผล 2-3 ข้อในการใช้วิธีนี้
1.คุณอาจได้อะไรมากกว่าที่ต้องการ ผมยกตัวอย่างการหาข้อมูลสักเรื่องนึง คุณอาจได้พบเทคนิคใหม่ๆหรือเรื่องราวใหม่ๆจากสิ่งที่คุณพบเจอ ซึ่ง อาจมีประโยชน์ในอนาคต
2.ฝึกฝนการใช้ภาษา เพราะ ข้อมูลส่วนใหญ่ที่มี อาจเป็น ภาษาอังกฤษ ซึ่งมันไม่ได้ยากเย็นหรอครับเพราะสิ่งที่เรามองหาคือโค้ด ซึ่งเป็นภาษาอังกฤษอยู่แล้ว ซึ่งแน่นอน ถึงเราจะอ่านไม่รู้เรื่องในตอนนี้ แต่หากดูไปเรื่อยๆ ซ้ำๆ มันจะเข้าใจในที่สุดครับ
3.หากได้ทดลองตามที่ได้พบเจอมา จะยิ่งเป็นประโยชน์ เพราะมันหมายถึง ความเข้าใจที่จะเกิดขึ้นหลังการทดลอง ให้จดจำและวิเคราะห์ผลลัพท์ที่ได้จากการทดลองอยู่เสมอ
ซึ่ง 3 ข้อนี้ เป็นสิ่งหลักๆอยู่เสมอที่เราพบเจอในการเขียนโค้ดครับ ทุกคนเป็นกันทั้งนั้น(แน่นอนผมก็เป็น..) เวลาที่มีปัญหา คิดไม่ออก ไม่รู้ว่าจะทำอย่างไร แต่ด้วยวิธีการข้างต้น จะทำให้เราบรรลุจุดประสงค์ที่ต้องการ(ด้วยตัวเอง)ในที่สุด
ขอบคุณมากครับ
ผมจะลองพยายามทำดูจนสำเร็จครับ