Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [MySQL][AJAX][PHP]Niedziałający kod książkowy
Forum PHP.pl > Forum > Przedszkole
followc
Witam, próbuje nauczyć się działania AJAX, w tym celu pracuję z książką 'AJAX i PHP.

Tworzenie interaktywnych aplikacji internetowych'. Mój problem polega na fakcie, iż skrypt

z tej książki(ściągniety bezpośrednio z serwera wydawnictwa) dotyczący czatu AJAX, po

wrzuceniu na serwer nie działa. Co ciekawe w każdej przeglądarce wyświetla inny bład. Jako

początkującemu niesamowicie cięzko mi znaleźć przyczyny błedu. Jedynymi zmianami, które

poczyniłem to wstawienie poprawnych danych bazy mysql

config.php
  1. <?php
  2. // definiuje dane połączenia z bazą danych
  3. define('DB_HOST', localhost');
  4. define('DB_USER', 'user');
  5. define('DB_PASSWORD', 'test');
  6. define('DB_DATABASE', 'database');
  7. ?>


error_handler.php
  1. <?php
  2. // ustawia metodę obsługi błędu użytkownika na error_handler
  3. set_error_handler('error_handler', E_ALL);
  4. // funkcja obsługująca błędy
  5. function error_handler($errNo, $errStr, $errFile, $errLine)
  6. {
  7. // czyści wygenerowane wcześniej dane wyjściowe
  8. // komunikat o błędzie danych wyjściowych
  9. $error_message = 'ERRNO: ' . $errNo . chr(10) .
  10. 'TEKST: ' . $errStr . chr(10) .
  11. 'LOKALIZACJA: ' . $errFile .
  12. ', linia ' . $errLine;
  13. echo $error_message;
  14. // zapobiega wykonywaniu innych skryptyów PHP
  15. }
  16. ?>


chat.php
  1. <?php
  2. // odwołanie do pliku z klasą Chat
  3. require_once("chat.class.php");
  4. // jakie operacja maja być wykonane
  5. $mode = $_POST['mode'];
  6. // domyślnie ustawia ostatnie id na 0
  7. $id = 0;
  8. // tworzy nową instancję klasy Chat
  9. $chat = new Chat();
  10. // jeśli ma być wywołana metoda SendAndRetrieve
  11. if($mode == 'SendAndRetrieveNew')
  12. {
  13. // pobiera parametry wysłanej wiadomości z aplikacji
  14. $name = $_POST['name'];
  15. $message = $_POST['message'];
  16. $color = $_POST['color'];
  17. $id = $_POST['id'];
  18. // sprawdza, czy podane wartości są poprawne
  19. if ($name != '' && $message != '' && $color != '')
  20. {
  21. // wysyła wiadomość do bazy danych
  22. $chat->postMessage($name, $message, $color);
  23. }
  24. }
  25. // jeżeli ma być wywołana metoda DeleteAndRetrieve
  26. elseif($mode == 'DeleteAndRetrieveNew')
  27. {
  28. // usuwa istniejące wiadomości
  29. $chat->deleteMessages();
  30. }
  31. // jeżeli ma być wywołana metoda Retrieve
  32. elseif($mode == 'RetrieveNew')
  33. {
  34. // poniera identyfikator ostatniej wiadomości pobranej przez klienta
  35. $id = $_POST['id'];
  36. }
  37. // czyści dane wyjściowe
  38. // nagłówki są wysyłane aby zapobiec zapisywaniu starych danych przez przeglądarki
  39. header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
  40. header('Last-Modified: ' . gmdate('D, d M Y H:i:s') . 'GMT');
  41. header('Cache-Control: no-cache, must-revalidate');
  42. header('Pragma: no-cache');
  43. header('Content-Type: text/xml, charset=UTF-8');
  44. // pobiera nową wiadomośc z serwera
  45. echo $chat->retrieveNewMessages($id);
  46. ?>


chat.class.php
  1. <?php
  2. // uruchamia plik konfiguracyjny
  3. require_once('config.php');
  4. // uruchamia obsługę błędów
  5. require_once('error_handler.php');
  6. // klasa zawierająca funkcjonalności strony serwera
  7. class Chat
  8. {
  9. // obsługuje bazę danych
  10. private $mMysqli;
  11. // konstruktor otwiera połączenie z bazą danych
  12. function __construct()
  13. {
  14. // łączy się z bazą
  15. $this->mMysqli = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_DATABASE);
  16. }
  17. // destruktor zamyka połączenie z bazą
  18. public function __destruct()
  19. {
  20. $this->mMysqli->close();
  21. }
  22. // kasuje zawartość tabeli zawierającej wiadomości
  23. public function deleteMessages()
  24. {
  25. // tworzy zapytanie SQL, które dodaje nową wiadomość do serwera
  26. $query = 'TRUNCATE TABLE chat';
  27. // wykonuje zapytanie SQL
  28. $result = $this->mMysqli->query($query);
  29. }
  30. /*
  31.   Metoda postMessages dodaje nową wiadomość do bazy
  32.   - $name odpowiada nazwie użytkownika wysłanej wiadomości
  33.   - $messsage to wysłana wiadomość
  34.   - $color zawiera parametry koloru wybranego przez użytkownika
  35.   */
  36. public function postMessage($name, $message, $color)
  37. {
  38. // usuwa znaki specjalne przez dodaniem wiadomości do bazy
  39. $name = $this->mMysqli->real_escape_string($name);
  40. $message = $this->mMysqli->real_escape_string($message);
  41. $color = $this->mMysqli->real_escape_string($color);
  42. // tworzy zapytanie SQL, które dodaje nową wiadomość do serwera
  43. $query = 'INSERT INTO chat(posted_on, user_name, message, color) ' .
  44. 'VALUES (NOW(), "' . $name . '" , "' . $message . '","' . $color . '")';
  45. // wykonuje zapytanie SQL
  46. $result = $this->mMysqli->query($query);
  47. }
  48. /*
  49.   Metoda retrieveMessages pobiera wiadomości, które zostały wysłane na serwer
  50.   - parametr $id jest wysyłany przez klienta i odpowiada identyfikatorowi ostatniej
  51.  
  52. wiadomości pobranej przez niego.
  53.   Wiadomości o późniejszych id będą pobrane z serwera i wysłane klientowi w formacie
  54.  
  55. XML
  56.   */
  57. public function retrieveNewMessages($id=0)
  58. {
  59. // usuwa znaki specjalne przez dodaniem wiadomości do bazy
  60. $id = $this->mMysqli->real_escape_string($id);
  61. // tworzy zapytanie SQL, które pobiera wiadomość do serwera
  62. if($id>0)
  63. {
  64. // pobiera wiadomości świeższe niż te o danym $id
  65. $query = 'SELECT chat_id, user_name, message, color, ' .
  66. 'DATE_FORMAT(posted_on, "%Y-%m-%d %H:%i:%s") ' . 'AS posted_on ' .
  67. 'FROM chat WHERE chat_id > ' . $id . ' ORDER BY chat_id ASC';
  68. }
  69. else
  70. {
  71. // przy pierwszym uruchomieniu wyświetla ostatnich 50 wiadomości z serwera
  72. $query =
  73. 'SELECT chat_id, user_name, message, color, posted_on FROM ' .
  74. '(SELECT chat_id, user_name, message, color, ' .
  75. 'DATE_FORMAT(posted_on, "%Y-%m-%d %H:%i:%s") AS posted_on ' . 'FROM chat ' .
  76. 'ORDER BY chat_id DESC ' . 'LIMIT 50) AS Last50 ' . 'ORDER BY chat_id ASC';
  77. }
  78. // wykonuje zapytanie
  79. $result = $this->mMysqli->query($query);
  80. // tworzy odpowiedź XML
  81. $response = '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>';
  82. $response .= '<response>';
  83. // wysyła czystą flagę
  84. $response .= $this->isDatabaseCleared($id);
  85. // sprawdza czy jest odpowiedź
  86. if($result->num_rows)
  87. {
  88. // przegląda w pętli wszystkie przechwycone wiadomości, aby stworzyć wiadomość
  89.  
  90. wynikową
  91. while ($row = $result->fetch_array(MYSQLI_ASSOC))
  92. {
  93. $id = $row['chat_id'];
  94. $color = htmlspecialchars ($row['color']);
  95. $userName = htmlspecialchars ($row['user_name']);
  96. $time = htmlspecialchars ($row['posted_on']);
  97. $message = htmlspecialchars ($row['message']);
  98. $response .= '<id>' . $id . '</id>' .
  99. '<color><![CDATA[' . $color . ']]></color>' .
  100. '<time>' . $time . '</time>' .
  101. '<name><![CDATA[' . $userName . ']]></name>' .
  102. '<message><![CDATA[' . $message . ']]></message>';
  103. }
  104. // zamyka połączenie z bazą, jak szybko jest to możliwe
  105. $result->close();
  106. }
  107. // kończy odpowiedź XML i wysyła ją
  108. $response = $response . '</response>';
  109. return $response;
  110. }
  111. /*
  112.   Metoda isDatabaseCleared sprawdza, czy baza została wyczyszczona od ostatniego wywołania
  113.  
  114. serwera
  115.   - parametr $id zawiera identyfikator ostatniej wiadomości pobranej rpzez klienta
  116.   */
  117. private function isDatabaseCleared($id)
  118. {
  119. if($id>0)
  120. {
  121. //sprawdzenie liczby wierszy o id mniejszym niż uzyskany od klienta mówi nam, czy
  122.  
  123. baza była ostatnio czyszczona
  124. $check_clear = 'SELECT count(*) old FROM chat where chat_id<=' . $id;
  125. $result = $this->mMysqli->query($check_clear);
  126. $row = $result->fetch_array(MYSQLI_ASSOC);
  127.  
  128. // jeśli baza była czyszczona, tablica musi być przeładowana
  129. if($row['old']==0)
  130. return '<clear>true</clear>';
  131. }
  132. return '<clear>false</clear>';
  133. }
  134. }
  135. ?>


