Saya mempunyai sekumpulan halaman .php, setiap satu sepadan dengan halaman web html. Setiap halaman mengambil masa kira-kira seminit atau lebih untuk memproses dan memuatkan sepenuhnya. Saya ingin menunjukkan imej yang memuatkan kepada pengguna apabila halaman dimuatkan sepenuhnya.
Saya memikirkan cara secara logik seperti memuatkan imej dahulu dan kandungan utama kekal tersembunyi semasa .php sedang diproses sebaik sahaja php dimuatkan, ia boleh menggemakan elemen yang bertindak sebagai pencetus untuk JavaScript yang akan menambah utama; gaya paparan perubahan kandungan daripada tersembunyi kepada sekat. Tetapi saya tidak boleh melaksanakannya kerana saya rasa apache perlu memuatkan php sebelum ia boleh menunjukkan sebarang output.
Pilihan lain yang saya lihat ialah menukar keseluruhan halaman dan menggunakan ajax untuk memuatkan data, tetapi saya agak malas untuk melakukannya kerana itu akan melibatkan menulis semula semua kod .php.
Saya berharap seseorang boleh membimbing saya tentang kesilapan yang saya lakukan atau jika ada cara yang lebih cekap untuk menyelesaikan tugasan ini.
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Satu strategi ialah menggunakan kuki dan halaman perantaraan. Ubah hala semua permintaan ke halaman perantaraan tanpa kuki tertentu, tempat kami menetapkan kuki.
Gunakan apache htaccess atau yang setara dalam pelayan lain tanpa mengubah suai halaman aplikasi anda.
Semak dalam htaccess sama ada kuki (cth. sudah dimuatkan) wujud, jika tidak, ubah hala ke "loading.html", tetapkan hasloading=true dalam "loading.html", dan kemudian ubah hala ke URL asal.
Adalah sangat penting untuk menggunakan javascript untuk mengubah hala dalam "loading.html" kerana menggunakan HTTP redirect anda tidak akan mendapat hasil yang diharapkan.
Untuk menunjukkan memuatkan imej dalam "loading.html" anda perlu menetapkan cookie hasloading=true dan kemudian menggunakan acara onload di mana anda mengubah hala ke URL asal, dalam onload anda melakukan sedikit kelewatan atau imej (sedang dimuatkan) ) akan dibekukan tanpa bergerak dalam beberapa pelayar:
<script> window.onload = function() { setTimeout( function() { location.replace($ORIGIAL_URL.split('#')[0]); }, 60 ); }; </script>Apabila kuki tamat tempoh, anda boleh menahan "loading.html" daripada memuat semula selama beberapa hari, jam atau minit bergantung pada keperluan anda. Pilihan lain ialah menetapkan kuki bagi setiap URL.
Saya mempunyai pelaksanaan yang serupa pada beberapa tapak web.
Editor:
Untuk menggambarkan strategi, bukannya pelaksanaan, dalam contoh mudah ini kami tidak menggunakan htaccess dan melakukan ubah hala pertama pada halaman kandungan sebelum memuatkan kandungan.
Simpan sebagai 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>Simpan sebagai memuatkan.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>Contoh mudah ini juga berfungsi dalam Firefox secara tempatan (file://...), dalam chrome saya ragu ia berfungsi secara tempatan.