Forum: PC-Programmierung Java Php Auto Reload!


von Werner M (Gast)


Lesenswert?

Hallo und wunderschönen guten Abend.

Ich habe da mal ein Problemchen im bereich Webseite für 
"Steuerungsanwendungen". Also ich möchte eine variable aus einer Datei 
an einen Javascript (jquery mobile) übergeben. Dieses allerdings 
permanent im Sekundentakt c.a.

Zurzeit lade ich in Php die Variable aus der Datei und übergebe diese an 
das Script. Scheinbar gibt es aber in Php keine schleife um diese immer 
wieder geschehen zu lassen ? und in Java gibt es scheinbar nicht die 
Möglichkeit eine Datei zu lesen?

Die Möglichkeit über Timeout die ganze seite neuzuladen finde ich eher 
unschön. Ich habe nicht wirklich Ahnung von Php und co.



Habt ihr eventuell eine idee ?

: Verschoben durch User
von Mark B. (markbrandis)


Lesenswert?

Werner M schrieb:
> Ich habe da mal ein Problemchen im bereich Webseite für
> "Steuerungsanwendungen". Also ich möchte eine variable aus einer Datei
> an einen Javascript (jquery mobile) übergeben. Dieses allerdings
> permanent im Sekundentakt c.a.

Wie muss man sich das vorstellen: Wird die Datei einmal pro Sekunde 
geöffnet, der bestehende Wert in ihr wird überschrieben, und dann wird 
sie wieder geschlossen? Oder ist sie zur Laufzeit vielleicht gar 
permanent geöffnet und es werden immer wieder neue Werte 
reingeschrieben, also eine Art Logfile?

> Zurzeit lade ich in Php die Variable aus der Datei und übergebe diese an
> das Script. Scheinbar gibt es aber in Php keine schleife um diese immer
> wieder geschehen zu lassen ?

Es gibt die üblichen Arten von Schleifen in PHP, also for, while, etc.

Was Du aber vielleicht eher meinst, sind Events bzw. Timer. Auch die 
gibt es in PHP:
http://www.php.net/manual/en/class.event.php
http://www.php.net/manual/en/class.evtimer.php

Du könntest also einen Timer laufen lassen, der einmal pro Sekunde ein 
Event auslöst. Daraufhin könnte man dann die Datei lesen, und mit dem 
erhaltenen Wert auch eine HTML-Seite generieren. In dieser stünde der 
Wert dann einem wie auch immer gearteten JavaScript-Code zur Verfügung.

Die Frage ist nun, ob diese Vorgehensweise überhaupt sinnvoll ist ;-)

Wie so oft gilt: Beschreibe nicht Deinen bisher gewählten Ansatz, denn 
der kann völliger Murks sein. Beschreibe lieber, was Deine Anwendung 
eigentlich wirklich machen soll, und was der Sinn dahinter ist.

Vielleicht magst Du Dir mal JSON anschauen:
http://de.wikipedia.org/wiki/JSON

> und in Java gibt es scheinbar nicht die Möglichkeit eine Datei zu lesen?

Natürlich gibt es in Java diese Möglichkeit. In JavaScript aber nicht, 
und das muss auch so sein. Überleg mal, Du würdest eine beliebige 
Website besuchen und der von dort geladene JavaScript-Code könnte 
beliebig Dateien auf Deiner Festplatte auslesen oder verändern! Das 
willst Du nicht wirklich ;-)

von Mark B. (markbrandis)


Lesenswert?

Man könnte das wohl mit AJAX machen. Nein, ist kein Scheuermittel... 
sondern in dem Fall wohl ein Steuermittel :-)

http://stackoverflow.com/questions/20125763/ajax-reload-every-10-seconds
http://stackoverflow.com/questions/5681380/refresh-a-table-with-jquery-ajax-every-5-seconds

von c.m. (Gast)


Lesenswert?

Mark Brandis schrieb:
> Man könnte das wohl mit AJAX machen.

zustimm. ajax wurde extra dafür gebaut einzelne elemente einer seite mit 
neuen daten vom server aufzufrischen ohne die gesamte seite neu zu 
laden.

1. imho sollte der TO verstehen das es sich beim http-protokoll um eine 
stateless verbindung handelt - man macht einen tcp-port auf, holt sich 
die daten (html-seite vom server), und schließt die tcp-verbindung 
wieder. aus.
2. der server kann keine daten zum client senden ohne das der client sie 
vorher angefordert hat.
3. es gibt tricks und kniffe um die punkte 1 und 2 zu umgehen - ajax ist 
einer davon, "sessions" im allgemeinen ein weiterer.

oh und java != javascript ;)

von Frank (Gast)


Lesenswert?

