首页 > 代码库 > ajax聊天
ajax聊天
ajax实现聊天功能:
代码:
window.onload = function() { function id(id) { return document.getElementById(id); } //验证用户名 id(‘username1‘).onkeyup = function() { var url = ‘/5-22ajax/guestbook/index.php‘; var data = http://www.mamicode.com/‘m=index&a=verifyUserName&username=‘ + id(‘username1‘).value; ajax(‘get‘, url, data, function(str) { // console.log(str); var js = JSON.parse(str); // console.log(js); id(‘verifyUserNameMsg‘).innerHTML = js.message; if(js.code) { id(‘verifyUserNameMsg‘).style.color = "red"; } else { id(‘verifyUserNameMsg‘).style.color = "green"; } }) } id(‘btnReg‘).onclick = function() { var url = ‘/5-22ajax/guestbook/index.php‘; var data = http://www.mamicode.com/‘m=index&a=reg&username=‘ + id(‘username1‘).value + ‘&password=‘ + id(‘password1‘).value; ajax(‘post‘, url, data, function(str) { // console.log(str); var regStr = JSON.parse(str); console.log(regStr); if(regStr.code) { alert(regStr.message); } else { alert(regStr.message); } }) } id(‘btnLogin‘).onclick = function() { var url = ‘/5-22ajax/guestbook/index.php‘; var data = http://www.mamicode.com/‘m=index&a=login&username=‘ + id(‘username2‘).value + ‘&password=‘ + id(‘password2‘).value; ajax(‘post‘, url, data, function(str) { // console.log(str); var loginStr = JSON.parse(str); // console.log(loginStr); // } alert(loginStr.message); }) } //改变登录状态 //查看cookie值 function getCookie(key) { var arr1 = document.cookie.split(‘;‘); for(var i = 0; i < arr1.length; i++) { var arr2 = arr1[i].split(‘=‘); //=号分割 if(arr2[0] == key) { return arr2[1]; } } } //function getCookie(key){ // return document.cookie; //} // function getUsernameCookie(key) { // var arr2 = document.cookie.split(‘;‘)[1].split(‘=‘)[1]; // return(arr2); // } // var usn = getUsernameCookie(‘username‘); //var usn=‘lannister‘; function updateStatus() { var uid = getCookie(‘uid‘); var reg = document.getElementById(‘reg‘); var login = document.getElementById(‘login‘); var user = document.getElementById(‘user‘); var userInfo = document.getElementById(‘userinfo‘); // if(uid) { // reg.style.display = ‘none‘; // login.style.display = ‘none‘; // user.style.display = ‘block‘; // userInfo.innerHTML = usn; // alert(‘yes‘); // } else { // reg.style.display = ‘block‘; // login.style.display = ‘block‘; // user.style.display = ‘none‘; // alert(‘no‘); // } } updateStatus(); id(‘logout‘).onclick = function() { // alert(‘success‘); var url = ‘/5-22ajax/guestbook/index.php‘; var data = http://www.mamicode.com/‘m=index&a=logout‘; ajax(‘post‘, url, data, function(str) { var arr = JSON.parse(str); alert(arr.message); }) } function createList(str) { // console.log(str); var contentStr = JSON.parse(str); console.log(contentStr); var oDl = document.createElement(‘dl‘); var oDt = document.createElement(‘dd‘); var oStrong = document.createElement(‘strong‘); var oList = document.createElement(‘div‘); oList.id = ‘list‘; oStrong.innerHTML = contentStr.data.username + ‘ 说: ‘; oDt.appendChild(oStrong); var oDd1 = document.createElement(‘dd‘); oDd1.innerHTML = contentStr.data.content; var oDd2 = document.createElement("dd"); oDd2.className = ‘t‘; var a1 = document.createElement(‘a‘); var a2 = document.createElement(‘a‘); a1.innerHTML = ‘点赞(<span>‘ + contentStr.data.support + ‘)</span>‘; a2.innerHTML = ‘反对(<span>‘ + contentStr.data.oppose + ‘)</span>‘; oDd2.appendChild(a1); oDd2.appendChild(a2); oDd1.appendChild(oDd2); oList.appendChild(oDt); oList.appendChild(oDd1); id(‘myList‘).appendChild(oList); } function createAl(str) { var oDl = document.createElement(‘dl‘); var oDt = document.createElement(‘dd‘); var oStrong = document.createElement(‘strong‘); var oList = document.createElement(‘div‘); oList.id = ‘list‘; oStrong.innerHTML = str.username + ‘ 说: ‘; oDt.appendChild(oStrong); var oDd1 = document.createElement(‘dd‘); oDd1.innerHTML = str.content; var oDd2 = document.createElement("dd"); oDd2.className = ‘t‘; var a1 = document.createElement(‘a‘); var a2 = document.createElement(‘a‘); a1.innerHTML = ‘点赞(<span class="like">‘ + str.support + ‘)</span>‘; a2.innerHTML = ‘反对(<span class="against">‘ + str.oppose + ‘)</span>‘; oDd2.appendChild(a1); oDd2.appendChild(a2); oDd1.appendChild(oDd2); oList.appendChild(oDt); oList.appendChild(oDd1); id(‘myList‘).appendChild(oList); } id(‘btnPost‘).onclick = function() { var url = ‘/5-22ajax/guestbook/index.php‘; var data = http://www.mamicode.com/‘m=index&a=send&content=‘ + id(‘content‘).value; // console.log(id(‘content‘).value); ajax(‘post‘, url, data,createList); } //初始化留言列表 function showList() { var url = ‘/5-22ajax/guestbook/index.php‘; var data = http://www.mamicode.com/‘m=index&a=getList&page=1&n=2‘; ajax(‘post‘, url, data, function(str) { var showArr = JSON.parse(str); console.log(showArr); var list = showArr.data.list; // console.log(list[1]); // var list1=list[1]; // createAl(list1); for(var i = 0; i < list.length; i++) { createAl(list[i]); } }) } showList(); function like() { var url = ‘/5-22ajax/guestbook/index.php‘; var data = http://www.mamicode.com/‘m=index&a=doSupport&cid=1‘; id(‘likeFirst‘).onclick = function() { ajax(‘post‘, url, data, function(str) { var arr = JSON.parse(str); // console.log(arr); alert(arr.message); }) } } like(); }
ajax.js:
function ajax(method, url, data, success) { var xhr = null; try { xhr = new XMLHttpRequest(); } catch (e) { xhr = new ActiveXObject(‘Microsoft.XMLHTTP‘); } if (method == ‘get‘ && data) { url += ‘?‘ + data; } xhr.open(method,url,true); if (method == ‘get‘) { xhr.send(); } else { xhr.setRequestHeader(‘content-type‘, ‘application/x-www-form-urlencoded‘); xhr.send(data); } xhr.onreadystatechange = function() { if ( xhr.readyState == 4 ) { if ( xhr.status == 200 ) { success && success(xhr.responseText); } else { alert(‘出错了,Err:‘ + xhr.status); } } } }
接口:
<?php /** * @ controller Index.class.php * */ defined(‘IN_APP‘) or exit(‘Denied Access!‘); class IndexController extends Controller { public function index() { echo ‘<p>欢迎</p>‘; //$result = $this->db->get("select * from users", 1); //dump($result); } /** * @ interface 用户名验证 */ public function verifyUserName() { $username = trim(isset($_REQUEST[‘username‘]) ? $_REQUEST[‘username‘] : ‘‘); switch ($this->_verifyUserName($username)) { case 0: $this->sendByAjax(array(‘message‘=>‘恭喜你,该用户名可以注册!‘)); break; case 1: $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘用户名长度不能小于3个或大于16个字符!‘)); break; case 2: $this->sendByAjax(array(‘code‘=>2,‘message‘=>‘对不起,该用户名已经被注册了!‘)); break; default: break; } } /** * @ interface 用户注册 */ public function reg() { $username = trim(isset($_REQUEST[‘username‘]) ? $_REQUEST[‘username‘] : ‘‘); $password = trim(isset($_REQUEST[‘password‘]) ? $_REQUEST[‘password‘] : ‘‘); $avatar = trim(isset($_REQUEST[‘avatar‘]) && in_array($_REQUEST[‘avatar‘], array(1,2,3,4,5,6,7,8,9)) ? intval($_REQUEST[‘avatar‘]) : 1); if ($this->_verifyUserName($username) !== 0 || strlen($password)<3 || strlen($password) > 20) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘注册失败!‘)); } $password = md5($password); if (false === $this->db->query("INSERT INTO `users` (`username`, `password`, `avatar`) VALUES (‘{$username}‘, ‘{$password}‘, {$avatar})")) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘注册失败!‘)); } else { $this->sendByAjax(array(‘message‘=>‘注册成功!‘)); } } /** * @ 用户登陆 */ public function login() { $username = trim(isset($_REQUEST[‘username‘]) ? $_REQUEST[‘username‘] : ‘‘); $password = trim(isset($_REQUEST[‘password‘]) ? $_REQUEST[‘password‘] : ‘‘); if (isset($_COOKIE[‘uid‘])) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你已经登陆过了!‘)); } if ($rs = $this->db->get("SELECT * FROM `users` WHERE `username`=‘{$username}‘")) { if ($rs[‘password‘] != md5($password)) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘登陆失败!‘)); } else { setcookie(‘uid‘, $rs[‘uid‘], time() + 3600*60, ‘/‘); setcookie(‘username‘, $rs[‘username‘], time() + 3600*60, ‘/‘); $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘登陆成功!‘)); } } else { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘登陆失败!‘)); } } /** * @ 用户退出 */ public function logout() { if (!isset($_COOKIE[‘uid‘])) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你还没有登陆!‘)); } else { setcookie(‘uid‘, 0, time() - 3600*60, ‘/‘); $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘退出成功!‘)); } } /** * 用户留言保存 */ public function send() { if (!isset($_COOKIE[‘uid‘])) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你还没有登陆!‘)); } else { $content = trim(isset($_POST[‘content‘]) ? $_POST[‘content‘] : ‘‘); if (empty($content)) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘留言内容不能为空!‘)); } $dateline = time(); $this->db->query("INSERT INTO `contents` (`uid`, `content`, `dateline`) VALUES ({$_COOKIE[‘uid‘]}, ‘{$content}‘, {$dateline})"); $returnData = array( ‘cid‘ => $this->db->getInsertId(), ‘uid‘ => $_COOKIE[‘uid‘], ‘username‘ => $_COOKIE[‘username‘], ‘content‘ => $content, ‘dateline‘ => $dateline, ‘support‘ => 0, ‘oppose‘ => 0, ); $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘留言成功!‘,‘data‘=>$returnData)); } } /** * @ 顶 */ public function doSupport() { if (!isset($_COOKIE[‘uid‘])) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你还没有登陆!‘)); } else { $cid = isset($_REQUEST[‘cid‘]) ? intval($_REQUEST[‘cid‘]) : 0; if (!$cid) $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘无效留言cid!‘)); $content = $this->db->get("SELECT cid FROM `contents` WHERE `cid`={$cid}"); if (!$content) $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘不存在的留言cid!‘)); $this->db->query("UPDATE `contents` SET `support`=support+1 WHERE `cid`={$cid}"); $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘顶成功!‘)); } } /** * @ 踩 */ public function doOppose() { if (!isset($_COOKIE[‘uid‘])) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你还没有登陆!‘)); } else { $cid = isset($_REQUEST[‘cid‘]) ? intval($_REQUEST[‘cid‘]) : 0; if (!$cid) $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘无效留言cid!‘)); $content = $this->db->get("SELECT cid FROM `contents` WHERE `cid`={$cid}"); if (!$content) $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘不存在的留言cid!‘)); $this->db->query("UPDATE `contents` SET `oppose`=oppose+1 WHERE `cid`={$cid}"); $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘踩成功!‘)); } } /** * @ 获取留言列表 */ public function getList() { $page = isset($_REQUEST[‘page‘]) ? intval($_REQUEST[‘page‘]) : 1; //当前页数 $n = isset($_REQUEST[‘n‘]) ? intval($_REQUEST[‘n‘]) : 10; //每页显示条数 //获取总记录数 $result_count = $this->db->get("SELECT count(‘cid‘) as count FROM `contents`"); $count = $result_count[‘count‘] ? (int) $result_count[‘count‘] : 0; if (!$count) { $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘还没有任何留言!‘)); } $pages = ceil($count / $n); if ($page > $pages) { $this->sendByAjax(array(‘code‘=>2,‘message‘=>‘没有数据了!‘)); } $start = ( $page - 1 ) * $n; $result = $this->db->select("SELECT c.cid,c.uid,u.username,c.content,c.dateline,c.support,c.oppose FROM `contents` as c, `users` as u WHERE u.uid=c.uid ORDER BY c.cid DESC LIMIT {$start},{$n}"); $data = array( ‘count‘ => $count, ‘pages‘ => $pages, ‘page‘ => $page, ‘n‘ => $n, ‘list‘ => $result ); $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘‘,‘data‘=>$data)); } /** * @ 用户名验证 */ private function _verifyUserName($username=‘‘) { if (strlen($username) < 3 || strlen($username) > 16) { return 1; } $rs = $this->db->get("SELECT `username` FROM `users` WHERE `username`=‘{$username}‘"); if ($rs) return 2; return 0; } }
ajax聊天
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。