php・mysql・javascriptを使ったチャットシステムの作り方を載せてみました。
名前と文章を入力して送信ボタンを押してください。
| 名前 | 投稿日時 | 文章 |
|---|---|---|
| あああ❗ | 2019-11-20 22:28:18 | っっq |
| あああ❗ | 2019-11-20 22:27:53 | えええええ |
| あああ | 2019-11-19 23:55:40 | ああああああああああああああああああああ |
| てすと | 2019-11-19 17:17:22 | てーすと |
| zz | 2019-11-19 12:11:31 | zzzzz |
| sｗ | 2019-11-18 17:08:07 | ｓｗｓｗ |
| aa | 2019-11-18 16:05:02 | aa |
| aaaa | 2019-11-18 12:59:25 | sdasgasfas |
| いいい | 2019-11-17 16:00:16 | ２ |
| あああ | 2019-11-17 16:00:08 | １ |
| aaaa | 2019-11-17 11:50:52 | ajkasdnhaiowe |
| aaaa | 2019-11-17 11:50:05 | dadafgb |
| あや | 2019-11-16 12:44:50 | う |
| aaaa | 2019-11-15 14:46:23 | fdjsjshfjshf |
| aaaa | 2019-11-15 14:46:15 | hfjdjfkdjf |
| テスト | 2019-11-15 14:04:58 | いいい |
| テスト | 2019-11-15 14:04:51 | あああ |
| テスト | 2019-11-15 14:03:59 | テスト |
| てｓつ | 2019-11-15 13:14:57 | テスト― |
| あさあ | 2019-11-15 06:34:33 | いいお天気 |
| キム | 2019-11-14 14:49:33 | いえい |
| バナナ | 2019-11-14 13:59:43 | 100 |
| 12 | 2019-11-13 10:13:42 | dfsgjh |
| もももも | 2019-11-12 15:27:07 | とお７６ｒ８ｋ８いｂｙぢぃううｖｄｙｇｔｄｒといｙづ |
| a | 2019-11-11 12:17:16 | a |
| a | 2019-11-10 20:26:30 | aa |
| a | 2019-11-09 09:05:04 | a |
| a | 2019-11-09 09:05:01 | a |
| a | 2019-11-09 09:04:56 | a |
| とろ | 2019-11-07 19:39:18 | 000 |
| ぽち | 2019-11-07 17:07:07 | 餌箱が壊れました |
| ｄ | 2019-11-07 17:03:45 | っっｄ |
| まーくん | 2019-11-07 13:56:14 | 総書記 |
| ｆｄｖ | 2019-11-06 12:29:50 | ｄｆｇ |
| い | 2019-11-06 04:53:07 | てすと |
| あ | 2019-11-05 21:53:20 | あ |
| あ | 2019-11-05 18:20:03 | てst |
| あ | 2019-11-04 23:45:05 | <br> |
| あ | 2019-11-04 23:44:52 | \n |
| あ | 2019-11-04 23:44:19 | あ |
| a | 2019-11-04 12:33:45 | as |
| は | 2019-11-04 09:12:09 | ふじこlp |
| あああ | 2019-11-04 01:34:40 | あｑｗせｄｒｆｔｇｙふじこｌｐ；＠：「」 |
| なめ | 2019-11-03 22:33:29 | なめたけ |
| テスト | 2019-11-02 12:37:53 | テスト |
| aa | 2019-11-01 15:13:31 | awedasa |
| ああ | 2019-10-31 18:28:47 | ああああああ |
| dっっx | 2019-10-31 16:11:26 | っっg |
| まーくん | 2019-10-31 15:45:47 | あう |
| てすと | 2019-10-30 18:44:37 | てすと |
| てすと | 2019-10-30 18:44:20 | てすと |
| KKK | 2019-10-30 18:11:25 | 名前変更できないの? |
| KKK | 2019-10-30 18:09:12 | JJJ |
| あ | 2019-10-30 16:09:23 | あ |
| 小林 | 2019-10-29 21:14:07 | 貴方こんばんは |
| 小林 | 2019-10-29 19:56:32 | 皆さんこんにちは |
| 保護 | 2019-10-29 15:26:26 | 久保田 |
| てすと | 2019-10-29 13:06:46 | あああ |
| test | 2019-10-28 16:38:34 | aaaa |
| test | 2019-10-28 16:35:01 | aaaa |
| lll | 2019-10-28 16:03:30 | hhhhh |
| lll | 2019-10-28 16:03:14 | hhhhh |
| lll | 2019-10-28 16:01:55 | hhhhh |
| あああ | 2019-10-28 12:47:55 | て |
| バナージ | 2019-10-27 20:52:05 | ああああああああああああああああああああ |
| えｗ | 2019-10-26 17:32:21 | (株)日本製鉄 |
| えｗ | 2019-10-26 17:31:50 | 井上結城 |
| えｗ | 2019-10-26 17:31:31 | 東京都江戸川区上川６－８－３８ |
| えｗ | 2019-10-26 17:30:14 | ww |
| えｗ | 2019-10-26 17:11:08 | ゆｌｋ |
| 2019-10-25 09:12:48 | hhh | |
| das | 2019-10-25 00:34:53 | hi |
| a | 2019-10-24 16:07:18 | ああああ |
| sad | 2019-10-23 17:54:48 | <hr> |
| sad | 2019-10-23 17:54:44 | asd |
| sad | 2019-10-23 17:54:36 | asd |
| sad | 2019-10-23 17:54:24 | asd |
| あいうえ | 2019-10-23 14:23:27 | あかさたな |
| ｗｗｗ | 2019-10-22 15:00:20 | test |
| abc | 2019-10-20 18:43:09 | ;:+* |
| abc | 2019-10-20 18:38:03 | ""'&%ああ |
| abc | 2019-10-20 18:36:50 | ??#$|@\テスト |
| juju | 2019-10-18 15:59:21 | おーやー |
| juju | 2019-10-18 15:59:02 | test |
| juju | 2019-10-18 13:40:07 | test |
| ktgi | 2019-10-17 15:46:38 | aiueo |
| foo | 2019-10-16 15:06:30 | foo<br/>bar |
| test | 2019-10-16 14:49:21 | テストドキュメント |
| azsx | 2019-10-16 09:40:36 | あいうえお |
| azsx | 2019-10-16 09:40:13 | あいうえお |
| くぁｚｚ | 2019-10-16 09:39:47 | くぁくぁくぁくぁ |
| iiii | 2019-10-16 02:51:52 | dasda |
| aa | 2019-10-15 13:32:29 | aa |
| ｇｈｆ | 2019-10-15 13:15:07 | ｆｇｈｆ |
| ああああ | 2019-10-15 11:51:38 | ああｓｓｗｗ |
| ああああ | 2019-10-15 10:31:02 | ｑｑｑ |
| シウバ | 2019-10-14 23:44:00 | ああああああ |
| シウバ | 2019-10-14 23:43:11 | あああああ |
| っっy | 2019-10-14 16:11:22 | ううう |
| あああ | 2019-10-14 11:09:10 | ううううう |
CREATE TABLE `chat` ( `chid` int(10) unsigned auto_increment, `name` varchar(255), `text` text, `date` datetime, PRIMARY KEY (`chid`) ) AUTO_INCREMENT=1000000001
<? if(!isset($_SESSION)) session_start(); $msg = "<p>名前と文章を入力して送信ボタンを押してください。</p>"; $name = isset($_SESSION["name"]) ? $_SESSION["name"] : "" ; $name = isset($_POST["name"]) ? $_POST["name"] : $name ; $text = isset($_POST["text"]) ? $_POST["text"] : "" ; if($action){ if(!$name) $err[] = "名前 を入力してください"; if(mb_strlen($name)>4) $err[] = "名前 は4文字以内で入力してください"; if(!$text) $err[] = "文章 を入力してください"; if(mb_strlen($text)>50) $err[] = "文章 は50文字以内で入力してください"; if(!count($err)){ // セッションに名前を登録 $_SESSION["name"] = $name; mysql_query("insert into chat set date = now(), name = '".addslashes($name)."', text = '".addslashes($text)."'"); }else{ $msg = showerr($err); } } // チャット内容の取得 $_chat = array(); $rst = mysql_query("select * from chat order by date desc limit 100"); while($col=mysql_fetch_assoc($rst)) $_chat[$col["chid"]] = $col; mysql_free_result($rst); // 直近のIDをセッションに登録 $_SESSION["max_chid"] = count($_chat) ? max(array_keys($_chat)) : 0 ; ?>
<?=$msg?> <form action="/php/chat.html" method="post"> <table summary="送信フォーム"> <tr><th>名前</th><td><?if($name){?><?=$name?><?}else{?><input type="text" name="name" style="width:100%" /><?}?></td></tr> <tr><th>文章</th><td><input type="text" name="text" style="width:100%" /></td></tr> </table> <p><input type="submit" value="送信" class="button" /></p> <input type="hidden" name="action" value="1" /> </form> <table summary="チャット"> <tr><th style="width:100px">名前</th><th style="width:180px">投稿日時</th><th>文章</th></tr> <tbody id="board"> <?foreach($_chat as $val){?> <tr><td><?=htmlspecialchars($val["name"])?></td><td><?=$val["date"]?></td><td><?=htmlspecialchars($val["text"])?></td></tr> <?}?> </tbody> </table>
<script type="text/javascript"> // 名前か文章にカーソルをフォーカス if(document.getElementsByName("text")[0]) document.getElementsByName("text")[0].focus(); if(document.getElementsByName("name")[0]) document.getElementsByName("name")[0].focus(); function createXMLHttpRequest(){ var xmlHttpObject = null; if(window.XMLHttpRequest){ xmlHttpObject = new XMLHttpRequest(); }else if(window.ActiveXObject){ try{ xmlHttpObject = new ActiveXObject("Msxml2.XMLHTTP"); }catch(e){ try{ xmlHttpObject = new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ return null; } } } if(xmlHttpObject) xmlHttpObject.onreadystatechange = displayHtml; return xmlHttpObject; } function loadchatdata(){ httpObj = createXMLHttpRequest(); if(httpObj){ httpObj.open("GET","/loadchatdata.php",true); httpObj.send(null); } } function displayHtml(){ if((httpObj.readyState == 4) && (httpObj.status == 200) && httpObj.responseText){ document.getElementById("board").innerHTML = httpObj.responseText + document.getElementById("board").innerHTML; } } // 2秒ごとにチャットの内容を取りに行く setInterval('loadchatdata()',2000); </script>
<? if(!isset($_SESSION)) session_start(); // キャッシュを取らないように header("Expires: Thu, 01 Dec 1994 16:00:00 GMT"); header("Last-Modified: ".gmdate("D, d M Y H:i:s")." GMT"); header("Cache-Control: no-cache, must-revalidate"); header("Cache-Control: post-check=0, pre-check=0",false); header("Pragma: no-cache"); header("Content-type: text/html; charset=utf-8"); $max_chid = isset($_SESSION["max_chid"]) ? $_SESSION["max_chid"] : 0 ; // チャットの内容の取得 $_chat = array(); $rst = mysql_query("select * from chat where chid > {$max_chid} order by date desc limit 10"); while($col=mysql_fetch_assoc($rst)) $_chat[$col["chid"]] = $col; mysql_free_result($rst); // 直近のID $_SESSION["max_chid"] = count($_chat) ? max(array_keys($_chat)) : $max_chid ; // チャットデータの書き出し foreach($_chat as $val){?> <tr><td><?=htmlspecialchars($val["name"])?></td><td><?=$val["date"]?></td><td><?=htmlspecialchars($val["text"])?></td></tr> <?}?>
Copyright(C) systemexpress.co.jp All Rights Reserved. Author Takayuki Yukawa check for html