AJAX wäre schon das Richtige, aber wenn man sich damit auf die Schnelle 
nicht auseinandersetzen will, der kann sich mit einem (unsichtbaren) 
iFRame behelfen, dessen Inhalt (Textfeld) sich per Metatag aktualisiert

<meta http-equiv="refresh" content="1">

Im Code der sichtbaren Seite holt sich dann ein Javascript-Timer diese 
Daten über einen DOM-Zugriff aus dem iFrame ...

von Rufus Τ. F. (rufus) Benutzerseite


Lesenswert?

Werner M schrieb:
> Zurzeit lade ich in Php die Variable aus der Datei und übergebe diese an
> das Script. Scheinbar gibt es aber in Php keine schleife um diese immer
> wieder geschehen zu lassen ? und in Java gibt es scheinbar nicht die
> Möglichkeit eine Datei zu lesen?

Falscher Ansatz.
Nicht der Server sendet zyklisch die Daten an den Client (Browser), 
sondern der Client holt sich zyklisch die Daten vom Server.

Dafür wurde AJAX erfunden, und jQuery als Framework nimmt einem einiges 
der Arbeit ab, das in Javascript "von Hand" mit XMLHttpRequest selbst zu 
machen, wobei auch das keine Raketenwissenschaft ist.

von c.m. (Gast)


Lesenswert?

http://www.w3schools.com/xml/xml_http.asp

das hilft vielleicht weiter.

von Werner M (Gast)


Lesenswert?

Klaar XMLHttpRequest da hätt ich auch drauf kommen können. das Klappt 
schonmal teilweise. Allerdings funkt mir der Browser cache dazwischen.
Zumindest beim Iexplorer und beim Opera Google geht wunderbar.

Dieses Problem hatte ich schonmal das konnte man irgendwie umgehen. Ich 
meine mich schwach zu errinnern das das sogar ganz einfach war ?!
LG

von Mladen G. (mgira)


Lesenswert?

Werner M schrieb:
> Dieses Problem hatte ich schonmal das konnte man irgendwie umgehen. Ich
> meine mich schwach zu errinnern das das sogar ganz einfach war ?!

Das hier kann gehen, muss aber nicht immer:
http://ajaxpatterns.org/XMLHttpRequest_Call#How_will_caching_be_controlled.3F

Was immer geht aber etwas unschoen ist, ist ein zufaelliges 
Schluessel-/Wertpaar and die URL als GET Parameter zu haengen, um so dem 
Browser zu sagen "das ist jetzt was neues".

Nebenbei, je nachdem wieviel Aufwand du reinstecken willst, kannst du 
anstatt einem Pull Model auch ein Push Model verwenden mit AJAX, d.h. 
der Browser fragt nicht staendig den Server ob es was neues gibt, 
sondern der Server "sagt" dem Browser wenn es etwas neues gibt indem er 
ihm einfach neue Daten schickt. Dazu koenntst du mal nach "Reverse AJAX" 
oder "Comet" Googeln.

: Bearbeitet durch User
von Daniel F. (df311)


Lesenswert?

zwei möglichkeiten um das cache-problem zu umgehen/reduzieren/lösen:

1. z.b. jquery bietet die möglichkeit, den cache für ajax-calls zu 
deaktivieren (und vereinfacht so nebenbei auch noch den js-code).
1
var int = window.setInterval(function() {
2
  $.ajax({
3
    url: http://localhost/ajax.php,
4
    data: '_get=data',
5
    success: function(data) {
6
      $('#display').html(data);
7
    }
8
  });
9
}, 500);
nur schnell runtergeschrieben, ohne garantie dass die optionen alle 
stimmen oder ob noch ein/zwei fehlen

2. das script, das die daten zurückliefert kann (zusätzlich) einen 
do-not-chache header schicken und ein last-modification-date irgendwann 
in der vergangenheit

von Werner M (Gast)


Lesenswert?

Ich habs jetzt. nur ob das alles so richtig is kann ich nicht sagen. Ist 
sicher auch kein schöner Code. Wie gesagt ich habe eignetlich keine 
Ahnung was ich da mache :)
1
<!DOCTYPE html>
2
<html>
3
<head>
4
  <meta charset="utf-8">
5
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
6
  <meta name="apple-mobile-web-app-capable" content="yes">
7
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
8
  <title>abc</title>
9
  
10
  
11
  <link rel="stylesheet" h ref="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.css">
12
  
13
  <!-- Extra Codiqa features -->
14
  <link rel="stylesheet" h ref="codiqa.ext.css">
15
  
16
  <!-- jQuery and jQuery Mobile -->
17
  <script src="https://d10ajoocuyu32n.cloudfront.net/jquery-1.9.1.min.js"></script>
18
  <script src="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
19
20
  <!-- Extra Codiqa features -->
21
  <script src="https://d10ajoocuyu32n.cloudfront.net/codiqa.ext.js"></script>