get_color.php
  1. <?php
  2. // nazwa pliku z obrazkiem
  3. $imgfile='palette.png';
  4. // otwiera plik z obrazkiem na stronie
  5. $img=imagecreatefrompng($imgfile);
  6. // pobiera współrzędne punktu klikniętego przez użytkownika
  7. $offsetx=$_GET['offsetx'];
  8. $offsety=$_GET['offsety'];
  9. // pobiera kliknięty kolor
  10. $rgb = ImageColorAt($img, $offsetx, $offsety);
  11. $r = ($rgb >> 16) & 0xFF;
  12. $g = ($rgb >> 8) & 0xFF;
  13. $b = $rgb & 0xFF;
  14. // zwraca kod koloru
  15. printf('#%02s%02s%02s', dechex($r), dechex($g), dechex($b));
  16. ?>


chat.css
  1. body
  2. {
  3. font-family: Tahoma, Helvetica, sans-serif;
  4. margin: 1px;
  5. font-size: 12px;
  6. text-align: left
  7. }
  8. #content
  9. {
  10. border: DarkGreen 1px solid;
  11. margin-bottom: 10px
  12. }
  13. input
  14. {
  15. border: #999 1px solid;
  16. font-size: 10px
  17. }
  18. #scroll
  19. {
  20. position: relative;
  21. width: 340px;
  22. height: 270px;
  23. overflow: auto
  24. }
  25. .item
  26. {
  27. margin-bottom: 6px
  28. }
  29. #colorpicker
  30. {
  31. text-align:center
  32. }
  33.  



