我有一堆。php页面,这些每个回声一个html网页。完成处理和加载每个页面大约需要一分钟左右。我想在页面完全加载时向用户显示一个正在加载的图像。
我想到了一种逻辑上的方式,就像第一个图像加载和主要内容仍然隐藏,而。php正在处理;一旦PHP加载完成,它就可以回显一个元素,作为javascript的触发器,将主内容的显示样式从隐藏更改为块。但我不能执行它;因为我猜apache需要在显示任何输出之前加载php。
我看到的另一个选项是使用ajax更改整个页面和加载数据,但我有点懒这样做,因为它将涉及重写所有的。php代码。
我希望如果有人能指导我通过我做错了什么,或者如果有更有效的方法来做这个任务。
一种策略是使用cookie和中间页面。将所有请求重定向到没有特定cookie的中间页面,在中间页面中我们设置cookie。
使用apache的htaccess,或者在其他服务器上使用类似的工具,就不需要修改应用程序的页面了。
在htaccess中检查cookie(例如alreadyloading)是否存在,如果不存在则重定向到"loading.html"在"loading。html"你设置alreadyloading=true,然后重定向到原始URL。
在"loading.html"中进行重定向很重要。使用javascript,因为使用HTTP重定向你不会得到预期的结果。
在"loading.html"你显示正在加载的图像,你必须设置cookie alreadyloading=true,然后使用onload事件你重定向到原始URL,在onload你做一个小延迟或图像(加载)将冻结不移动在某些浏览器:
<script>
window.onload = function() {
setTimeout( function() {
location.replace($ORIGIAL_URL.split('#')[0]);
}, 60 );
};
</script>
对于cookie过期,你可以设置"loading.html"几天、几小时或几分钟都不重新加载,这取决于你的需要。另一个选择是为每个URL设置一个cookie。
我在几个站点上有一个类似的实现。
编辑:
为了说明策略,而不是实现,在这个简单的例子中,我们不使用htaccess,而是在加载内容之前在内容页上进行第一次重定向。
另存为index.html:
<!DOCTYPE html>
<html lang="">
<head>
<title>Content</title>
</head>
<body>
<script>
// check if a cookie exists
if (!document.cookie.match(/^(.*;)?s*loadings*=s*[^;]+(.*)?$/)) {
location.replace('loading.html');
}
</script>
<h1>Content</h1>
</body>
</html>
另存为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>
这个简单的例子甚至可以在firefox本地(file://…)中工作,在chrome中,我怀疑它在本地是否有效。