22
23
24
25
26
<script>
27
var xmlhttp;
28
function loadXMLDoc(url,cfunc)
29
{
30
  xmlhttp=new XMLHttpRequest();
31
xmlhttp.onreadystatechange=cfunc;
32
xmlhttp.open("Post",url,true);
33
xmlhttp.send();
34
}
35
36
37
38
39
40
41
function timer() 
42
{ 
43
setTimeout("myFunction()", 1000) 
44
}
45
46
function myFunction() 
47
{
48
loadXMLDoc("counter.txt",function()
49
  {
50
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
51
    {
52
    $va = xmlhttp.responseText;
53
$('#test1').val($va);
54
$('#test1').slider('refresh');
55
56
    }
57
  });
58
59
timer("");
60
61
}
62
63
64
65
window.onload = myFunction();
66
</script>
67
68
69
</head>
70
71
<body>
72
    
73
      <!-- Home -->
74
      <div data-role="fieldcontain" data-controltype="slider">
75
        <label for="Id2">test1 </label> <input id="test1" type="range" name="slider" value="44" min="0" max="100" data-highlight="false"></div>
76
      <div data-role="fieldcontain" data-controltype="slider">
77
        <label for="Id1">test2 </label> <input id="test2" type="range" name="slider" value="50" min="0" max="100" data-highlight="false"></div>
78
      <p>
79
80
    <p></p>
81
  </body>
82
</html>
83
84
85
86
<script>
87
88
$(document).ready(function(){
89
  $('#test1').on('slidestop',function(){
90
91
92
      $('#test2').val($('#test1').slider().val());
93
      $('#test2').slider('refresh');
94
95
96
  $.ajax({
97
      url: '/s2/counter.php?number='+$('#test1').slider().val()
98
99
    });
100
    
101
  });
102
103
});
104
105
</script>


P.s. Der Beitrag scheint Spam zu enthalten: "h ref="

von Frank (Gast)


Lesenswert?

Wird beim Verweis auf extrene Libs in Javascript immer die desamte Datei 
heruntergeladen oder nur die aufgerufenen Funktionen? Ist das nicht - 
gerade bei Mobilgeräten - suboptimal?

von Rufus Τ. F. (rufus) Benutzerseite


Lesenswert?

Frank schrieb:
> Wird beim Verweis auf extrene Libs in Javascript immer die desamte Datei
> heruntergeladen

Natürlich.

> oder nur die aufgerufenen Funktionen?

Der Overhead, das zu verwalten, wäre ... beträchtlich.


Javascript-Libraries sind allerdings i.d.R. ziemlich kompakt, jquery 1.8 
beispielsweise ist knapp 270 kByte groß.

Üblicherweise wird so etwas im Cache des Browsers gespeichert, so daß 
das auch bei mobiler Anwendung nicht allzusehr ins Gewicht fällt.

Für die Minimalanwendung mit XMTHttpRequest & Co. ist allerdings kein 
jQuery erforderlich.

von Daniel F. (df311)


Lesenswert?

da du jquery sowieso lädst, kannst du den teil
1
var xmlhttp;
2
function loadXMLDoc(url,cfunc)
3
{
4
  xmlhttp=new XMLHttpRequest();
5
xmlhttp.onreadystatechange=cfunc;
6
xmlhttp.open("Post",url,true);
7
xmlhttp.send();
8
}
9
10
function timer() 
11
{ 
12
setTimeout("myFunction()", 1000) 
13
}
14
15
function myFunction() 
16
{
17
loadXMLDoc("counter.txt",function()
18
  {
19
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
20
    {
21
    $va = xmlhttp.responseText;
22
$('#test1').val($va);
23
$('#test1').slider('refresh');
24
25
    }
26
  });
27
28
timer("");
29
30
}
31
32
window.onload = myFunction();
auch kürzer schreiben (und in die document.ready() integrieren):
1
var interval; // mit der variable kann das interval wieder beendet werden
2
3
$(document).ready(function(){
4
  $('#test1').on('slidestop',function(){
5
    $('#test2').val($('#test1').slider().val());
6
    $('#test2').slider('refresh');
7
8
    // hier wird nur ein zähler an ein counter-script übergeben?
9
    $.ajax({
10
      url: '/s2/counter.php?number='+$('#test1').slider().val()
11
    });
12
  });
13
  
14
  interval = window.setInterval(function() {
15
    $.ajax({
16
      url: 'counter.txt',
17
      success: function(data) {
18
        $('#test1').val(data);
19
        $('#test').slider('refresh');
20
      }
21
    });
22
  }, 1000);
23
});

ich habe jetzt nicht nachgesehen was .slider() ist/macht bzw. wofür das 
codiqa-plugin verwendet wird. im großen und ganzen sollte der refresh 
aber so funktionieren.

Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.