index.html
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  4. <title>Czat AJAX</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6. <link href="chat.css" rel="stylesheet" type="text/css" />
  7. <script type="text/javascript" src="chat.js" ></script>
  8. </head>
  9. <body onload="init();">
  10. Twoja przeglądarka nie obsługuje JavaScript!!
  11. <table id="content">
  12. <tr>
  13. <td>
  14. <div id="scroll">
  15. </div>
  16. </td>
  17. <td id="colorpicker">
  18. <img src="palette.png" id="palette" alt="Color Palette" border="1"
  19. onclick="getColor(event);"/>
  20. <br />
  21. <input id="color" type="hidden" readonly="true" value="#000000" />
  22. <span id="sampleText">
  23. (tekst będzie wyglądać tak)
  24. </span>
  25. </td>
  26. </tr>
  27. </table>
  28. <div>
  29. <input type="text" id="userName" maxlength="10" size="10"
  30. onblur="checkUsername();"/>
  31. <input type="text" id="messageBox" maxlength="2000" size="50"
  32. onkeydown="handleKey(event)"/>
  33. <input type="button" value="Wyślij" onclick="sendMessage();" />
  34. <input type="button" value="Skasuj wszystko" onclick="deleteMessages();" />
  35. </div>
  36. </body>
  37. </html>
  38.  



