Refresh ohne "Flackern"

« 06.04.06, 18:28:16 »

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

« 07.04.06, 12:13:49 »

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

« 07.04.06, 12:34:40 »

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
JoSsiF

« 07.04.06, 21:10:55 »

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

Code: [Auswählen]

<?php//Cachen der Seiteninhalte verhindernheader("Expires: Sun, 31 Dec 1999 23:59:59 GMT"); //Irgend ein Datum in der Vergangenheitheader("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 verhindernIgnore_User_Abort(1); //Abbruch des Benutzers verhinderninclude "../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

« 07.04.06, 21:32:03 »

Danke

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

« 07.04.06, 22:17:05 »

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.

Code: [Auswählen]

<?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);?>

« 08.04.06, 11:58:35 »

ich glaub auch dass du da was falsch verstanden hast,

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

Der wichtigste Code ist

Code: [Auswählen]

//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

Code: [Auswählen]

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

Code: [Auswählen]

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

Code: [Auswählen]

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

« 08.04.06, 13:27:57 »

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

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

Refresh ohne "Flackern"

Antworten zu Refresh ohne "Flackern":