Jquery/Phpチャットスクリプトと私はいくつかの問題があります

Question

私はこのチャットのJquery/Phpプロセスを持っています。オンラインユーザーにメッセージを送信してチャットウィンドウを閉じるか閉じるページのチャットウィンドウが毎回ポップアップしていて、私は窓の近くを閉鎖して良い状態にしておきたい。また、バーを最小限に抑えるためにページをリフレッシュしても、

次の問題は、メッセージを送信したときに表示されないメッセージが表示されたときに表示されることがありますが、ページを更新するときに表示されます。

Ps：スクリプトは私のものではなく、私はそれをyoutubeで見つけました。

jQueryのチャットスクリプト：

jQuery(function(){ 
    var userOnline = Number(jQuery('span.user_online').attr('id')); 
    var clicou = []; 

    function in_array(valor, array){ 
    for(var i =0; i<array.length;i++){ 
     if(array[i] == valor){ 
     return true; 
     } 
    } 

    return false; 
    } 

    function add_janela(id, nome, status){ 
    var janelas = Number(jQuery('#chats .window').length); 
    var pixels = (270+5)*janelas; 
    var style = 'float:none; position:absolute; bottom:0; right:'+pixels+'px'; 

    var splitDados = id.split(':'); 
    var id_user = Number(splitDados[1]); 


    var janela = '<div class="window" id="janela_'+id_user+'" style="'+style+'">'; 
    janela += '<div class="header_window"><a href="#" class="close">X</a> <span class="name">'+nome+'</span> <span id="'+id_user+'" class="status-lista'+'"></span></div>'; 
    janela += '<div class="body"><div class="mensagens"><div id="typing_on"></div><ul></ul></div>'; 
    janela += '<div class="send_message" id="'+id+'"><input type="text" name="mensagem" class="msg" id="'+id+'"/></div></div>'; 

    jQuery('#chats').append(janela); 

    } 



    function retorna_historico(id_conversa){ 
    jQuery.ajax({ 
     type: 'POST', 
     url: 'sys/historico.php', 
     data: {conversacom: id_conversa, online: userOnline}, 
     dataType: 'json', 
     success: function(retorno){ 
     jQuery.each(retorno, function(i, msg){ 
      if(jQuery('#janela_'+msg.janela_de).length > 0){ 
      if(userOnline == msg.id_de){ 
       jQuery('#janela_'+msg.janela_de+' .mensagens ul').append('<li id="'+msg.id+'" class="eu"><p>'+msg.mensagem+'</p></li>'); 
      }else{ 
       jQuery('#janela_'+msg.janela_de+' .mensagens ul').append('<li id="'+msg.id+'"><div class="imgSmall"><img src="'+msg.fotoUser+'" /></div><p>'+msg.mensagem+'</p></li>'); 
      } 
      } 
     }); 
     [].reverse.call(jQuery('#janela_'+id_conversa+' .mensagens li')).appendTo(jQuery('#janela_'+id_conversa+' .mensagens ul')); 
     jQuery('#janela_'+id_conversa+' .mensagens').animate({scrollTop: 230}, '500'); 
     } 
    }); 
    } 

    jQuery('body').on('click', '#users_online a', function(){ 
    var id = jQuery(this).attr('id'); 
    jQuery(this).removeClass('comecar'); 

    var status = jQuery(this).next().attr('class'); 
    var splitids = id.split(':'); 
    var idJanela = Number(splitids[1]); 

    if(jQuery('#janela_'+idJanela).length === 0){ 
     var nome = jQuery(this).text(); 
     add_janela(id, nome, status); 
     retorna_historico(idJanela); 
    }else{ 
     jQuery(this).removeClass('comecar'); 
    } 
    }); 

    jQuery('body').on('click', '.header_window', function(){ 
    var next = jQuery(this).next(); 
    next.toggle(100); 
    }); 

    jQuery('body').on('click', '.close', function(){ 
    var parent = jQuery(this).parent().parent(); 
    var idParent = parent.attr('id'); 
    var splitParent = idParent.split('_'); 
    var idJanelaFechada = Number(splitParent[1]); 

    var contagem = Number(jQuery('.window').length)-1; 
    var indice = Number(jQuery('.close').index(this)); 
    var restamAfrente = contagem-indice; 

    for(var i = 1; i <= restamAfrente; i++){ 
     jQuery('.window:eq('+(indice+i)+')').animate({left:"-=275"}, 200); 
    } 
    parent.remove(); 
    jQuery('#users_online li#'+idJanelaFechada+' a').addClass('comecar'); 
    }); 

    jQuery('body').on('keyup', '.msg', function(e){ 
    if(e.which == 13){ 
     var texto = jQuery(this).val(); 
     var id = jQuery(this).attr('id'); 
     var split = id.split(':'); 
     var para = Number(split[1]); 

     jQuery.ajax({ 
     type: 'POST', 
     url: 'sys/submit.php', 
     data: {mensagem: texto, de: userOnline, para: para}, 
     success: function(retorno){ 
      if(retorno == 'ok'){ 
      jQuery('.msg').val(''); 
      }else{ 
      alert("Ocorreu um erro ao enviar a mensagem"); 
      } 
     } 
     }); 
    } 
    }); 

    jQuery('body').on('click', '.mensagens', function(){ 
    var janela = jQuery(this).parent().parent(); 
    var janelaid = janela.attr('id'); 
    var idConversa = janelaid.split('_'); 
    idConversa = Number(idConversa[1]); 

    jQuery.ajax({ 
     url: 'sys/ler.php', 
     type: 'POST', 
     data: {ler: 'sim', online: userOnline, user: idConversa}, 
     success: function(retorno){} 
    }); 
    }); 

    function verifica(timestamp, lastid, user){ 
    var t; 
    jQuery.ajax({ 
     url: 'sys/stream.php', 
     type: 'GET', 
     data: 'timestamp='+timestamp+'&lastid='+lastid+'&user='+user, 
     dataType: 'json', 
     success: function(retorno){ 
     clearInterval(t); 
     if(retorno.status == 'resultados' || retorno.status == 'vazio'){ 
      t =setTimeout(function(){ 
      verifica(retorno.timestamp, retorno.lastid, userOnline); 
      },1000); 

      if(retorno.status == 'resultados'){ 
      jQuery.each(retorno.dados, function(i, msg){ 
       if(msg.id_para == userOnline){ 
       jQuery.playSound('sys/effect'); 
       } 

       if(jQuery('#janela_'+msg.janela_de).length === 0){ 
       jQuery('#users_online #'+msg.janela_de+' .comecar').click(); 
       clicou.push(msg.janela_de); 
       } 

       if(!in_array(msg.janela_de, clicou)){ 
       if(jQuery('.mensagens ul li#'+msg.id).length === 0 && msg.janela_de > 0){ 
        if(userOnline == msg.id_de){ 
        jQuery('#janela_'+msg.janela_de+' .mensagens ul').append('<li class="eu" id="'+msg.id+'"><p>'+msg.mensagem+'</p></li>'); 
        }else{ 
        jQuery('#janela_'+msg.janela_de+' .mensagens ul').append('<li id="'+msg.id+'"><div class="imgSmall"><img src="'+msg.fotouser+'" border="0"/></div><p>'+msg.mensagem+'</p></li>'); 
        } 
       } 
       } 
      }); 
      jQuery('.mensagens').animate({scrollTop: 230}, '500'); 
      console.log(clicou); 
      } 
      clicou = []; 
      jQuery('#users_online ul').html(''); 
      jQuery.each(retorno.users, function(i, user){ 
      var incluir = '<li id="'+user.id+'"><div class="imgSmall"><img src="'+user.foto+'" border="0"/></div>'; 
      incluir += '<a href="#" id="'+userOnline+':'+user.id+'" class="comecar">'+user.nome+'</a>'; 
      incluir += '<span id="'+user.id+'" class="status '+user.status+'"></span></li>'; 
      jQuery('span#'+user.id).attr('class', 'status-lista '+user.status); 
      jQuery('#users_online ul').append(incluir); 
      }); 
     }else if(retorno.status == 'erro'){ 
      alert('Ficamos confusos, atualize a pagina'); 
     } 
     }, 

    }); 
    } 

    verifica(0,0,userOnline); 
}); 