chat.js part I
  1. /* chatURL - URL do aktualizacji wiadomości */
  2. var chatURL = "chat.php";
  3. /* getColorURL - URL do pobrania wybranego koloru RGB */
  4. var getColorURL = "get_color.php";
  5. /* tworzy obiekty XMLHttpRequest, które zaktualizują wiadomości rozmowy i pobiorą wybrany kolor*/
  6. var xmlHttpGetMessages = createXmlHttpRequestObject();
  7. var xmlHttpGetColor = createXmlHttpRequestObject();
  8. /* zmienna, która określa jak często łączyć się z serwerem*/
  9. var updateInterval = 1000; // w milisekundach
  10. // ustawione na true, wyświetla szczegółowy komunikat o błędach
  11. var debugMode = true;
  12. /* rozpoczyna zapisywanie wiadomości w pamięci podręcznej */
  13. var cache = new Array();
  14. /* lastMessageID - tidentyfikator najświeższej wiadomości rozmowy */
  15. var lastMessageID = -1;
  16. /* mouseX, mouseY - współrzędne kursora myszy */
  17. var mouseX,mouseY;
  18. /* tworzy instancję obiektu XMLHttpRequest */
  19. function createXmlHttpRequestObject()
  20. {
  21. //przechowa referencję do obiektu XMLHttpRequest
  22. var xmlHttp;
  23. // powinno zadziałać dla przeglądarek nowszych niż IE6
  24. try
  25. {
  26. // próbuje utworzyć obiekt XMLHttpRequest
  27. xmlHttp = new XMLHttpRequest();
  28. }
  29. catch(e)
  30. {
  31. // zakładając że przeglądarką jest IE6 lub starsza
  32. var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0",
  33. "MSXML2.XMLHTTP.5.0",
  34. "MSXML2.XMLHTTP.4.0",
  35. "MSXML2.XMLHTTP.3.0",
  36. "MSXML2.XMLHTTP",
  37. "Microsoft.XMLHTTP");
  38. // sprawdza każdy prog id, aż któryś zadziała
  39. for (var i=0; i<XmlHttpVersions.length && !xmlHttp; i++)
  40. {
  41. try
  42. {
  43. // próbuje utworzyć obiekt XMLHttpRequest
  44. xmlHttp = new ActiveXObject(XmlHttpVersions[i]);
  45. }
  46. catch (e) {}
  47. }
  48. }
  49. // zwraca utworzony obiekt lub wyświetla wiadomość o błędzie
  50. if (!xmlHttp)
  51. alert("Błąd podczas tworzenia obiektu XMLHttpRequest.");
  52. else
  53. return xmlHttp;
  54. }
  55. /* ta funkcja rozpoczyna rozmowę; jest wykonywana w chwili załadowania strony */
  56. function init()
  57. {
  58. // pobiera odwołanie do okna tekstowego, w którym użytkownik wpisuje nową wiadomość
  59. var oMessageBox = document.getElementById("messageBox");
  60. // zapobiega uruchomieniu funkcji autouzupełniania
  61. oMessageBox.setAttribute("autocomplete", "off");
  62. // odwołanie do tekstu próbnego
  63. var oSampleText = document.getElementById("sampleText");
  64. // ustawia kolor domyślny na czarny
  65. oSampleText.style.color = "black";
  66. // zapewnia nadanie użytkownikowi nazwy (np. generowanej automatycznie)
  67. checkUsername();
  68. // rozpoczyna aktualizację nowego okna
  69. requestNewMessages();
  70. }
  71.  
  72. // funkcja, która zapewnia, że użytkownik dostanie nazwę, choćby generowaną automatycznie
  73. function checkUsername()
  74. {
  75. // zapewnia nadanie użytkownikowi nazwy (np. generowanej automatycznie)
  76. var oUser=document.getElementById("userName");
  77. if(oUser.value == "")
  78. oUser.value = "Gość" + Math.floor(Math.random() * 1000);
  79. }
  80. /* funkcja wywołana po wciśnięciu przycisku "Wyślij"*/
  81. function sendMessage()
  82. {
  83. // zachowuje wiadomość w zmiennych lokalnych i czyści okienko tekstowe
  84. var oCurrentMessage = document.getElementById("messageBox");
  85. var currentUser = document.getElementById("userName").value;
  86. var currentColor = document.getElementById("color").value;
  87. // nie wysyła pustych wiadomości
  88. if (trim(oCurrentMessage.value) != "" &&
  89. trim(currentUser) != "" && trim (currentColor) != "")
  90. {
  91. // jeśli musimy wysłać i pobrać wiadomość
  92. params = "mode=SendAndRetrieveNew" +
  93. "&id=" + encodeURIComponent(lastMessageID) +
  94. "&color=" + encodeURIComponent(currentColor) +
  95. "&name=" + encodeURIComponent(currentUser) +
  96. "&message=" + encodeURIComponent(oCurrentMessage.value);
  97. // dodaje wiadomość do kolejki
  98. cache.push(params);
  99. // czyści okno tekstowe
  100. oCurrentMessage.value = "";
  101. }
  102. }
  103.  
  104. /* funkcja wywołana po wciśnięciu przycisku "Usuń wszystko" */
  105. function deleteMessages()
  106. {
  107. // ustawia flagę, która określa, że wiadomości są usuwane
  108. params = "mode=DeleteAndRetrieveNew";
  109. // dodaje wiadomość do kolejki
  110. cache.push(params);
  111. }
  112.  
  113. /* wysyła asynchroniczne żądanie, aby pobrać nowe wiadomości, wysłać je lub usunąć*/
  114. function requestNewMessages()
  115. {
  116. // pobiera nazwę użytkownika i kolor ze strony
  117. var currentUser = document.getElementById("userName").value;
  118. var currentColor = document.getElementById("color").value;
  119. // kontynuuje jeśli xmlHttpGetMessages nie jest pusty
  120. if(xmlHttpGetMessages)
  121. {
  122. try
  123. {
  124. // nie zaczyna nowej operacji na serwerze, jeśli jakaś jest wykonywana
  125. if (xmlHttpGetMessages.readyState == 4 ||
  126. xmlHttpGetMessages.readyState == 0)
  127. {
  128. // przechowa parametry potrzebne do wykonania żądania na serwerze
  129. var params = "";
  130. // jeśli w kolejce czekają wiadomości, to pobiera najstarszą
  131. if (cache.length>0)
  132. params = cache.shift();
  133. // jeśli pamięć jest pusta, pobiera nową wiadomość
  134. else
  135. params = "mode=RetrieveNew" +
  136. "&id=" +lastMessageID;
  137. // wywołuje działania po stronie serwera
  138. xmlHttpGetMessages.open("POST", chatURL, true);
  139. xmlHttpGetMessages.setRequestHeader("Content-Type",
  140. "application/x-www-form-urlencoded");
  141. xmlHttpGetMessages.onreadystatechange = handleReceivingMessages;
  142.  
  143. xmlHttpGetMessages.send(params);
  144. }
  145. else
  146. {
  147. // sprawdza ponownie czy są nowe wiadomości
  148. setTimeout("requestNewMessages();", updateInterval);
  149. }
  150. }
  151. catch(e)
  152. {
  153. displayError(e.toString());
  154. }
  155. }
  156. }
  157.  
  158. /* funkcja obsługująca odpowiedź HTTP podczas aktualizacji wiadomości*/
  159. function handleReceivingMessages()
  160. {
  161. // kontynuuje jeśli proces jest zakończony
  162. if (xmlHttpGetMessages.readyState == 4)
  163. {
  164. // kontynuuje, jeśli status HTTP ma wartość "OK"
  165. if (xmlHttpGetMessages.status == 200)
  166. {
  167. try
  168. {
  169. // przetwarza odpowiedź serwera
  170. readMessages();
  171. }
  172. catch(e)
  173. {
  174. // wyświetla wiadomość o błędzie
  175. displayError(e.toString());
  176. }
  177. }
  178. else
  179. {
  180. // wyświetla wiadomość o błędzie
  181. displayError(xmlHttpGetMessages.statusText);
  182. }
  183. }
  184. }
  185.  


