Computer & Services > Technical & Tutorial

สร้าง LIVE CHAT บนเว็บง่ายๆผ่าน MSN

(1/1)

Nick:
สิ่งที่ผมรอคอย หรืออยากทำมานานแล้วในที่สุด Microsoft ก็เห็นใจประทานตัวนี้มาให้นะครับ อาจจะเก่าสำหรับหลายๆคนแต่สำหรับผมมันใหม่มากๆ
มาเริ่มกันเลยครับ

1. มันคืออะไร
ตอบ. มันคือหน้าต่าง MSN บนเว็บ

2. มีประโยชน์ยังไง
ตอบ. ทำให้คนที่ต้องการติดต่อคุณ ไม่ต้องลง MSN หรือ WLM ก็สามารถติดต่อคุณได้เพียงแค่มี Browser

เข้าสู่ขั้นตอนการทำง่ายมากครับ เข้าไปที่ Link ด้านล่างนี้เพื่อเปิดใช้

http://settings.messenger.live.com/applications/websettings.aspx

เมื่อเข้าไปแล้วมันจะถามเราว่าต้องการ Sign in อันไหน (อันที่เราจะใช้รับข้อความจาก web) ให้เราใส่ E-mail ที่ต้องการ และ Password เมื่อเสร็จระบบจะเข้ามาหน้า



เมื่อเจอหน้าจอนี้ให้ ติ๊กถูกที่วงกลม แล้วกด บันทึก หรือ Save

แล้วก็กดเมนู สร้าง HTML ด้านซ้ายมือ จะพบกับหน้าจอนี้





มาถึงหน้าจอนี้เราก็เลือกเลยครับ จะเอาหน้าจอขนาดไหน สีอะไร กว้างเท่าไหร่
เมื่อกดเลือกเสร็จ Code ด้านล่างจะเปลี่ยนไปตามที่เราเลือก ให้เอา code นั้นมาแทรกในเว็บครับ
ก็จะได้หน้าต่างติดต่อ เข้าหา MSN เราแล้ว

เวลามีคนจะคุยกับเราเค้าก็จะกด แล้วจะเจอหน้าต่าง เมื่อกรอกชื่อแล้ว พอเค้าพิมพ์ข้อความ ข้อความจะมาปรากฏใน MSN ของเราเป็นหน้าต่างใหม่พร้อมคุยได้ทันที

ตัวอย่าง

http://www.nickcs.com/contact.php

เราอาจทำ icon status (on/off) ไว้ ทำได้จาก หน้านี้เหมือนกัน เพื่อแจ้งว่าเรา online ค่อยคลิ๊กเข้ามาคุยกับเรา
ตรงนี้ผมทำให้ icon แสดง status ใหม่เป็นแบบของเราเองโดยแกะ Code นิดหน่อยของ Microsoft

การทำ Icon Status ให้ เลือก แบบที่ 2 (ปุ่ม) ในหน้าสร้าง HTML มันจะเป็น Code Javascript
ในนั้นมันจะมี text บอก status และอื่นๆอยู่ ก็ให้จับโดย fsockopen (สำหรับ php) แล้วดึงเฉพาะส่วนที่ต้องการมาใช้

CODE นี้เป็นอันที่ผมทำใช้งานเองนะครับผม อาจจะดูถึกๆ ไปบ้างนะครับ ผมไม่ได้เก่งนะครับ


--- Code: ---<?php
error_reporting(0);
$fp = fsockopen("messenger.services.live.com", 80, $errno, $errstr, 30);
if (!$fp) {
echo "$errstr ($errno)<br />\n";
} else {
$out = "GET /users/b2db9cff94cef1f5@apps.messenger.live.com/presence?mkt=th-TH&cb=Microsoft_Live_Messenger_PresenceButton_onPresence HTTP/1.0\r\n";
$out .= "Host: www.thaisurehost.com\r\n";
$out .= "Connection: Close\r\n\r\n";

fwrite($fp, $out);
while (!feof($fp)) {
$x .= fgets($fp, 128);
}//end while
fclose($fp);
}//end fsock

$x1 = explode("displayName",$x);
//echo $x1[0];
$x2 = explode('"status"',$x1[0]);
//echo $x2[1];
$x3 = explode('"',$x2[1]);
//echo $x3[1];
$msnstatus = $x3[1];
unset($x1);unset($x2);unset($x4);

/*
สถานะที่มี (มีมากกว่านี้)
Online
Busy
BeRightBack
BeRightBack
Offline
*/
echo '<table width="90%" align="center" border="0">';
if($msnstatus != "Offline"){
echo '<tr><td>';
echo '<a href="#" onClick="window.open(\'http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=b2db9cff94cef1f5@apps.messenger.live.com&mkt=th-TH&useTheme=true&foreColor=333333&backColor=DCF2E5&linkColor=333333&borderColor=8ED4AB&buttonForeColor=2C0034&buttonBackColor=CFE9D9&buttonBorderColor=8ED4AB&buttonDisabledColor=CFE9D9&headerForeColor=006629&headerBackColor=92D6AE&menuForeColor=006629&menuBackColor=FFFFFF&chatForeColor=333333&chatBackColor=F4FBF7&chatDisabledColor=F6F6F6&chatErrorColor=760502&chatLabelColor=6E6C6C\',\'mywindow\',\'width=500,height=420,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no\')">';
echo '<img src="http://www.thaisurehost.com/images/msn-on.jpg" border="0">';
echo '</a>';
echo '</td><td>';
echo '<span class=red>ตอนนี้ทีมงาน ONLINE อยู่ ท่านสามารถคุยกับเจ้าหน้าที่เพื่อสอบถามปัญหาการใช้งาน หรือสอบถามข้อมูลอื่นๆได้ทันที เพียงแค่คลิ๊ก</span>';
echo '<td></tr>';
}else{
echo '<tr><td>';
echo '<img src="http://www.thaisurehost.com/images/msn-off.jpg">';
echo '</td><td>';
echo 'ตอนนี้ทีมงานไม่ได้ ONLINE หากต้องการติดต่อสอบถาม สามารถติดต่อได้ที่เบอร์โทรศัพท์ 080-2424544 หรือ ทาง E-mail';
echo '</td></tr>';
}
?>

--- End code ---

ขอให้ใช้อันนี้ในทางที่ถูกต้องและเป็นประโยชน์นะครับ

ที่มา: bobby @ gumairu.com

Navigation

[0] Message Index