AJAX-Updates blockieren das Aktualisieren von Nachrichten

korsan · 4. Juli 2010

Hallo.
Ich programmieren gerade eine Website, in der automatisch mit ajax nachrichten anzeige die mit setInterval alle fünf minuten erneuere.
Da leuft alles perfekt nun muss ich aber meherer ajax updates einabuen sobald ich in den header die neue javascript-datei angebe, läuft die erste nicht mehr.

Meine code:
im header.php

Code:

<link href="<?=$config['url']?>/templates/default/style.css" rel="stylesheet" type="text/css">
<link href="<?=$config['url']?>/templates/default/userhomemessage.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="<?=$config['url']?>/moduls/userhome/userhomemessage.js" ></script>

userhomemessage.js datei

Code:

// globale Instanz von XMLHttpRequest
var xmlHttp = false;


// ... für Internet Explorer
try {
    xmlHttp  = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
    try {
        xmlHttp  = new ActiveXObject("Microsoft.XMLHTTP");
    } catch(e) {
        xmlHttp  = false;
    }
}
// ... für Mozilla, Opera und Safari
if (!xmlHttp  && typeof XMLHttpRequest != 'undefined') {
    xmlHttp = new XMLHttpRequest();
}

// aktuelle Daten laden
loadData();

// alle 5 Sekunden neue Daten holen
setInterval("loadData()",5000);

function loadData()
{
 if (xmlHttp) {
     xmlHttp.open('GET', 'moduls/userhome/getdata.php', true);
     xmlHttp.onreadystatechange = function () {
         if (xmlHttp.readyState == 4) {
             document.getElementById("asb_content").innerHTML = xmlHttp.responseText;
         }
     };
     xmlHttp.send(null);
 }
}

function saveData()
{
if (xmlHttp) {
    xmlHttp.open('POST', 'moduls/userhome/setdata.php');
    xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xmlHttp.send('name='+document.frmshoutbox.txtname.value+'&message='+document.frmshoutbox.txtmessage.value);
}

// Message-Eingabefelder leeren und Focus setzen
document.frmshoutbox.txtmessage.value = '';
document.frmshoutbox.txtmessage.focus();
}

das leut alles perfekt aber sobald ich die zweite einfüge in den header funktioniert das erste nicht

hader.php

Code:

<link href="<?=$config['url']?>/templates/default/style.css" rel="stylesheet" type="text/css">
<link href="<?=$config['url']?>/templates/default/userhomemessage.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="<?=$config['url']?>/moduls/userhome/userhomemessage.js" ></script>
<script type="text/javascript" src="<?=$config['url']?>/states/privatmsg.js" ></script>

privatmsg.js datei:

Code:

// globale Instanz von XMLHttpRequest
var xmlHttp = false;

// XMLHttpRequest-Instanz erstellen
// ... für Internet Explorer
try {
    xmlHttp  = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
    try {
        xmlHttp  = new ActiveXObject("Microsoft.XMLHTTP");
    } catch(e) {
        xmlHttp  = false;
    }
}
// ... für Mozilla, Opera und Safari
if (!xmlHttp  && typeof XMLHttpRequest != 'undefined') {
    xmlHttp = new XMLHttpRequest();
}
loadPrivatm();

// alle 5 Sekunden neue Daten holen
setInterval("loadPrivatm()",5000);

function loadPrivatm()
{
 if (xmlHttp) {
     xmlHttp.open('GET', 'states/user_privatm_total.php', true);
     xmlHttp.onreadystatechange = function () {
         if (xmlHttp.readyState == 4) {
             document.getElementById("asb_privatm_content").innerHTML = xmlHttp.responseText;
         }
     };
     xmlHttp.send(null);
 }
}

die datei die ablaufen soll:

Code:

$privatm =mysql_query('SELECT privatm_id,privatm_disreption  FROM privatmessages WHERE privatm_userid="'.intval($_SESSION['memberid']).'"');
$total_msg = mysql_num_rows($privatm)){
$pm ='<span class="privatmtext">'.$lange['privatmessages'].' (<b>'.$total_msg.'</b>)........</span>';

}

Könnt Ihr mir helfen?

CPoly · 4. Juli 2010

Gibt es eine Fehlermeldung (Javascript Konsole)?

Mit der zweiten Javasscript Datei überschreibst du die Variable "xmlHttp". Ob es daran liegt, kann ich nicht sicher sagen, aber entferne aus der privatmsg.js mal die Erzeugung des XMLHttpRequest-Objektes.

privatmsg.js datei:

Code:

loadPrivatm();

// alle 5 Sekunden neue Daten holen
setInterval("loadPrivatm()",5000);

function loadPrivatm()
{
 if (xmlHttp) {
     xmlHttp.open('GET', 'states/user_privatm_total.php', true);
     xmlHttp.onreadystatechange = function () {
         if (xmlHttp.readyState == 4) {
             document.getElementById("asb_privatm_content").innerHTML = xmlHttp.responseText;
         }
     };
     xmlHttp.send(null);
 }
}

Ich halte außerdem das Intervall von 5 Sekunden für einen absoluten Overkill. Da würde sich eher long polling anbieten. Außerdem könntest du auch beide Abfrage in eines Stecken. Du brauchst doch nicht alle 5 Sekunden zwei Anfragen zu senden, eine reicht doch.