chat.js part II
  1. /* funkcja obsługująca odpowiedź serwera podczas aktualizacji wiadomości*/
  2. function readMessages()
  3. {
  4. // pobiera odpowiedź serwera
  5. var response = xmlHttpGetMessages.responseText;
  6. // błąd serwera?
  7. if (response.indexOf("ERRNO") >= 0
  8. || response.indexOf("błąd:") >= 0
  9. || response.length == 0)
  10. throw(response.length == 0 ? "Pusta odpowiedź serwera." : response);
  11. // pobiera element dokumentu
  12. response = xmlHttpGetMessages.responseXML.documentElement;
  13. // pobiera flagę określającą czy okno rozmowy zostało wyczyszczone czy nie
  14. clearChat =
  15. response.getElementsByTagName("clear").item(0).firstChild.data;
  16. // jeśli flaga ma wartość true, trzeba wyczyścić okno wiadomości
  17. if(clearChat == "true")
  18. {
  19. // czyści okno wiadomości i zeruje id
  20. document.getElementById("scroll").innerHTML = "";
  21. lastMessageID = -1;
  22.  
  23. }
  24. // pobiera tablice z odpowiedzi serwera
  25. idArray = response.getElementsByTagName("id");
  26. colorArray = response.getElementsByTagName("color");
  27. nameArray = response.getElementsByTagName("name");
  28. timeArray = response.getElementsByTagName("time");
  29. messageArray = response.getElementsByTagName("message");
  30. // dodaje nową wiadomość do okna rozmowy
  31. displayMessages(idArray, colorArray, nameArray, timeArray, messageArray);
  32. // przechowuje lokalnie ID ostatniej otrzymanej wiadomości
  33. if(idArray.length>0)
  34. lastMessageID = idArray.item(idArray.length - 1).firstChild.data;
  35. // ponownie uruchamia sekwencję
  36. setTimeout("requestNewMessages();", updateInterval);
  37. }
  38.  
  39. /* funkcja dodająca nowe wiadomości do okna rozmowy */
  40. function displayMessages(idArray, colorArray, nameArray, timeArray, messageArray)
  41. {
  42. // każdy przebieg pętli dodaje nową wiadomość
  43. for(var i=0; i<idArray.length; i++)
  44. {
  45. // pobiera szczegóły wiadomości
  46. var color = colorArray.item(i).firstChild.data.toString();
  47. var time = timeArray.item(i).firstChild.data.toString();
  48. var name = nameArray.item(i).firstChild.data.toString();
  49. var message = messageArray.item(i).firstChild.data.toString();
  50. // tworzy kod HTML, który wyświetli wiadomość
  51. var htmlMessage = "";
  52. htmlMessage += "<div class=\"item\" style=\"color:" + color + "\">";
  53. htmlMessage += "[" + time + "] " + name + " powiedział: <br/>";
  54. htmlMessage += message.toString();
  55. htmlMessage += "</div>";
  56. // wyświetla wiadomość
  57. displayMessage (htmlMessage);
  58. }
  59. }
  60. // wyświetla wiadomość
  61. function displayMessage(message)
  62. {
  63. // pobiera obiekt scroll
  64. var oScroll = document.getElementById("scroll");
  65. // sprawdza, czy pasek jest przewinięty
  66. var scrollDown = (oScroll.scrollHeight - oScroll.scrollTop <=
  67. oScroll.offsetHeight );
  68. // wyświetla wiadomość
  69. oScroll.innerHTML += message;
  70. // przewija na dół pasek przewijania
  71. oScroll.scrollTop = scrollDown ? oScroll.scrollHeight : oScroll.scrollTop;
  72. }
  73.  
  74. // funkcja wyświetlająca komunikat o błędzie
  75. function displayError(message)
  76. {
  77. // wyświetla wiadomość o błędzie ze szczegółami technicznymi, jeśli debugMode ma ustawienie true
  78. displayMessage("Błąd podczas dostępu do serwera! "+
  79. (debugMode ? "<br/>" + message : ""));
  80. }
  81. /*obsługuje zdarzenie keydown aby określić, kiedy wciśnięto Enter*/
  82. function handleKey(e)
  83. {
  84. // pobiera zdarzenie
  85. e = (!e) ? window.event : e;
  86. // pobiera kod wciśniętego znaku
  87. code = (e.charCode) ? e.charCode : ((e.keyCode) ? e.keyCode :
  88. ((e.which) ? e.which : 0));
  89. // obsługuje zdarzenie keydown
  90. if (e.type == "keydown")
  91. {
  92. // jeśli został wciśnięty Enter (kod 13)
  93. if(code == 13)
  94. {
  95. // wysyła bieżącą wiadomość
  96. sendMessage();
  97. }
  98. }
  99. }
  100. /* usuwa spacje z początku i końca łańcucha*/
  101. function trim(s)
  102. {
  103. return s.replace(/(^\s+)|(\s+$)/g, "")
  104. }
  105.  
  106. /* funkcja, która oblicza współrzędne kursora na stronie*/
  107. function getMouseXY(e)
  108. {
  109. // specyficzne dla przeglądarki
  110. if(window.ActiveXObject)
  111. {
  112. mouseX = window.event.x + document.body.scrollLeft;
  113. mouseY = window.event.y + document.body.scrollTop;
  114. }
  115. else
  116. {
  117. mouseX = e.pageX;
  118. mouseY = e.pageY;
  119. }
  120. }
  121.  
  122. /* wywołanie serwera do pobrania koloru RGB*/
  123. function getColor(e)
  124. {
  125. getMouseXY(e);
  126. // nic nie robi, jeśli obiekt XMLHttpRequest ma wartość null
  127. if(xmlHttpGetColor)
  128. {
  129. // rozpoczyna ustalanie względnej pozycji myszy
  130. var offsetX = mouseX;
  131. var offsetY = mouseY;
  132. // pobiera odwołania
  133. var oPalette = document.getElementById("palette");
  134. var oTd = document.getElementById("colorpicker");
  135. // oblicza względną pozycję kursora w oknie
  136. if(window.ActiveXObject)
  137. {
  138. offsetX = window.event.offsetX;
  139. offsetY = window.event.offsetY;
  140. }
  141. else
  142. {
  143. offsetX -= oPalette.offsetLeft + oTd.offsetLeft;
  144. offsetY -= oPalette.offsetTop + oTd.offsetTop;
  145.  
  146. }
  147. // wywołuje serwer asynchronicznie, aby pobrać wybrany kolor
  148. try
  149. {
  150. if (xmlHttpGetColor.readyState == 4 ||
  151. xmlHttpGetColor.readyState == 0)
  152. {
  153. params = "?offsetx=" + offsetX + "&offsety=" + offsetY;
  154. xmlHttpGetColor.open("GET", getColorURL+params, true);
  155. xmlHttpGetColor.onreadystatechange = handleGettingColor;
  156. xmlHttpGetColor.send(null);
  157. }
  158. }
  159. catch(e)
  160. {
  161. // wyświetla komunikat o błędzie
  162. displayError(xmlHttp.statusText);
  163. }
  164. }
  165. }
  166. /* funkcja obsługująca odpowiedź HTTP */
  167. function handleGettingColor()
  168. {
  169. // jeśli proces zostanie zakończony, decyduje co zrobić ze zwróconymi danymi
  170. if (xmlHttpGetColor.readyState == 4)
  171. {
  172. // tylko jeśli status HTTP jest "OK"
  173. if (xmlHttpGetColor.status == 200)
  174. {
  175. try
  176. {
  177. //zmienia kolor
  178. changeColor();
  179. }
  180. catch(e)
  181. {
  182. // wyświetla komunikat o błędzie
  183. displayError(xmlHttpGetColor.statusText);
  184. }
  185. }
  186. else
  187. {
  188. // wyświetla komunikat o błędzie
  189. displayError(xmlHttpGetColor.statusText);
  190. }
  191. }
  192. }
  193. /* funkcja, która zmienia kolor wyświetlanej wiadomości*/
  194. function changeColor()
  195. {
  196. response=xmlHttpGetColor.responseText;
  197. // błąd serwera?
  198. if (response.indexOf("ERRNO") >= 0 || response.indexOf("error:") >= 0
  199. || response.length == 0)
  200. throw(response.length == 0 ? "Nie mogę zmienić koloru!" : response);
  201. // zmienia kolor
  202. var oColor = document.getElementById("color");
  203. var oSampleText = document.getElementById("sampleText");
  204. oColor.value = response;
  205. oSampleText.style.color = response;
  206. }
