0

ウェブサイト用の PHP / JavaScript チャット システムを作成しようとしています。ページを更新せずにこれを行うにはどうすればよいですか?

JavaScript は次のことができます: --テキスト ボックスにテキストを動的に追加します。

PHP は次のことができます: --チャットをチャット ログ ファイルに保存し、チャットルームを更新して全員が閲覧できるようにします。

2 番目の部分では、ページを更新する必要があるようです。ユーザーが何かを言うたびにページを更新したくありません。POST または GET を実行する必要なく、バックグラウンドで PHP を実行する方法はありますか? Python や Ruby などの別のサーバー側言語を使用する必要がありますか? どんな助けでも大歓迎です。

4

5 に答える 5

1

msg.phpファイルでチャットメッセージを取得し、jQueryを使用して更新し、メインファイルに含めることができます（メインページは読み込まれませんが、更新されます）。これには、jQueryと同じようにプロトタイプを使用できますが、非常に使いやすいです。

于 2012-09-27T01:43:33.493 に答える
1

1 つのログ ファイルのみを使用するチャット ルーム アプリケーションを作成する場合、つまり、サイトの全員が同じルームにログインする場合、php と ajax と jquery を使用すればそれほど難しくありません。プロセスは次のとおりです。ユーザーにメッセージを入力して送信してもらいたいのですが、そのためのフォームが必要です。

<form name="message" action="">
    <input name="usermsg" type="text" id="usermsg" size="63" />
    <input name="submitmsg" type="submit"  id="submitmsg" value="Send" />
</form>

これがフォームのマークアップです。次に、ユーザーがテキスト ボックスに入力した内容が何であれ、ユーザー入力をシームレスに取り込み、それをスクリプトに送信するものが必要になります。ここで ajax の出番です。

<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript" >
//when the user clicks the button with the id submitmsg, the input is taken
$("#submitmsg").click(function(){   
    var clientmsg = $("#usermsg").val();
            //after the input's value is taken, it's sent to a script called
            //pst.php
    $.post("post.php", {text: clientmsg});
            //after the message is sent, the input's value is set to null
            //to allow the user to type a new message               
    $("#usermsg").attr("value", "");
    return false;
});
</script>

これを行った後、スクリプト post.php がどのように見えるか、そしてそれが何をするかを確認する必要があります。その後、ユーザー間で送信されたメッセージを表示できます。さらに ajax を使用して、一定時間後にファイルをリロードし、ユーザーが含まれるメッセージに常に対応できるようにします。php スクリプトは次のとおりです。

<?
session_start();
if(isset($_SESSION['name'])){
$text = $_POST['text'];

$fp = fopen("log.html", 'a');
fwrite($fp, "<div class='msgln'><b>".$_SESSION['name']."</b>: ".stripslashes(htmlspecialchars($text))."<br></div>");
fclose($fp);
}
?>

私はセッションを使用したことに注意してください。これは、ログインしたユーザーの名前を取得し、それをログファイルに出力することです.データをファイルにアップロードするには、ユーザーが以下を確認できるようにアップロードする必要があります。

<div id="chatbox">
<?php
if(file_exists("log.html") && filesize("log.html") > 0){
    $handle = fopen("log.html", "r");
    $contents = fread($handle, filesize("log.html"));
    fclose($handle);

    echo $contents;
}
?>
</div>

これはログ ファイルが読み込まれる部分です。あと 1 つだけ残っています。一定時間後にファイルをリロードし、自動スクロール機能を追加する必要があります。

//Load the file containing the chat log
function loadLog(){     
    var oldscrollHeight = $("#inner").attr("scrollHeight") - 20;
    $.ajax({
        url: "log.html",
        cache: false,
        success: function(html){        
            $("#inner").html(html); //Insert chat log into the #chatbox div             
            var newscrollHeight = $("#inner").attr("scrollHeight") - 20;
            if(newscrollHeight > oldscrollHeight){
                $("#inner").animate({ scrollTop: newscrollHeight }, 'normal'); //Autoscroll to bottom of div
            }               
        },
    });
}
setInterval (loadLog, 2500);    //Reload file every 2.5 seconds

これでうまくいくはずです。まだ有用な答えが得られていない場合に役立つことを願っています。長い間待っていたでしょう。

于 2012-10-19T14:06:25.523 に答える
0

JavascriptとPHPでこれを行うにはいくつかの方法があります。最も基本的な方法は、JavascriptのXMLHttpRequest関数を介してJavascriptPOSTリクエストを送信することです。これにより、ページをリロードせずにデータを送受信できます。その方法でデータを送信し、結果を処理する方法については、Google「AJAX」を参照してください。

PHPはこれらを通常のPOSTリクエストとして受け取るため、データを返すという点でバックエンドで好きなことを行うことができます。ただし、PHPを使用してデータを返すのであって、新しいWebページを送信するのではないので、これを行う最も簡単な方法で、ネットワークを介してテキストを送信することができます。

チャットルームの目的で、AJAXは、新しいチャットが着信したかどうかを確認するために、数秒ごとにサーバーをポーリングするJavaScriptコードを必要とします。これはあまり効果的ではありません。本当に必要なのは、クライアントへの接続を開いたままにして、何かが変更されたときに通知できるサーバー上のものです。そのためには、JavaScriptでWebsocketを使用し、PHPソケットサーバーを作成する必要があります。これらの両方を実際に行う方法は、この回答の範囲外です。しかし、あなたが話しているテクノロジーを使用することは可能です。

于 2012-09-27T01:43:01.010 に答える
0

ページを更新したくない場合は、Ajax投稿を使用できます。これが実装です。

http://css-tricks.com/jquery-php-chat/

小規模なサイトであれば問題ありません。それ以外の場合は、ErlangまたはGoプログラミングを使用してチャットを強化することをお勧めします。

于 2012-09-27T01:42:01.730 に答える
0

AJAXはあなたのニーズに合うはずです。JSからデータを送信してPHPで処理し、返されたオブジェクトを受信して​​JSで処理することができます。

チュートリアル： http： //css-tricks.com/jquery-php-chat/または http://code.jenseng.com/jenChat/

于 2012-09-27T01:42:11.077 に答える