Computerhilfen.de Logo
Forum
Tipps
News
Frage stellen

Refresh ohne "Flackern"

Servus,

ich bin ja grad an einem Gemeinschaftprojekt dran, hab mal damit angefangen mit decla einen Chat zu programmieren, nachdem er mich darauf angesprochen hatte.

Soweit klappt das auch alles, nur beim Refresh häng ich grade dran. So werden gerade alle drei Sekunden die beiden Iframes neu geladen per meta-refresh. Nur gibt das dann immer so ein störendes Flackern auf dem Bildschirm. Wenn man sich z.B. den Computerhilfen-Chat anschaut, der Flackert ja gar nicht bis auf eine kurze Meldung in der Statusleiste.

Gibt es denn da sinnvolle Alternativen zu dem Refresh oder kann man das irgendwie so hinbasteln, dass das Flackern minimiert wird? Am Besten wäre natürlich eine Lösung, dass nur der PHP-Teil ausgeführt wird, der prüft, ob die Datei inzwischen verändert wurde und wenn nicht, dann "schläft" er wieder für 3 Sekunden.

Außerdem bin ich grade dabei eine gescheite Userliste zu programmieren, ich wusste keine andere Möglichkeit, zu erkennen, ob ein User noch da ist, als dass alle 3 Sekunden die aktuell Unix-Zeit des Users eingetragen wird und gleichzeitig alle anderen überprüft werden. Wenn ein Eintrag älter als 10 Sekunden ist, dann wird der User aus der Liste gelöscht. Dann muss aber die Performance und die Serverauslastung sehr darunter leiden, weil ja alle drei Sekunden die Textdatei geöffnet und ausgelesen und beschrieben werden muss.

Das ganze soll übrigens wirklich vorerst nur für Textdateien ausgelegt sein, damit kann man besser Backups von den Logs machen und man hat eine schnellere Übersicht.

Hier eine Betaversion vom sChat

Antworten zu Refresh ohne "Flackern":

Ich würde dir eher vorschlagen, ein Channel in einem IRC-Netzwerk zu registrieren, und dann den Zugriff über ein Javaaplett zu realisieren. (ich benutze http://www.pjirc.com/ mit dem Php Frontend, zu finden in den downloads)
Ist einfacher, php eignet sich einfach dafür nicht sehr gut. (frontends ja, aber eigener Chat, nicht wirklich).

Femaref

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Hi Schwoebel |

Zum Flackern: ich hab das ja jetzt nich gesehen, was da so abgeht. Aber ich schätze mal, das Flackern tritt auf, weil der iFrame neu geladen wird und damit kurze Zeit der Hintergrund verschwindet.
Mögliche Lösung: setze den Hintergrund für den iFrame im HTML-File, wo der iFrame eingebettet ist, genauso, wie im iFrame selbst. Damit bleibt beim Reload zumindest der Hintergrund konstant.

Aber was sagt uns das? PHP und JavaScript sind für einen Chat mit Sicherheit nicht der Weisheit letzter Schluss, so wie das Femaref auch schon erwähnt hat.
IRC ja oder nein, eine Lösung per Java-Applet (und optimalerweise zugehörigem Servlet) wäre sicherlich nicht schlecht, es fehlt nur an günstigen Webhostern dafür.
Habs zwar noch nicht probiert, aber eine Lösung über Ajax könnte ich mir auch gut vorstellen. Und dafür würd ja unter Umständen PHP-Hosting ausreichen ;)

greez 8)
JoSsiF

He ho Schwoebel

Also ich habe mich schon länger mal mit einem Chat beschäfftigt, ich rate grundsätzlich von meta refresh chats ab.

Meine Lösung, serverseitig mit PHP

<?php

//Cachen der Seiteninhalte verhindern
header("Expires: Sun, 31 Dec 1999 23:59:59 GMT"); //Irgend ein Datum in der Vergangenheit
header("Cache-Control: no-cache, must-revalidate");
header("Pragma: no-cache");
header("Connection: keep-alive");                 
flush
(); //Immer Daten flushen sonst werden sie ned angezeigt
?>