mar1aczi
Spójrz na config.php. W listingu jaki wstawiłeś, po kolorowaniu składni, widać, że coś jest nie w porządku.
com
zapomniałeś o najważniejszym jaki to błąd smile.gif

@up przecież pozmieniał przy wrzucaniu tutaj, wiec błąd jest tylko na forum, ale dobrze, że wspomniałeś wink.gif
mar1aczi
Cytat(com @ 30.12.2013, 16:37:58 ) *
@up przecież pozmieniał przy wrzucaniu tutaj, wiec błąd jest tylko na forum, ale dobrze, że wspomniałeś wink.gif

Oby to był tylko ten błąd (że tu na forum wink.gif).
followc
Cytat(mar1aczi @ 30.12.2013, 16:31:54 ) *
Spójrz na config.php. W listingu jaki wstawiłeś, po kolorowaniu składni, widać, że coś jest nie w porządku.

@com ma racje, błąd, akurat w tym pliku, jest tylko na forum. Ma też rację co do braku wypisania pojawiających się błędów;)
w kazdej przegladarce wszystko gra pięknie do momentu połączenia się z serwerem. W poszczególnych przeglądarkach błedy wyglądają następująco:
-Chrome 31.0.1650.63 m:
"Błąd podczas dostępu do serwera!
TypeError: Cannot read property 'documentElement' of null"

