I want to refresh an HTML page every hour automatically in the background. I was thinking about using PHP but I'm not sure what if that's possible.
This is all the I have:
<meta http-equiv="refresh" content="3600" >
But this doesn't refresh automatically in the background. How can I do this? If this is possible in PHP and a cron job please let me know (with code preferably). Thank you.
You can use javascript setInterval();
<script>
$(document).ready(function(){
setInterval(function(){ reload_page(); },60*60000);
});
function reload_page()
{
window.location.reload(true);
}
</script>
Try this :
<?php
$page = $_SERVER['PHP_SELF'];
$sec = "3600";
?>
<html>
<head>
<meta http-equiv="refresh" content="<?php echo $sec?>;URL='<?php echo $page?>'">
Refer to this answer https://stackoverflow.com/a/19807718/6390490
Refresh document every 300 seconds using HTML Meta tag
EDIT: for background you have to use ajax something like this https://stackoverflow.com/a/25446696/6390490
function loadlink(){
$('#links').load('test.php',function () {
$(this).unwrap();
});
}
loadlink(); // This will run on page load
setInterval(function(){
loadlink() // this will run after every 5 seconds
}, 5000);
for server side refreshing use
header("Refresh: 300;url='http://thepage.com/example'");//set time here as per your need
Related
I want to create a real-time log for my website.
A PHP script gets the content from data/log.txt and echoes it. Then the same process gets repeated every second via JavaScript.
I use this code to test it but have a few problems:
<html>
<head>
<title></title>
<script type="text/javascript">
window.onload = startInterval();
function startInterval()
{
setInterval("loadLog();",1000);
}
function loadLog()
{
document.getElementById('log').innerHTML = "<?php
$datei=fopen("data/log.txt","r");
while(!feof($datei))
{
$zeile = fgets($datei,1000);
echo $zeile."<br>";
}
fclose($datei);
?>";
}
</script>
</head>
<body>
Javascript refresh:<br>
<div id="log"></div>
</body>
</html>
Testing PHP seperatly:<br>
<?php
$datei=fopen("data/log.txt","r");
while(!feof($datei))
{
$zeile = fgets($datei,1000);
echo $zeile."<br>";
}
fclose($datei);
?>
The PHP snippet by itself works great. But I can't seem to get the JavaScript part to work...
Problem 1:
When I change the content of log.txt the JavaScript part does not refresh itself as I would expect. I'm a beginner with JavaScript so I might have made some obvious mistakes or have a wrong idea how I should do it.
Problem 2:
As long as log.txt consist of only one line the output works:
Javascript refresh: test1
Testing PHP separately: test1
But as soon as I add an even empty line the JavaScript part doesn't load anything.
With the help of the comments on my initial question I came up with the following code wich works great:
<html>
<head>
<title></title>
<script src="resources/javascript/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
setInterval(function(){
$('#log').load('loadlog.php');
}, 2000) /* time in milliseconds (ie 2 seconds)*/
</script>
</head>
<body>
Javascript refresh:<br>
<div id="log"></div>
</body>
</html>
Testing PHP seperatly:<br>
<?php
$datei=fopen("data/log.txt","r");
while(!feof($datei))
{
$zeile = fgets($datei,1000);
echo $zeile."<br>";
}
fclose($datei);
?>
Sorry for poor title.
I basically want to start a countdown (5 minutes) if a certain thing reports back witha number. Most of the backend is in PHP but I want to animate to the countdown so the user can see (maybe even with a progress bar eventually). But once the countdown his zero, if the condition is not met I want it to, lets say refresh the page for simplicity.
I'm looking for some guidance in right guidance. Should I:
Run timers seperately in JS and PHP
or
Do something like this Countdown timer built on PHP and jQuery? with a common php file included or something along those lines
Thanks guys.
well if you want a timer triggered by something that reports to the backend when it its over you could just do an ajax request with JQuery. I will try to explain it based on the condition that PHP has to init the counter as you show to us at the example timer.
Add JQuery to your project Download it here
Download JQuery countdown here, also you can read more about the library here
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="./jquery.countdown-2.2.0/jquery.countdown.min.js"></script>
</head>
<body>
<div class="countdown">
<span id="clock"></span>
</div>
<script>
function initTimer()
{
<?php
date_default_timezone_set('America/Bogota'); //Your target timezone
$time = new DateTime();
$minutes_to_add = 5;
$time->add(new DateInterval('PT' . $minutes_to_add . 'M'));
?>
$('#clock').countdown('<?php echo $time->format('Y-m-d H:i:s'); ?>')//so we init the timer at te server time + 5 minutes
.on('update.countdown', function(event) {
var format = '%H:%M:%S';
$(this).html(event.strftime(format));
})
.on('finish.countdown', function(event) {
$(this).html('This offer has expired!')
.parent().addClass('disabled');
//at the end of the timer we will send data to the server
$.ajax({
url: "your_server_service_url",
method: "GET",
data: {"some":"data you want to sent to server"}
}).done(function(r){ // r is the response from your server (all text printed)
location.reload(); //After the server get the data we reload the current page.
});
});
}
initTimer();
</script>
</body>
</html>
This question already has answers here:
auto refresh for every 5 mins
(4 answers)
Closed 7 years ago.
I am currently using an html page for a webview within my iOS and Android apps. I don't want to update the native code and was wondering if I could just refresh the homepage which is index.html every 2 mins? Is it possible?
You can use:
<meta http-equiv="refresh" content="120">
The <meta http-equiv="refresh"> tag causes a web page to refresh
automatically after a specified amount of time. Users generally don't
expect automatic refreshes, so they can be disorienting. Refreshing
also moves focus to the top of the page, which may frustrate or
confuse users, particularly those who rely on screen readers or other
assistive technologies.
https://web.dev/meta-refresh/
Meta equiv refresh
You can try to use like this:
<meta http-equiv="refresh" content="120">
or you can use setInterval like this:
setInterval(function() {
window.location.reload();
}, 120000);
use this
setTimeout(function(){
window.location.reload(1);
}, 120000);
EDIT
Put this in head
<script>
setTimeout(function(){
window.location.reload(1);
}, 120000);
</script>
EDIT
to attach this function only when page is ready use this
<script>
$('document').ready(function(){
setTimeout(function(){
window.location.reload(1);
}, 120000);
});
</script>
You can Put meta tag before html start
e.g.
<meta http-equiv="refresh" content="120">
<html>
<head>
<meta charset="UTF-8">
<title>Mart</title>
Im new with ejs. As I was trying out an app. I want to refresh the page every 5 sec.
I got a code
<script language="javascript" type="text/javascript">
$(document).ready(function() {
setInterval("location.reload(true)", 5000);
});
</script>
But how to include jquery in ejs? How to embed this code in ejs page?
Try this
tags: <meta http-equiv="refresh" content="5">. That simple. The "5" is the number of seconds. If you want to increase the time to say 20 minutes, you simply put in "1200" and so on.
In JavaScript it is possible to wait for onLoad which may be used to specify the time of page loading completion.
Every HTTP response is sent along with Date: header which contains the time server sent a response.
Is there a way in JavaScript to get the time of page started loading?
Something similar to response Date: header.
It would be useful for cases when JavaScript is injected into page after some delay.
new Date(performance.timing.connectStart) in chrome, firefox, IE9, etc (caniuse)
demo
console.log(new Date(performance.timing.connectStart));
Try storing a value from var d= new Date(); var requested = d.getTime(); and execute it when the page loads.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var loadDate;
</script>
</head>
<body onload="loadDate=new Date();">
<button onclick="alert(loadDate);">show load Date</button>
</body>
</html>
I would just pass a timestamp from the server-side script to the browser via a cookie or inline JS. E.g. in PHP:
<script>
var timestamp = new Date(<?php echo time(); ?>);
</script>