Witam,
w tym artykule opiszę jak napisać prosty czas który można wykorzystać w każdej(chyba 
) grze via www i nie tylko
założenia dla wersji pierwszej:
*chat nie będzie samodzielną aplikacją ale dodatkiem do już istniejącej aplikacji
*chat będzie wykorzystywał technologię AJAX
*chat ma działać prawidłowo nawet przy wyłączonej obsłudze js
*chat będzie rozpoznawał zalogowanego użytkownika poprzez sesje
*chat będzie oparty o bazę danych MySQL
*chat nie będzie zawierał własnego systemu autoryzacji(będzie korzystał z systemu aplikacji macierzystej)
zaczynamy od bazy danych
Kod:
`id` int(11) NOT NULL auto_increment
`id_sender` int(11) NOT NULL
`tekst` varchar(255) collate utf8_polish_ci NOT NULL
gdzie:
`id` to numer identyfikacyjny wiadomości
`id_sender` to numer identyfikacyjny osoby wysyłającej wiadomość
`tekst` tekst wiadomości
a teraz pora na pliki:
cały czat będzie "składał się" z pięciu plików:
chat.php główny plik czatu w którym będą wyświetlane rozmowy i wysyłane nowe wypowiedzi
get.php plik odpowiedzialny za pobieranie oraz wyświetlanie rozmów
send.php plik odpowiedzialny za przetwarzanie oraz wysyłanie wiadomości
config.php plik aplikacji macierzystej, odpowiadający za inicjowanie połączenia z bazą MySQL
jquery.js plik biblioteki jQuery
Przejdźmy do budowy plików. Plikiem od którego zaczniemy będzie chat.php, pierwszą rzeczą jaką należy zrobić jest dołączenie biblioteki jquery w sekcji head naszego pliku
Kod:
<script type="text/javascript" src="jquery.js"></script>
kolejną rzeczą jest stworzenie formularza do wysyłania wypowiedzi. Formularz będzie się składał z pola do wprowadzania danych oraz przycisku do wysyłania. Ze względów bezpieczeństwa dane będą przesyłane metodą POST.
Kod html:
<form method="post" id="send" action="send.php" >
<input type="text" name="tekst" id="tekst" />
<input type="submit" name="send" value="wyślij" />
</form>
Dobra mamy już formularz do wysyłania danych, a teraz przydało by się coś do ich wyświetlania. Posłuży do tego div
Kod html:
<div id="chat">
<?php include "get.php"; ?>
</div>
Wewnątrz diva jest dołączony plik get.php aby zaraz po wczytaniu strony zostały wyświetlone wszystkie wypowiedzi.
Jest już formularz i pole do wyświetlania wypowiedzi, ale ciągle nie możemy nic pisać. Więc pora zabrać się za send.php.
Pierwszą rzeczą jaką musimy zrobić to nawiązanie połączenia z bazą danych, oraz utworzenie sesji. W tym celu do pliku send.php dołączamy plik config.php(zakładam że to w nim dochodzi do zainicjowania połączenia z bazą danych w programie macierzystym, zakładam również że to w tym pliku jest tworzona sesja). Kolejną rzeczą jest wykonanie odpowiedniego zapytania do MySQL'a oraz ponowne przekierowanie do pliku chat.php(potrzebne w przypadku nieobsługiwania js przez przeglądarkę użytkownika).
Kod php:
<?php
include 'config.php';
mysql_query("INSERT INTO chat SET `id_sender`=".$_SESSION['id_player'].", `tekst`='".mysql_escape_string($_POST['tekst'])."'");
header("Location: chat.php");
?>
zakładam ze $_SESSION['id_player'] przechowuje id zalogowanej osoby, w różnych aplikacjach może to różnie wyglądać !!!
Kolejna część za nami. Możemy już wysłać wiadomość ale ciągle nie możemy ich odczytać. Dlatego teraz napiszemy get.php, ale najpierw krótkie wyjaśnienie
skrypt był pisany na potrzeby vall 0.3beta więc opieram się na tabeli z użytkownikami o nazwie players(tak jak w vall), za imię gracza odpowiada kolumna user, a ranga to rank.
Po pierwsze dołączamy config.php
Po drugie wykonujemy odpowiednie zapytanie pobierające treść wypowiedzi, imię autora oraz jego rangę w grze.
Kod php:
<?php
include 'config.php';
$tekst=mysql_query('SELECT ch.tekst, p.user, p.rank FROM chat ch LEFT JOIN players p ON p.id = ch.id_sender ORDER BY ch.id DESC LIMIT 5 ');
Klauzura LIMIT 5 powoduje wyświetlenie 5 ostatnich wiadomości.
następnie tworzymy tabelę z innymi kolorami czcionek dla odpowiednich rang
Kod php:
$text_color=array('Admin'=>'#ff0000','Member'=>'#000000');
ja uwzględniłem na początek 2 rangi, administrator i zwykły użytkownik.
Teraz sprawdzamy czy są jakieś wypowiedzi, jeśli tak to je wyświetlamy
Kod php:
if(mysql_num_rows($tekst)>0){
echo '<table style="width:100%">';
while($a=mysql_fetch_array($tekst)){
echo '<tr class="chat"><td style="width:50px;background:#bbbbff;color:'.$text_color[$a['rank']].'">'.$a['user'].'</td><td style="background:#9999ff;"> '.$a['tekst'].'</tr>';
}
echo '</table>';
}
?>
Całość powinna już działać poprawnie(mam taką nadzieją, ponieważ upraszczałem bardziej skomplikowany kod. Jak mi wena nie przejdzie to napiszę "całość" w kolejnych częściach).
A skoro kod php działa to można przejść do AJAX'a, w tym celu wracamy do pliku chat.php.
AJAX ma odpowiadać ze odświeżanie wypowiedzi co pewien czas, oraz przechwycenie zdarzenia wysłania formularza. Po przechwyceniu tego zdarzenia wysyłamy dane do pliku send.php, odświeżamy wypowiedzi, czyścimy pole "tekst" oraz(bardzo ważne) blokujemy wysłanie danych przez formularz dzięki czemu nie odświeża się strona.
Kod:
$(document).ready(function(){
$("#send").submit(function(){
$.ajax({
type: "POST",
url: "send.php",
data:"tekst="+$("#tekst").val(),
success: function(){
$("#chat").load("get.php");
$("#tekst").val('');
}})
return false;
});
window.setInterval(function(){
$("#chat").load("get.php");
},3000);
});
i na tym kończę pierwszą cześć.
Jeśli mi wena nie przejdzie to w części drugiej zamierzam opisać:
założenia dla części drugiej:
*chat ma obsługiwać system wiadomości prywatnych oraz umożliwiać rozmowę z tylko jedną osobą
*użytkownicy mogą zgłaszać wypowiedzi
*wiadomości zostają usunięte po upływie określonego czasu, chyba że zostały zgłoszone
na chacie będzie można blokować wypowiedzi wybranych użytkowników(system "banów")
[PHP][MySQL]Piszemy chat - część pierwsza - by sazian
Odpowiedz z cytatem
Zakładki