-Firefox 26.0:
"Błąd podczas dostępu do serwera!
TypeError: response.getElementsByTagName(...).item(...) is null"

-Opera 12.16:
"Błąd podczas dostępu do serwera!
TypeError: Cannot convert 'xmlHttpGetMessages.responseXML' to object"
php__amator
Witam,

"Przestudiowałem" kod chata, przygotowalem baze i faktycznie cos nie halo.

Ciekawe, u mnie tez wciąż wywala błąd.

"Błąd podczas dostępu do serwera"
i dopatrzyłem się także Error 500 internal server error. Nie wiem jeszcze co go powoduje.
A dodatkowo efekt przy klikaniu na palete wywala na ekran kolejny komunikat o braku/bledzie dostepu do serwera smile.gif
Ale to pewnie ja cos skopałem.



Czy ktos znalazl gdzie tkwi problem questionmark.gif
followc
Czy możliwe jest, żeby kod nie działał na kontach darmowych na serwerze? Spotkałem się z takim pomysłem i w innym ajaxowym programie(duzo prostszym coprawda) tak własnie bylo- na WAMPie śmigało, po wrzuceniu na serwer juz nieszczególnie. Co o tym sądzą bardziej doświadczeni koledzy?
bostaf
W pliku chat.js odszukajcie "application/x-www-form-urlencoded" i zamieńcie na "text/xml". Dajcie znać, czy to pomogło. Jeśli nie to wrzućcie tutaj komunikaty błędów z różnych przeglądarek, tak ładnie jak to @followc zrobił we wcześniejszej wiadomości.
followc
Tym razem w każdej z przeglądarek ten sam błąd:
"Błąd podczas dostępu do serwera!
ERRNO: 8 TEKST: Undefined index: mode LOKALIZACJA: /home/a4182580/public_html/czatest/chat.php, linia 5"

//ponawiam pytanie o to, czy niektóre serwery blokują pracę ajaxu na darmowych kontach. Korzystam z 000webhost.com i nigdzie na stronie nie widze odpowiedzi, a na odpowiedz na ticket troche musze czekac;)
bostaf
Cytat(followc @ 2.01.2014, 14:22:20 ) *
ponawiam pytanie o to, czy niektóre serwery blokują pracę ajaxu na darmowych kontach. Korzystam z 000webhost.com i nigdzie na stronie nie widze odpowiedzi, a na odpowiedz na ticket troche musze czekac;)

Tylko zgaduję, że nie. Ajax to zwykłe zapytania HTTP Request (tylko, że wysyłane asynchronicznie), takie jak każde inne wysyłane z przeglądarki, i dlatego nie widzę powodu (ani sposobu) na zablokowanie tej technologii po stronie serwera. Mogę się mylić.

Cytat(followc @ 2.01.2014, 14:22:20 ) *
Tym razem w każdej z przeglądarek ten sam błąd:
"Błąd podczas dostępu do serwera!
ERRNO: 8 TEKST: Undefined index: mode LOKALIZACJA: /home/a4182580/public_html/czatest/chat.php, linia 5"

A powiedz, na localu Ci śmiga czy nie?
php__amator
Ja sprawdzalem i zdalnie i na lokalnym i wciaz to samo
Poprosilbym jweszcze o pelna liste pol jakie powinny znajdowac sie w bazie - tak na wszelki wypadek, niby wszystkie (wynikajace ze skryptu ) mam ale kto wie .... moze cos przeoczylem.

followc
chat_id int(11) NOT NULL auto_increment,
posted_on datetime NOT NULL,
user_name varchar(255) NOT NULL,
message text NOT NULL,
color chat(7) default '#000000',
PRIMARY KEY (chat_id)


na lokalniaku zdecydowanie nie śmiga, bo nie mogę sobie poradzić z WAMPem. myadmin nie współpracuje;)
bostaf
Zobaczcie wiersze 90 i 123 w pliku chat.class.php smile.gif

