中央控制計時器使用PHP任何jQuery或WebSocket或node.js

我想設計中央控制計時器與PHP和任何其他客戶端腳本。中央控制計時器使用PHP任何jQuery或WebSocket或node.js

enter image description here

需要牢記的基本的東西是：計時器將在我的網站上看到，所以可能是當前的用戶百登錄我公司網站。現在每當管理員重置計時器在同一點上它應該反映到所有的客戶機。所以基本是需要保持同步定時全部機器。

我做什麼

我已經使用了客戶端倒計時（http://keith-wood.name/countdown.html）和背景我呼籲每一秒阿賈克斯檢查復位是否被按下。但問題是它的在所有客戶端機器中不保持同步。兩臺機器之間的一段時間間隔是否被標記。如何實現它？

代碼：

$('#shortly').countdown({until: shortly, 
    onExpiry: liftOff, onTick: watchCountdown}); 

$('#shortlyStart').click(function() { 
    shortly = new Date(); 
    shortly.setSeconds(shortly.getSeconds() + 5.5); 
    $('#shortly').countdown('option', {until: shortly}); 
}); 

function liftOff() { 
    alert('We have lift off!'); 
} 

function watchCountdown(periods) { 
    $('#monitor').text('Just ' + periods[5] + ' minutes and ' + 
     periods[6] + ' seconds to go'); 
}

來源

2014-10-30 Er.KT

爲什麼不重新發送過期時間戳，那麼你的客戶可以做數學計算，不管何時它意識到需要重置，它可以基於JavaScript中的本地時鐘設置計時器。 – Andy 2014-10-30 12:27:51

timerset.php。這個文件創建服務器端的文件，以推動完成時間。

<?php 
$year=htmlspecialchars($_GET['year']); 
$month=htmlspecialchars($_GET['month']); 
$day=htmlspecialchars($_GET['day']); 
$hour=htmlspecialchars($_GET['hour']+2);//NBNBNB the +2 changes according to YOUR timezone. 
$minute=htmlspecialchars($_GET['minute']); 
$second=htmlspecialchars($_GET['second']); 

$timestring=$year.":".$month.":".$day.":".$hour.":".$minute.":".$second; 
echo $timestring."<br/>"; 
$filename = 'timerserver.php'; 
$file = fopen($filename, 'w'); 
rewind($file); 
fwrite($file,"<?php\n"); 
fwrite($file, "header('Content-Type: text/event-stream');\n"); 
fwrite($file, "header('Cache-Control: no-cache');\n"); 
fwrite($file, "header('connection:keep-alive');\n"); 
fwrite($file, "\$starttime=\"$timestring\";\n"); 
fwrite($file, "echo \"data:{\$starttime}\\n\\n\";\n"); 
fwrite($file, "ob_flush();"); 
fwrite($file,"flush();"); 
fwrite($file,"sleep(3);"); 
fwrite($file,"?>\n"); 
fflush($file); 
ftruncate($file, ftell($file)); 
fclose($file); 
flush(); 
?>

timer.php。該文件接收完成時間並更新顯示的時間。

<html> 
<header> 
</header> 
<body> 
<script> 

var source = new EventSource("timerserver.php"); 
var mystarttime="00:00"; 

source.onmessage = function(event) 
{ 
    mystarttime=event.data; 
}; 

setInterval(function() {test(mystarttime)}, 1000); 

function test(intime) 
{ 
    var timestring=intime; 
    var split = timestring.split(':'); 

    var currentdate=new Date(); 
    var finishtime=new Date(split[0],split[1]-1,split[2],split[3],split[4],split[5],0); 

    var timediff=new Date(finishtime-currentdate); 

    var year=timediff.getUTCFullYear(); 
    var minutes=timediff.getUTCMinutes(); 
    var seconds=timediff.getUTCSeconds(); 
    var currentMinutes = ("0" + minutes).slice(-2); 
    var currentSeconds = ("0" + seconds).slice(-2); 
    if (year<1970) 
    { 
     document.getElementById("result").innerHTML="Time is up" 
    } 
    else 
     document.getElementById("result").innerHTML = currentMinutes+":"+currentSeconds; 
} 
</script> 
<div id="result">Fetching time...</div> 
</body> 
</html>

timerform.php。一種更新時間的方法。

<?php 
echo "<b>NB : Time is in UTC Timezone</b><br/><hr/>"; 
date_default_timezone_set("UTC"); 
$currentdatetime=date("Y-m-d H:i:s"); 
$year=date("Y"); 
$month=date("m"); 
$day=date("j"); 
$hour=date("H"); 
$minute=date("i"); 
$second=0; 
echo $currentdatetime."<hr/>"; 
?> 
<form action="timerreset.php" method="GET"> 
Year <input name="year" value="<?php echo $year;?>"/><br/> 
Month <input name="month" value="<?php echo $month;?>"/><br/> 
Day <input name="day" value="<?php echo $day;?>"/><br/><br/> 
Hour <input name="hour" value="<?php echo $hour;?>"/><br/> 
Minute <input name="minute" value="<?php echo $minute+1;?>"/><br/> 
Second <input name="second" value="<?php echo $second;?>"/><br/> 
<input type="submit"/> 
</form> 
<?php 
flush(); 
?>

NB，使用UTC時間，以滿足在不同的時區不同的客戶端。

我有上面的代碼在我的本地主機（Windows）和SouthCoastHosting（Linux）上工作，所以讓我知道你是否有任何問題。

要使用它打開一個選項卡到southcoasthosting.com/timer/timerform.php和另一個選項卡到southcoasthosting.com/timer/timer.php。使用計時器窗體來更改結束時間，您將在timer.php中看到時間變化。由於EventSource的性質，在更新定時器之前總是會有最多3秒的延遲。根據您的客戶端與服務器的連接速度，可能會有進一步的延遲。我選擇發送完成時間，以便客戶不會因這些延遲而滯後。

我希望一切都有道理。否則讓我知道。

來源

2014-11-10 13:54:50

嗨timerserver.php在哪裏？ – 2014-11-12 10:25:11

timerserver.php是由'timerset.php'創建的。 – 2014-11-12 10:46:53

演示效果很好，現在我們在這裏添加了3秒的延遲，如果我將它刪除，它會在每秒執行一次，那麼如何才能執行它的微妙差距呢？ – 2014-11-14 06:50:54

試試這個，使用HTML5的服務器端事件。

<?php 
header('Content-Type: text/event-stream'); 
header('Cache-Control: no-cache'); 

$reset = "true"; 
echo "data: reset: {$reset}\n\n"; 
flush(); 
?>

在服務器上

，並

<script> 
var source = new EventSource("gsim_server.php"); 
source.onmessage = function(event) 
{ 
    document.getElementById("result").innerHTML = event.data; 
}; 
</script> 
<div id="result">test</div>

在客戶端上

（asuming服務器文件是在同一個文件夾中，被稱爲「gsim_server.php」，這僅僅是一個基本的例子，但你可以使用通過值據此決定是否恢復或沒有。希望有所幫助。

來源

2014-11-03 06:07:53

它真的哇，我已經在https://www.websocket.org/echo.html上查看過一個演示，但我仍然不確定如何使用它，請分享一下定時器的任何演示程序？使用小提琴什麼的？ – 2014-11-03 06:16:33

嗯，大故事。我以前做過這個，但不能爲我的生活找到源代碼。所以......我正在編輯我的答案。（評論太短） – 2014-11-03 12:24:25

如何在客戶端傳遞任何值到服務器？ – 2014-11-07 13:17:02

中央控制計時器使用PHP任何jQuery或WebSocket或node.js

回答

相關問題