WordPress’te bir kurabiye kullanma, Bölüm II: Ajax ile önbellek kırıcı
Önbellekleme her şeyi daha zor hale getirir. İyi bir kod yazarsanız ve daha sonra siz – ve müşterileriniz, iş arkadaşlarınız vb. – sonuçlardan çok farklıysa, sorun genellikle önbellekte olur. Aslında, Phil Karlton tarafından sevgiyle alıntı yapılan alıntı, “Bilgisayar Biliminde sadece iki zor şey var: önbellek iptali ve adlandırma şeyleri.” Zorluk: Bir sayfa tam önbellekleme, geçen haftaki WordPress’te PHP çerezleri yazma makalesinin önbellekleme konusunda büyük bir yıldıza sahip olduğu mantıklı. Özellikle, sitemizi hızlı hale getiren tam sayfa önbellekleme (sevdiğimiz dinamik önbellek site supercacher) da alınmayan çerezlere neden olur.
Daha spesifik olmak gerekirse, sunucuya yeni bir çerez kaydetmek mümkündür, ancak HTTP $ _Cookies nesnesi değişikliği yansıtmaz, çünkü sunucu değişiklik aramadığı için: Bu, başlık da dahil olmak üzere tüm sayfaların önbellek sürümünü sunar . Bu, Nick Davis’in bu makalesinde güzel bir şekilde açıklandı (ve bana açıklandı). Bu nedenle, makalede kafa karıştırıcı (ve kafa karıştırıcı) bir yorumdan sonra, demo çalışması için sayfa için dinamik önbelleklemeyi kapatmam gerekiyor – elbette önbellek ve bir sayfa çerez gerektiren sitelere uygulanamayabilir . Birini ya da diğerini seçmenize gerek yok.
Çözüm: Ajax, Ajax’ı kullanan bir çözüm olduğu ortaya çıkıyor. Ajax, sayfanız yüklendikten sonra doğrudan web sunucunuzla konuşmanın bir yoludur ve ardından sayfanızı konuşmanın sonuçlarıyla günceller. Bu sadece tam sayfa önbelleğinin üstesinden gelmek için ihtiyacımız olan şeydir, çünkü sorunumuz aşağıdaki gibidir: Sunucuda yeni çerez bilgileri ayarlanır, ancak sunucu bir sayfa oluştururken bunu aramıyor. Bu yüzden Ajax kullanarak sunucuya girip bilgilerin kendisi vereceğiz. Favori ile çalışan demo: Gönder
Bu geçen haftanın demosuna çok benziyor, ama şu:
Bahçe ferahlığı zorlamaz.
Önbellek sayfalarıyla (dinamik site alan önbellekleme) çalışma sayfasında etkinleştirilir.
Buradaki çözümümüzün kaynağımız, Nick Davis makalesinin bir açıklaması ve WordPress çerezleri ve önbellekleme hakkında iyi bir WP motor makalesi. Paul Underwood’un önerdiği gibi basit bir JS çerez kütüphanesi de kullanıyoruz. Tam kaynağı keşfetmek istiyorsanız bu eklenti GitHub’da. Sadece aşağıdaki parçalardan bahsedeceğiz. PHP kodu geçen haftaya kıyasla, PHP’de çok daha az şey yaptık. Şimdi üç şey yapıyoruz:
1. enqueue javascript dosyası add_action (‘wp_enqueue_scripts’, ‘wspout_cookie_scripts’); İşlev wspout_cookie_scripts () {wp_enqueue_script (‘wpshout-js-cookie-demo’, plugin_dir_url (__file__). wp_enqueue_script (‘çerez’, eklenti_dir_url (__file__). ‘cookie.js’, dizi (‘jQuery’)); / * Ajaxurl’un nerede olduğu JS dosyasına */ wp_localize_script (‘wpshout-js-cookie-demo’, ‘ajaxurl’, dizi (‘url’ => admin_url (). ‘Admin-ajax.php’,)); } Bu kod, ihtiyacımız olan iki JS dosyasını çeker: Cookie.js, JavaScript çerez için harici bir kitaplık; ve cookie.js. WP_LOCALICAL_SCRIPT () çağrılarına bağlı olan wpshout-js-Cookie-demo.js. JS PHP dosya değişkenimizi sağlama şeklimizdir. Bizim durumumuzda, ortak bir şey yapmamız gerekiyor: Bize Ajax isteklerinin nereye yönlendirilmesi gerektiğini söyleyin. 2. Ajax add_action isteği (‘WP_AJAX_WPSHOUT_GET_GET_FOOD_COOKIE’, ‘WSPSPOUT_GET_FAVE_FOOD_COOKIE’); Add_action (‘wp_ajax_nopriv_wpshout_get_get_food_cookie’, ‘wspout_get_fave_food_cookie’); İşlev wspout_get_fave_food_cookie () {$ cookie = $ _post [‘çerez’]; echo $ _cookie [$ cookie]; ölmek; } Bu kod, Ajax isteğimiz için sunucu tarafını işlemektedir. Başka bir deyişle, Superglobal dizisinin belirli üyelerini $ _cookie arıyordu. Hangi üyelerin ‘Çerez’ adıyla Ajax’a ne gönderdiğimize dayanacağını belirliyoruz.
$ _Cookie öğesi alındıktan sonra, bu kod onu Echo kullanarak onu arayan JS’ye iade etti ve sonra yürütmeyi bıraktı.3. Add_shortcode (‘js_cookie_demo’, ‘wpjcd_show_cookie_result’) kısa kodu kaydedin;işlev wpjcd_show_cookie_result () {ob_start ();echo ‘
‘;return ob_get_clean ();} add_shortcode (‘js_cookie_form’, ‘wpjcd_show_cookie_form’);işlev wpjcd_show_cookie_form () {ob_start ();?>
<? Php return ob_get_clean ();} Bu kod parçası geçen haftaya benzer;"Favori Yemek" formumuzu görüntülemek için iki WordPress kısa kod kaydetti.Burada ve burada yardımcı olacaksa kısa kodlar hakkında daha fazla bilgi.
JavaScript Biraz yapmak için JavaScript kullanıyoruz. En önemli iki şeyi tartışacağız: Ajax / * Ajax Talep Talep Önbelleğe rağmen mevcut çerez almak için isteği * / $ .post (ajaxurl.url, {'Action': 'wspout_get_fave_food_cookie': cookiename,}, işlev (işlev ( Yanıt) (yanıt) {console.log (yanıt); fave = yanıt; if (typeof (fave) === 'tanımsız') {$ ('.current-favorite') .html (nofaveText);} $ else {$ ('.current- favori') .html (faveText + fave);}}); Bu çözümün çekirdeği budur. Mevcut sayfadan $ _Cookie'de depolananları sormak yerine, JS Ajaxurl WordPress'e doğrudan bir istekte bulunduk. Sonuç olarak sunucudan önbellek olmayan sonuçlar alıyoruz. Sonuçları alırken, sonuçları geçerli favori sınıfla içerik öğesi olarak sayfaya yayınladı. Bir kez daha, Ajax'ın kendisi belirsizse, lütfen bu sorunla ilgili önceki öğreticimize bakın. Form / * favori favori güncelleme gıda formu * / $ ('. Favori-gıda-submit'). // 999 günlük yolda sona erer: '/',}); fave = cookie.get (cookiename); $ ('.current-favorite') .html (faveText + fave);}); Bu kod, çerezi kullanıcı tarafından belirlenen değere ayarlamamızı sağlar. Bu bölüm için Ajax kullanmamız gerekmediğini unutmayın: sorunumuz bir şey $ _cookie olarak ayarlamak değil, önbellek olsa bile yeni bir değer alıyor.
Çerezin kendisini ayarlamak için önce eski değeri cookie.remove () ile siliyoruz, ardından cookie.set () ile yeni bir değer ayarlıyoruz.Son olarak, cookie.get () ve jQuery ile geçerli sayfa yüklemesindeki formları güncelleriz.Üç kurabiye.Yöntem, JavaScript’teki çerezlerle çalışmayı kolaylaştıran Cookie.js kütüphanesinden gelir.Önbellek kırık, lezzetli kurabiye!Sağlıklı!Umarım bu size önbellek ortamında çerezlerle nasıl çalışacağınıza dair bir resim verir.Gerçekten bazı Ajax’ı bilmeniz gerekiyor, ancak işleyişten sonra bununla ilgili güzel şey sadece önbelleği tutmak değil, aynı zamanda dinamik – tarayıcıyı yenilemeye gerek yok. Sorularınız veya düşünceleriniz varsa, bunu duymaktan mutluluk duyarız Aşağıdaki yorumlar.Okuduğunuz için teşekkürler!Kredi görüntüsü: Darren Tunnicliff