歴史PHPファイル：

<?php 
     if(isset($_POST['mensagem'])){ 
      include_once "../defines.php"; 
      require_once('../classes/BD.class.php'); 
      BD::conn(); 

      $mensagem = utf8_decode(strip_tags(trim(filter_input(INPUT_POST, 'mensagem', FILTER_SANITIZE_STRING)))); 
      $de = (int)$_POST['de']; 
      $para = (int)$_POST['para']; 
     if($mensagem != ''){ 
      $insert = BD::conn()->prepare("INSERT INTO `mensagens` (id_de, id_para, mensagem, time, lido) VALUES (?,?,?,?,?)"); 
      $arrayInsert = array($de, $para, $mensagem, time(), 0); 
      if($insert->execute($arrayInsert)){ 
       echo 'ok'; 
      }else{ 
       echo 'no'; 
      } 
     } 
    } 
?> 

ストリームPHPファイル：

<?php 
    if(isset($_GET)){ 
     include_once "../defines.php"; 
     require_once('../classes/BD.class.php'); 
     BD::conn(); 

     $userOnline = (int)$_GET['user']; 
     $timestamp = ($_GET['timestamp'] == 0) ? time() : strip_tags(trim($_GET['timestamp'])); 
     $lastid = (isset($_GET['lastid']) && !empty($_GET['lastid'])) ? $_GET['lastid'] : 0; 

     $usersOn = array(); 
     $agora = date('Y-m-d H:i:s'); 
     $expira = date('Y-m-d H:i:s', strtotime('+1 min')); 
     $upOnline = BD::conn()->prepare("UPDATE `mls_users` SET `limite` = ? WHERE `id` = ?"); 
     $upOnline->execute(array($expira, $userOnline)); 

     $pegaOnline = BD::conn()->prepare("SELECT * FROM `mls_users` WHERE `id` != '$userOnline' ORDER BY `id` DESC"); 
     $pegaOnline->execute(); 
     while($onlines = $pegaOnline->fetch()){ 
      $photo = ($onlines['photo'] == '') ? 'default.jpg' : $onlines['photo']; 
      $blocks = explode(',', $onlines['blocks']); 
      if(!in_array($userOnline, $blocks)){ 
       if($agora >= $onlines['limite']){ 
        $usersOn[] = array('id' => $onlines['id'], 'nome' => utf8_encode($onlines['username']), 'foto' => $photo, 'status' => 'off'); 
       }else{ 
        $usersOn[] = array('id' => $onlines['id'], 'nome' => utf8_encode($onlines['username']), 'foto' => $photo, 'status' => 'on'); 
       } 
      } 
     } 

     if(empty($timestamp)){ 
      die(json_encode(array('status' => 'erro'))); 
     } 

     $tempoGasto = 0; 
     $lastidQuery = ''; 

     if(!empty($lastid)){ 
      $lastidQuery = ' AND `id` > '.$lastid; 
     } 

     if($_GET['timestamp'] == 0){ 
      $verifica = BD::conn()->prepare("SELECT * FROM `mensagens` WHERE `lido` = 0 ORDER BY `id` DESC"); 
     }else{ 
      $verifica = BD::conn()->prepare("SELECT * FROM `mensagens` WHERE `time` >= $timestamp".$lastidQuery." AND `lido` = 0 ORDER BY `id`DESC"); 
     } 
     $verifica->execute(); 
     $resultados = $verifica->rowCount(); 

     if($resultados <= 0){ 
      while($resultados <= 0){ 
       if($resultados <= 0){ 
        //durar 30 segundos verificando 
        if($tempoGasto >= 30){ 
         die(json_encode(array('status' => 'vazio', 'lastid' => 0, 'timestamp' => time(), 'users' => $usersOn))); 
         exit; 
        } 

        //descansar o script por um segundo 
        sleep(1); 
        $verifica = BD::conn()->prepare("SELECT * FROM `mensagens` WHERE `time` >= $timestamp".$lastidQuery." AND `lido` = 0 ORDER BY `id`DESC"); 
        $verifica->execute(); 
        $resultados = $verifica->rowCount(); 
        $tempoGasto += 1; 
       } 
      } 
     } 

     $novasMensagens = array(); 
     if($resultados >= 1){ 
      $emotions = array(':)', ':@', '8)', ':D', ':3', ':(', ';)'); 
      $imgs = array(
       '<img src="emotions/nice.png" width="14"/>', 
       '<img src="emotions/angry.png" width="14"/>', 
       '<img src="emotions/cool.png" width="14"/>', 
       '<img src="emotions/happy.png" width="14"/>', 
       '<img src="emotions/ooh.png" width="14"/>', 
       '<img src="emotions/sad.png" width="14"/>', 
       '<img src="emotions/right.png" width="14"/>' 
      ); 

      while($row = $verifica->fetch()){ 
       $fotouser = ''; 
       $janela_de = 0; 

       if($userOnline == $row['id_de']){ 
        $janela_de = $row['id_para']; 

       }elseif($userOnline == $row['id_para']){ 
        $janela_de = $row['id_de']; 
        $pegaUsr = BD::conn()->prepare("SELECT `photo` FROM `mls_users` WHERE `id` = '$row[id_de]'"); 
        $pegaUsr->execute(); 
        while($usr = $pegaUsr->fetch()){ 
         $fotouser = ($usr['photo'] == '') ? 'default.jpg' : $usr['photo']; 
        } 
       } 
       $msg = str_replace($emotions, $imgs, $row['mensagem']); 
       $novasMensagens[] = array(
        'id' => $row['id'], 
        'mensagem' => utf8_encode($msg), 
        'fotouser' => $fotouser, 


      'id_de' => $row['id_de'], 
       'id_para' => $row['id_para'], 
       'janela_de' => $janela_de 
      ); 
     } 
    } 

    $ultimaMsg = end($novasMensagens); 
    $ultimoId = $ultimaMsg['id']; 
    die(json_encode(array('status' => 'resultados', 'timestamp' => time(), 'lastid' => $ultimoId, 'dados' => $novasMensagens, 'users' => $usersOn))); 
} 
?> 

