Cache refresh PHP / HTML
Ik loop als newbie tegen een cache probleem aan waar ik met behulp van google niet uit kom.
Met de webpagina wil ik dynamisch kunnen monitoren welke filmpjes geupload worden.
Ik heb een werkend simpel php script dat een directory scanned op mp4's en daar een grid gallery van maakt.
Echter, als ik exta mp4's upload of mp4's delete, kan ik eindeloos op (ctrl) refresh blijven drukken, de gallery blijft hangen op het oude aantal mp4's. Ik kan ze zelfs afspelen als ze online al gedelete zijn.
huh? klinkt als een cache dingetje...
met wat googlen, plukken en testen heb ik een test php script dat werkt. Op refresh wordt het correcte aantal mp4's getoond:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
<?php
header('Cache-Control: no-cache');
header('Pragma: no-cache');
foreach ( glob("gallery/*.mp4") as $file ) {
$file_info = pathinfo( getcwd().'/'.$file );
echo $file_info['dirname'], "<br>";
echo $file_info['basename'], "<br>";
echo $file_info['extension'], "<br>";
echo $file_info['filename'], "<br>";
echo '<hr>';
}
?>
header('Cache-Control: no-cache');
header('Pragma: no-cache');
foreach ( glob("gallery/*.mp4") as $file ) {
$file_info = pathinfo( getcwd().'/'.$file );
echo $file_info['dirname'], "<br>";
echo $file_info['basename'], "<br>";
echo $file_info['extension'], "<br>";
echo $file_info['filename'], "<br>";
echo '<hr>';
}
?>
Dit werkt echter niet als ik die php gebruik met html om de gallery te genereren:
index.php:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<title>Video Gallery</title>
<link rel="stylesheet" type="text/css" href="theme.css">
<script src="gallery.js"></script>
</head>
<body>
<div id="vid-gallery">
<?php
header('Cache-Control: no-cache, no-store, must-revalidate');
header('Pragma: no-cache');
header('Expires: 0');
foreach ( glob("gallery/*.mp4") as $file ) {
printf("<video src='gallery/%s'></video>", rawurlencode(basename($file)));
}
?>
</div>
</body>
</html>
<html>
<head>
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<title>Video Gallery</title>
<link rel="stylesheet" type="text/css" href="theme.css">
<script src="gallery.js"></script>
</head>
<body>
<div id="vid-gallery">
<?php
header('Cache-Control: no-cache, no-store, must-revalidate');
header('Pragma: no-cache');
header('Expires: 0');
foreach ( glob("gallery/*.mp4") as $file ) {
printf("<video src='gallery/%s'></video>", rawurlencode(basename($file)));
}
?>
</div>
</body>
</html>
Zowel de html meta tags voor cache control en de php header cache controls bieden geen soelaas. Ik heb vele combi's en parameters geprobeerd, maar het blijft hangen op het oude aantal fimpjes.
Mijn vraag concreet: Wat kan ik doen om met html het correcte aantal filmpjes te krijgen na een refresh?
Groet, Boris
Niet echt ter zake, maar volledigheidshalve :)
gallery.js:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
window.addEventListener("DOMContentLoaded", function(){
for (let vid of document.querySelectorAll("#vid-gallery video")) {
// (A) CLICK ON THUMBNAIL TO GO FULLSCREEN
vid.addEventListener("click", function(){
if (!this.fullscreenElement) {
this.controls = true;
this.requestFullscreen();
}
});
// (B) EXIT FULLSCREEN MODE
vid.addEventListener("fullscreenchange", function(){
if (document.fullscreenElement == null) {
this.controls = false;
this.pause();
}
});
}
});
for (let vid of document.querySelectorAll("#vid-gallery video")) {
// (A) CLICK ON THUMBNAIL TO GO FULLSCREEN
vid.addEventListener("click", function(){
if (!this.fullscreenElement) {
this.controls = true;
this.requestFullscreen();
}
});
// (B) EXIT FULLSCREEN MODE
vid.addEventListener("fullscreenchange", function(){
if (document.fullscreenElement == null) {
this.controls = false;
this.pause();
}
});
}
});
theme.css
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/* (A) GALLERY - BIG SCREEN */
#vid-gallery {
display: grid;
grid-template-columns: repeat(3, auto);
grid-gap: 10px;
}
#vid-gallery video {
width: 100%;
cursor: pointer;
}
/* (B) GALLERY - SMALL SCREEN */
@media screen and (max-width: 1000px) {
#vid-gallery { grid-template-columns: repeat(2, auto); }
}
@media screen and (max-width: 600px) {
#vid-gallery { grid-template-columns: auto; }
}
#vid-gallery {
display: grid;
grid-template-columns: repeat(3, auto);
grid-gap: 10px;
}
#vid-gallery video {
width: 100%;
cursor: pointer;
}
/* (B) GALLERY - SMALL SCREEN */
@media screen and (max-width: 1000px) {
#vid-gallery { grid-template-columns: repeat(2, auto); }
}
@media screen and (max-width: 600px) {
#vid-gallery { grid-template-columns: auto; }
}
Gewijzigd op 16/09/2021 13:09:18 door Boris delaschickas
- Ariën - op 16/09/2021 13:57:03:
Heb je in je .htaccess iets aanstaan wat de boel cached?
Ik heb geen .htaccess bestanden....
heb je dit ook met een simpel standaard scriptje die iets invoegt in de database?
Gewijzigd op 16/09/2021 14:34:15 door - Ariën -
Ik weet niet zeker of het daar in dit geval ook aan ligt, maar probeer eens de headers Last-Modified en Expires toe te voegen?