PHP+MySQL+jQuery實(shí)現(xiàn)發(fā)布微博程序——PHP篇
在上一篇《PHP+MySQL+jQuery實(shí)現(xiàn)發(fā)布微博程序——jQuery篇》中,講解了如何用jQuery實(shí)現(xiàn)輸入表單的實(shí)時(shí)字?jǐn)?shù)統(tǒng)計(jì)和Ajax提交數(shù)據(jù)到后臺(tái)的功能。本文將重要介紹后臺(tái)是如何處理前臺(tái)提交的數(shù)據(jù),并返回結(jié)果的。
先還是要說明本例的業(yè)務(wù)流程:
1、前端用戶輸入內(nèi)容,并對(duì)輸入的內(nèi)容字?jǐn)?shù)進(jìn)行實(shí)時(shí)統(tǒng)計(jì)。
2、用戶提交數(shù)據(jù),jQuery實(shí)現(xiàn)通過Ajax向后臺(tái)發(fā)送數(shù)據(jù)。
3、后臺(tái)PHP接收提交表單的數(shù)據(jù),并對(duì)數(shù)據(jù)進(jìn)行必要的安全過濾。
4、后臺(tái)PHP連接Mysql數(shù)據(jù)庫(kù),并將提交過來的表單數(shù)據(jù)寫入到相應(yīng)的數(shù)據(jù)表中。
5、后臺(tái)向返回成功結(jié)果數(shù)據(jù)內(nèi)容,并通過Ajax將返回的數(shù)據(jù)內(nèi)容插入到前端頁(yè)面中。
上述1、2步在前篇文章:jQuery篇已講解了,本文將完成剩余的部分。
數(shù)據(jù)表首先我們要準(zhǔn)備一個(gè)數(shù)據(jù)表,表結(jié)構(gòu)如下:
- CREATE TABLE `say` (
- `id` int(11) NOT NULL auto_increment,
- `userid` int(11) NOT NULL default '0',
- `content` varchar(200) NOT NULL,
- `addtime` int(10) NOT NULL,
- PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=utf8;
注意,本例中將時(shí)間字段:addtime的類型設(shè)置為int,是為了后續(xù)的時(shí)間處理方便,在很多應(yīng)用中(如Discuz論壇)都是將時(shí)間類型轉(zhuǎn)成數(shù)字型。
時(shí)間軸處理函數(shù)和格式化輸出列表函數(shù):時(shí)間軸處理函數(shù),就是把時(shí)間轉(zhuǎn)換成我們看到的諸如“5分鐘前”,“昨天 10:21”等形式,詳細(xì)使用可以查看之前我寫過的文章:PHP實(shí)現(xiàn)時(shí)間軸函數(shù),代碼如下:
- /*時(shí)間轉(zhuǎn)換函數(shù)*/
- function tranTime($time) {
- $rtime = date("m-d H:i",$time);
- $htime = date("H:i",$time);
- $timetime = time() - $time;
- if ($time < 60) {
- $str = '剛剛';
- }
- else if ($time < 60 * 60) {
- $min = floor($time/60);
- $str = $min.'分鐘前';
- }
- else if ($time < 60 * 60 * 24) {
- $h = floor($time/(60*60));
- $str = $h.'小時(shí)前 '.$htime;
- }
- else if ($time < 60 * 60 * 24 * 3) {
- $d = floor($time/(60*60*24));
- if($d==1)
- $str = '昨天 '.$rtime;
- else
- $str = '前天 '.$rtime;
- }
- else {
- $str = $rtime;
- }
- return $str;
- }
格式化輸出函數(shù)是將得到的用戶信息和發(fā)布內(nèi)容及時(shí)間按照一定的格式輸出到前端頁(yè)面的函數(shù),代碼如下:
- function formatSay($say,$dt,$uid){
- $say=htmlspecialchars(stripslashes($say));
- return'
- <div class="saylist">
- <a href="#"><img src="images/'.$uid.'.jpg" width="50" height="50" alt="demo" />
- </a>
- <div class="saytxt">
- <p><strong><a href="#">demo_'.$uid.'</a></strong> '.
- preg_replace('/((?:http|https|ftp):\/\/(?:[A-Z0-9][A-Z0-9_-]*(?:\.[A-Z0-9][A-Z0-9_-]*)+): ?(\d+)?\/?[^\s\"\']+)/i',
- '<a href="$1" rel="nofollow" target="blank">$1</a>',$say).'
- </p>
- <div class="date">'.tranTime($dt).'</div>
- </div>
- <div class="clear"></div>
- </div>'
- ; }
將以上兩個(gè)函數(shù)都放入function.php中,準(zhǔn)備隨時(shí)被調(diào)用。
submit.php處理表單數(shù)據(jù)
在上篇文章中,我們知道jQuery將前端獲得的數(shù)據(jù)以POST方式,通過Ajax提交給了后臺(tái)的submit.php。那么submit就是要完成后續(xù)的所有一攤子任務(wù)。請(qǐng)看代碼:
- require_once('connect.php'); //數(shù)據(jù)庫(kù)連接文件
- require_once('function.php'); //函數(shù)調(diào)用文件
- $txt=stripslashes($_POST['saytxt']); //獲取提交的數(shù)據(jù)
- $txt=mysql_real_escape_string(strip_tags($txt),$link); //過濾HTML標(biāo)簽,并轉(zhuǎn)義特殊字符
- if(mb_strlen($txt)<1 || mb_strlen($txt)>140)
- die("0"); //判斷輸入字符數(shù)是否符合要求
- $timetime=time(); //獲取當(dāng)前時(shí)間
- $userid=rand(0,4);
- //插入數(shù)據(jù)到數(shù)據(jù)表中
- $query=mysql_query("insert into say(userid,content,addtime)values('$userid','$txt','$time')");
- if(mysql_affected_rows($link)!=1)
- die("0");
- echo formatSay($txt,$time,$userid); //調(diào)用函數(shù)輸出結(jié)果
注意,本例中為了演示,將用戶ID(userid)進(jìn)行隨機(jī)處理,實(shí)際的應(yīng)用是獲取當(dāng)前用戶的ID。另外數(shù)據(jù)庫(kù)連接文件,大家可以自己寫一個(gè),在我提供的下載的DEMO里也有這個(gè)文件。
***要回到前端頁(yè)面index.php來。index.php主要除了提供輸入的入口,還要承接后臺(tái)處理返回的結(jié)果,并且要將數(shù)據(jù)庫(kù)里已有的數(shù)據(jù)顯示出來。代碼如下:
- <?php
- define('INCLUDE_CHECK',1);
- require_once('connect.php');
- require_once('function.php');
- $query=mysql_query("select * from say order by id desc limit 0,10");
- while ($row=mysql_fetch_array($query)) {
- $sayList.=formatSay($row[content],$row[addtime],$row[userid]);
- }
- ?>
- <form id="myform" action="say.php" method="post">
- <h3><span class="counter">140</span>說說你正在做什么...</h3>
- <textarea name="saytxt" id="saytxt" class="input" tabindex="1" rows="2" cols="40"></textarea>
- <p>
- <input type="submit" class="sub_btn" value="提 交" disabled="disabled" />
- <span id="msg"></span>
- </p>
- </form>
- <div class="clear"></div>
- <div id="saywrap">
- <?php echo $sayList;?>
- </div>
至此,本例從前端交互到后臺(tái)處理程序,全部完成,有興趣的同學(xué)***親自動(dòng)手,才能從中學(xué)到樂趣。
【編輯推薦】