<?php 
if(isset($_POST['conversacom'])){ 

    include_once "../defines.php"; 
    require_once('../classes/BD.class.php'); 
    BD::conn(); 

    $mensagens = array(); 
    $id_conversa = (int)$_POST['conversacom']; 
    $online = (int)$_POST['online']; 

    $pegaConversas = BD::conn()->prepare("SELECT * FROM `mensagens` WHERE (`id_de` = ? AND `id_para` = ?) OR (`id_de` = ? AND `id_para` = ?) ORDER BY `id` DESC LIMIT 10"); 
    $pegaConversas->execute(array($online, $id_conversa, $id_conversa, $online)); 

    while($row = $pegaConversas->fetch()){ 
     $fotouser = ''; 
     if($online == $row['id_de']){ 
      $janela_de = $row['id_para']; 

     }elseif($online == $row['id_para']){ 
      $janela_de = $row['id_de']; 

      $pegaFoto = BD::conn()->prepare("SELECT `photo` FROM `mls_users` WHERE `id` = '$row[id_de]'"); 
      $pegaFoto->execute(); 

      while($usr = $pegaFoto->fetch()){ 
       $fotouser = ($usr['photo'] == '') ? 'default.jpg' : $usr['photo']; 
      } 
     } 

     $emotions = array(':)', ':@', '8)', ':D', ':3', ':(', ';)'); 
     $imgs = array(
      '<img src="emotions/nice.png" width="14"/>', 
      '<img src="emotions/angry.png" width="14"/>', 
      '<img src="emotions/cool.png" width="14"/>', 
      '<img src="emotions/happy.png" width="14"/>', 
      '<img src="emotions/ooh.png" width="14"/>', 
      '<img src="emotions/sad.png" width="14"/>', 
      '<img src="emotions/right.png" width="14"/>' 
     ); 
     $msg = str_replace($emotions, $imgs, $row['mensagem']); 
     $mensagens[] = array(
      'id' => $row['id'], 
      'mensagem' => utf8_encode($msg), 
      'fotoUser' => $fotouser, 
      'id_de' => $row['id_de'], 
      'id_para' => $row['id_para'], 
      'janela_de' => $janela_de 
     ); 

    } 
    die(json_encode($mensagens)); 
} 
?> 

は、PHPファイルを送信

Answer 1

jQuery.ajax({ 
     type: 'POST', 
     url: 'sys/submit.php', 
     data: {mensagem: texto, de: userOnline, para: para}, 
     success: function(retorno){ 
      if(retorno = 'ok'){ 
      jQuery('.msg').val(''); 
      }else{ 
      alert("Ocorreu um erro ao enviar a mensagem"); 
      } 
     } 
     }); 
    } 
    });