To o czym wcześniej pisałem (zmiana "application/x-www-form-urlencoded" na "text/xml") proszę cofnąć.
followc
To niestety błąd, który pojawił się tylko przy wrzucaniu kodu na forum. Na serwerze są to normalne komentarze i czat wciąż nie chce współpracować.
bostaf
Cytat(followc @ 2.01.2014, 20:47:25 ) *
To niestety błąd, który pojawił się tylko przy wrzucaniu kodu na forum. Na serwerze są to normalne komentarze i czat wciąż nie chce współpracować.

Hmm. Zrobiłem te pliki u siebie. Odpaliłem, i od razu pojawił mi się taki komunikat błędu jak podałeś wcześniej. Poprawiłem te dwie linijki w chat.class.php i zaczęło hulać.

OK, to debuguj w taki sposób:
  1. W pliku chat.js, pod wierszem "// pobiera element dokumentu" wstaw wiersz: "console.log(xmlHttpGetMessages);"
  2. Otwórz czat w Chrome. Otwórz konsolę JavaScript (Ctrl + Shift + J).
  3. W konsoli powinieneś mieć wpis "XMLHttpRequest"
  4. Rozwiń ten wpis i zobacz co tam jest napisane w polu "response".
followc
response: "<?xml version="1.0" encoding="UTF-8" standalone="yes"?><response><clear>false</clear></response>
↵<!-- Hosting24 Analytics Code -->
↵<script type="text/javascript" src="http://stats.hosting24.com/count.php"></script>
↵<!-- End Of Analytics Code -->
↵"



Skoro Tobie śmiga, kod musi być poprawny. Mogłem coś spieprzyć w jakichś konfiguracjach serwera? Nie widzę za bardzo innych możliwości jak te po stronie serwera.
mar1aczi
Nie mogłem na to patrzeć i uruchomiłem na localhoście i działa (były jakieś 2 problemy ale to z łamaniem linii z komentarzem w kodzie)
chat.zip
php__amator
Linie 90 i 123 poprawilem juz wczesniej bo je wychwycilem podczas sprawdzania, wlasnie zmieniam fragment w chat.js .....
ciekawe co bedzie u mnie questionmark.gif wink.gif


Teraz po poprawieniu mamy:

B³±d podczas dostêpu do serwera!
ERRNO: 8 TEKST: Undefined index: mode LOKALIZACJA: /var/www/chat/chat.php, linia 5
bostaf
Cytat(followc @ 2.01.2014, 21:22:56 ) *
response: "<?xml version="1.0" encoding="UTF-8" standalone="yes"?><response><clear>false</clear></response>
↵<!-- Hosting24 Analytics Code -->
↵<script type="text/javascript" src="http://stats.hosting24.com/count.php"></script>
↵<!-- End Of Analytics Code -->
↵"

A to śmietnisko. Tylko pierwsza linia to kod chatu. Resztę dynamicznie dodaje Ci hosting. Czyli jednak jest metoda na zablokowanie / popsucie AJAXu przez usługodawcę smile.gif Dodaj na końcu pliku chat.php komendę exit albo die() i powinno hulać.
followc
wow! śmiga pięknie, dzięki wielkie za zaangażowanie:)
php__amator
Cytat(mar1aczi @ 2.01.2014, 22:31:41 ) *
Nie mogłem na to patrzeć i uruchomiłem na localhoście i działa (były jakieś 2 problemy ale to z łamaniem linii z komentarzem w kodzie)
chat.zip


Hej mar1aczi, czy mam rozumiec ze ten zip zawiera juz poprawiony kod działający ?
Testuje ten kod na moim prywatnym serwerze, nie mam żadnych ograniczeń, żadnych blokad czy innych psujących AJAX'a ustawień
dlatego trochę mnie zastanawia. Zrobiłem wszystkie poprawki i NIC a właściwie nie takie nic smile.gif

Cały czas mam ten sam błąd:
ERRNO: 8 TEKST: Undefined index: mode LOKALIZACJA: /var/www/chat/chat.php, linia 5
mar1aczi
@up - Tak, to kod który działa u mnie. Łącznie ze strukturą tabeli MySQLa.
Wyczyść cache przeglądarki, odśwież stronę z czatem, sprawdź logi z php i apache, co tam się pojawia.
followc
witam ponownie, niestety dość szybko pojawiły się nowe problemy. Otóż błąd pojawia się w następujących sytuacjach:
-korzystanie z czatu na tym samym komputerze, na różnych przeglądarkach. Po kilku minutach wyskakuje błąd połączenia z serwerem.
-przy, np. 3 uzytkownikach- kazdy na osobnym komputerze, po odłączeniu się jednego zamyka połączenie również dla dwóch pozostałych. Czy to wina funkcji close()? Czy jest ona w ogole konieczna? występuje ona dwukrotnie- raz w destruktorze(skrypt zamyka przecież połączenie automatycznie po zakończeniu działania), drugi raz przy tworzeniu odpowiedzi XML.
Czy powinienem jakoś zastąpić/usunąć funkcję close(), czy raczej szukać przyczyn zupelnie gdzie indziej?
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.