P粉5584781502024-01-11 00:13:41
One strategy is to use cookies and intermediate pages. Redirect all requests to an intermediate page without a certain cookie, where we set the cookie.
Use apache htaccess or the equivalent in other servers without modifying the application's pages.
Check in htaccess whether the cookie (e.g. already loaded) exists, if not, redirect to "loading.html", set hasloading=true in "loading.html", and then redirect to the original URL.
It is very important to use javascript to redirect in "loading.html" because you will not get the expected results using HTTP redirects.
To show the loading image in "loading.html" you have to set cookie hasloading=true and then use onload event where you redirect to the original URL, in onload you do a small delay or the image (being Loading) ) will be frozen without moving in some browsers:
<script>
window.onload = function() {
setTimeout( function() {
location.replace($ORIGIAL_URL.split('#')[0]);
}, 60 );
};
</script>
As the cookie expires, you can keep "loading.html" from reloading for days, hours, or minutes, depending on your needs. Another option is to set a cookie per URL.
I have similar implementations on several websites.
edit:
To illustrate strategy, rather than implementation, in this simple example we do not use htaccess and do the first redirect on the content page before loading the content.
Save as index.html:
<!DOCTYPE html>
<html lang="">
<head>
<title>Content</title>
</head>
<body>
<script>
// check if a cookie exists
if (!document.cookie.match(/^(.*;)?\s*loading\s*=\s*[^;]+(.*)?$/)) {
location.replace('loading.html');
}
</script>
<h1>Content</h1>
</body>
</html>
Save as loading.html:
<!DOCTYPE html>
<html lang="">
<head>
<title>Loading</title>
</head>
<body>
<h1>Loading...</h1>
<script>
// set cookie
document.cookie = "loading=1;0;path=/";
// redirect
window.onload = function() {
setTimeout( function() {
location.replace('index.html');
}, 2000 );
};
</script>
</body>
</html>
This simple example even works in Firefox locally (file:// ...), in Chrome I doubt it works locally.
reply
0