Edit: Hab nochmal kurz nachgedacht. Das Problem ist folgende Zeile

Javascript:

xmlHttp.onreadystatechange = function () {

Damit überschreibst du eine vorher festgelegte Funktion und nur die neueste wird ausgeführt. Eine Lösung wäre das Zwischenspeichern der vorherigen

Javascript:

var alteFunktion = xmlHttp.onreadystatechange;
xmlHttp.onreadystatechange = function () {
    alteFunktion();
    //neuer Kram....
}

Das führt doch nicht zum Ziel, merke ich gerade :-D. Also entweder zwei verschiedene Request-Objekte benutzen oder eine Anfrage daraus machen.

korsan · 4. Juli 2010

super danke.
habe nun was anderes gefunden das über AJAX Long Polling.
Aber noch ne frage ist es überhaupt gut für den server diese abfragen zu machen vor allem wenn dann mal viele user auf die webseite kommen?
wobei ja ein mysql abfrage allgemein auch abfragen macht.

CPoly · 4. Juli 2010

Ein ajax Request braucht im Allgemeinen weniger Ressourcen als ein "normaler" Seitenaufruf. Das liegt unter anderem daran, dass die Anfrage oft nur eine einzige Aufgabe erfüllt (wenig Rechenaufwand) und es werden nur wenige Daten übertragen. Du musst dir aber die Frage stellen, ob du tatsächlich alle fünf Sekunden überprüfen musst, ob es neue Nachrichten gibt. Ist deine Seite so konzipiert, dass man die Seite auch wirklich mal länger offen lässt?
So lange du aber keine Probleme mit den Ressourcen bekommst, sollte die Lösung in Ordnung sein. Wenn es dann mal problematisch wird, musst du mit den Usern reden und deren Verhalten analysieren, um eventuell das Verfahren anzupassen.

korsan · 4. Juli 2010

es ist eine comunity seite es sollen auch nur die letzten 10-15 einträge aktualisert werden
sowie die online user und halt private messages damit der user sieht ob neue private mitteilung da ist.
ansonsten wird unden ein link gestezt der dann bei bedarf die alten nachrichten aufruft. so sollte es denk ich mir gehen.
wiederum ist es so dass bei dem neuem code in der php detei ein sleep eingebaut ist aber sobald der user den borser aktualiert
die letzen beiträge wieder von vorne galden werden und wider ein paar secunden braucht dass die auf der seite sind.

DeluXe · 4. Juli 2010

korsan hat gesagt.:
wiederum ist es so dass bei dem neuem code in der php detei ein sleep eingebaut ist

Welchen Sinn erhoffst du dir davon?

timestamp · 4. Juli 2010

korsan hat gesagt.:
es ist eine comunity seite es sollen auch nur die letzten 10-15 einträge aktualisert werden
sowie die online user und halt private messages damit der user sieht ob neue private mitteilung da ist.
ansonsten wird unden ein link gestezt der dann bei bedarf die alten nachrichten aufruft. so sollte es denk ich mir gehen.
wiederum ist es so dass bei dem neuem code in der php detei ein sleep eingebaut ist aber sobald der user den borser aktualiert
die letzen beiträge wieder von vorne galden werden und wider ein paar secunden braucht dass die auf der seite sind.

Hi

bitte halte Dich doch an die Netiquette, besonders Punkt 15:

Unser Forum ist kein Chatroom. Kurz-Beiträge ("Ein-Zeilen Postings"), die einfach so ins Forum "geklatscht" werden, werden ohne Vorwarnung von einem Moderator oder Administrator gelöscht. Das gleiche gilt insbesondere für Beiträge, die in Rechtschreibung, Satzbau und Verständlichkeit nicht ein vernünftiges, allgemein übliches und altersgruppen-übergreifendes Niveau erfüllen. Jugendsprache, regional verbreitete Dialekte und durchgehend kleingeschriebene Beiträge sind ebenfalls unerwünscht. Mit anderen Worten: wer erfolgreich die im Deutsch-Unterricht erlernten Kenntnisse praxisnah auf unserem Forum anwenden kann, wird nicht mit dieser Regel in Konflikt kommen. "Wiederholungstäter" werden, nachdem sie zuvor von einem Moderator auf die Mängel hingewiesen wurden, ggf. unbefristet gesperrt.

Viel Spaß noch im Forum

CPoly · 5. Juli 2010

DeluXe hat gesagt.:
Welchen Sinn erhoffst du dir davon?

Er versucht das von mir erwähnt "long polling" umzusetzen.

the client requests information from the server [...] if the server does not have any information available for the client, instead of sending an empty response, the server holds the request and waits for some information to be available. Once the information becomes available (or after a suitable timeout), a complete response is sent to the client. The client will normally then immediately re-request information from the server, so that the server will almost always have an available waiting request that it can use to deliver data in response to an event.

http://en.wikipedia.org/wiki/Push_technology#Long_polling

AJAX-Updates blockieren das Aktualisieren von Nachrichten

korsan

Grünschnabel

CPoly

Mitglied Weizenbier

korsan

Grünschnabel

CPoly

Mitglied Weizenbier

korsan

Grünschnabel

DeluXe

Funkjoker

timestamp

Mitglied Käsekuchen

CPoly

Mitglied Weizenbier

Neue Beiträge