<html>
<head>
<meta http-equiv="pragma" content="No-Cache">
<title>Chat</title>
<script language="javascript">
scrolling = true;
function move()
{
if(scrolling)
{
window.scrollTo(1, 500000);
}
}
window.setInterval("move();", 500);
function rel()
{
window.open("chat.php?time=<?php if(!isset($_GET[&#39;time&#39;])){ print mktime(); } else {print $_GET[&#39;time&#39;];}?>;
location.reload();
}
setTimeout("rel()", 180000); //Zeit bis zum Reload, musst ausprobieren
</script>
</head>
<body bgcolor="#FFB904" onLoad='rel();' onError='rel();' onMouseOver="scrolling = false" onMouseOut="scrolling = true">
<?php 
Flush
();

Set_Time_Limit(0); //Timeout von PHP verhindern
Ignore_User_Abort(1); //Abbruch des Benutzers verhindern

include "../Connection.php";
include 
"../PASS.php";
$conn_id sql_connect ($RMDATABASE ,$RMSERVER$RMUSER $RMPASS);


if(isset(
$_GET[&#39;time&#39;]))
{
$time $_GET[&#39;time&#39;];
}
else
{
$time mktime()-1;
}


$zah 0;
$ID 0;
$MaxEntries 100;

While(!
Connection_Aborted()) { //Nur Abbrechen wenn Benutzer abbricht
   print "\n"//Ein Zeichen senden, damit der Browser nicht abbricht
   Flush(); //Wieder flushen
   $res mysql_query("SELECT COUNT(ID) FROM `chat` WHERE `Time` > &#39;$time&#39;");
   $tmp mysql_fetch_row($res);
   $rows $tmp[0];
   $from $rows $MaxEntries;
   if($from 0){$from 0;}
   $to $MaxEntries;
   
   if
($ID == 0)
   {
    $result mysql_query("select Message, Time, Color, Mode, User, UserID, ID from chat where Time > &#39;$time&#39; order by Time Limit $from$to;");

   }
   else
   
{
    $result mysql_query("select Message, Time, Color, Mode, User, UserID, ID from chat where ID > &#39;$ID&#39; order by Time Limit $from$to;");
   }
   Echo mysql_error();
   While($message mysql_fetch_row($result)) 
   {
    $User $message[4];
if($message[3] == "l")
{
print "\n<br>\n$User hat sich angemeldet.";
}
else if ($message[3] == "n")
{
print ("\n<br>\n"$User . &#39; schreibt: <font color="&#39;. $message[2] . &#39;">&#39;. $message[0] . &#39;</font>&#39;);
}
else if ($message[3] == "s")
{
print (&#39;\n<br>\n&#39;. $User . &#39; schreibt: <font color="&#39;. $message[2] . &#39;" size=3><b>&#39;. $message[0] . &#39;</b></font>&#39;);
}
    Flush();
    $time $message[1];
$ID $message[6];
   
 
sleep(1); //Warten, da sonst die Serverbelastung zu hoch wird
 
$zah++;
}

?>

</body>
</html>

Bissal lang aber schaus dir an

MFG
BWA

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button
Danke :D

der Metarefresh war ja auch eher eine "Notlösung" solange ich noch keine andere Möglichkeit gefunden hatte. Werd mir aber mal dein Beispiel anschauen und hoffentlich was lernen dabei ;D

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button
Ich weiß nicht.. Entweder bin ich zu doof um das zu verstehen oder das muss man in einem anderen Zusammenhang benutzen.

Ich hab mal das eingebaut, was wohl mit dem Refreshen zusammenhängt, allerdings funktioniert das nicht so richtig wie ich mir das vorgestellt habe. Das mit dem "setTimeout" funktioniert erstmal gar nicht, da ist es egal was für einen Wert ich eingebe, die Seite wird gleich neu geladen... und das einzige Kriterium, woran ich festmachen kann, wie lange es dauern soll, bis die Seite "refreshed" werden soll ist das Sleep ganz am Ende.

Und so ist das Refreshen noch "nerviger" als vorher und dauert auch länger. Es soll direkt main.php#bottom geladen werden, die Seite läd aber erst ganz normal und springt dann manchmal zu #bottom und manchmal auch nicht.. :-/

Zur Erklärung:
$Eintrag[0] ist das Datum zum Zeitpunkt des Eintrags
$Eintrag[1] ist der Nickname
$Eintrag[2] ist die Farbe und
$Eintrag[3] ist schließlich die Message.


<?php

//Cachen der Seiteninhalte verhindern
header("Expires: Sun, 31 Dec 1999 23:59:59 GMT"); //Irgend ein Datum in der Vergangenheit
header("Cache-Control: no-cache, must-revalidate");
header("Pragma: no-cache");
header("Connection: keep-alive");                 
flush(); //Immer Daten flushen sonst werden sie ned angezeigt
?>


<html>
<head>

<script language="javascript">
scrolling = true;

function move()
{
if(scrolling)
{
window.scrollTo(1, 500000);
}
}

window.setInterval("move();", 500);

function rel()
{
window.location.reload();
}

setTimeout("rel()", 180000); //Zeit bis zum Reload, musst ausprobieren
</script>


<? $datum = date('d. F', time()); ?>

<style type="text/css">
body
{
background: #363636;
color: #FFFFFF;
font-family: Lucida Console;
font-size: 0.8em;
margin: 1.5em;
padding: 0px;
}
table
{
font-size: 1em;
}
td
{
vertical-align: top;
}
pre
{
font-family: Lucida Console;
width: 200px;
display: inline;
}
</style>

</head>
<body onload="rel();" onMouseOver="scrolling = false" onMouseOut="scrolling = true">

<table cellpadding="2" cellspacing="0" border="0" style="width: 75%">
<colgroup>
<col width="20px;">
<col width="25%">
<col width="75%">
</colgroup>

<?php

$timestamp time();
$date date(&#39;d.m.y&#39;, $timestamp);


$file = @file(&#39;log.txt&#39;);
$max count($file);
 
for($a 0$a $max$a++)
{
$Eintrag explode(&#39;|&#39;, $file[$a]);

if($Eintrag[0] == $date)
{
$Eintrag[3] = str_replace("\r\n", &#39;&#39;, $Eintrag[3]);

if($Eintrag[1]==&#39;System&#39;)
{
$vorzeichen = &#39;<span style="color: #FFCC00;">&raquo;</span>&#39;;
$Eintrag[1] = &#39;&#39;;
}
else if($Eintrag[1]==&#39;Barkeeper&#39;)
{
$vorzeichen = &#39;<span style="color: #9999FF;">&raquo;</span>&#39;;
$Eintrag[1] = &#39;<span style="color: #9999FF;">Barkeeper</span>&#39;;
}
else
{
$vorzeichen = &#39;&raquo;&#39;;
}

flush();

Set_Time_Limit(0); //Timeout von PHP verhindern
Ignore_User_Abort(1); //Abbruch des Benutzers verhindern
?>

<tr>
<td><?=$vorzeichen;?></td>
<td><b><?=$Eintrag[1];?></b></td>
<td><span style="color: <?=$Eintrag[2];?>"><?=$Eintrag[3];?></span></td>
</tr>
<?
}
}
?>
</table>

<a name="bottom"></a>

</body>
</html>
<?php
sleep(3);
?>

ich glaub auch dass du da was falsch verstanden hast,

die javascriptfunktion rel() oder relo() ist nur zu not da.

Der wichtigste Code ist

//Cachen verhindern
Set_Time_Limit(0); //Timeout von PHP verhindern
Ignore_User_Abort(1); //Abbruch des Benutzers verhindern

While(!Connection_Aborted()) { //Nur Abbrechen wenn Benutzer abbricht

//Zeichen senden damit Browser kein Verbindungstimeout meldet
print "\n"; \\Zeichen wird vom Browser ignoriert optional " " oder "\t"
flush(); //Daten an den Client senden

//Deine Beiträge rausschreiben
flush(); //Daten an den Client senden

sleep(1) //oder auch usleep(...) --> geht ziemlich auf die Serverperfomance
}

Der wichtigste Bestandteil ist wohl die
While(!Connection_Aborted())

Die Schleife läuft so lange, bis der Benutzer die Verbindung unterbricht, oder das Verbindungstimeout des Browsers überschritten wird.

Noch ein wichtiger Bestandteil ist
print"\n";
flush();

Die dient dazu, dass der Webbrowser die Verbindung nicht abbricht, denn wenn ein webbrowser längere Zeit keine Daten vom Server erhält bricht er die Verbindung ab, darum schreiben wir ihm jede Sekunde ein zeichen, welches er vollkommen ignoriert

sleep(1)
Dies veranlasst den Server dazu die Schleife für 1 Sekunde zu unterbrechen, wenn du dass nicht hättest würde die Last auf dem Server zu groß werden.

Im grunde genommen würde der Chat vollkommen ohne javascript funktionieren, jedoch ein Browser bricht schließlich doch nach einiger Zeit die Verbindung ab, darum solltest du nach einiger Zeit doch einen Refresh vornehmen, dies musst du ausprobieren, damit du den Refresh vor dem Browsertimeout machst, denn sonst bekommst du z.B. vom FireFox die Meldung "Dokument enthält keine Daten".

Noch zum rel() im onload des Body tags, kannst du eigentlich rauslassen, das diente dazu, dass beim IE wenn die Seite "geladen" (d.h. die Verbindung beendet wurde meist Timeout), die Seite neu geladen wird.

Also ich hoffe ich habs dir etwas klarer gemacht.

MFG
BWA
« Letzte Änderung: 08.04.06, 12:00:58 von BWA »

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button
Achso.. ja den Teil in der "Mitte" hab ich eher rausgelassen, weil da gings um Datenbank-technische Sachen und mein Chat basiert ja auf Textdateien.

Dann werd ich mal schaun, wie ich das richtig einbaue :)

« BilderwechselOutloo Express verweigert e-mail Versandt mit neuer DSL-Leitung »
 

Schnelle Hilfe: Hier nach ähnlichen Fragen und passenden Tipps suchen!

Fremdwörter? Erklärungen im Lexikon!
Snapchat
SnapChat ist eine kostenlose Messaging-App, mit der - ähnlich wie bei WhatsApp oder dem Facebook Messenger - Nachrichten an andere Personen oder Gruppen gesendet wer...

Bildschirmschoner
Der eigentliche Sinn des Bildschirmschoners ist, den Bildschirm vor dem Einbrennen des Monitorbildes zu schützen.Während das bei neueren Monitoren (außer ...

Bildschirm
Der Bildschirm, Monitor oder das Display ist das Gerät, auf dem die grafische Ausgabe des Computere zu sehen ist. Bei den aktuellen Flachbildschirmen gibt es die &au...