İstemci tarafında CSS önbelleğini temizleme zorla nasıl?

Modül (şablonlar, düzenler, CSS) için çok fazla işlevselliği değiştirdiğimizi ve bu değişiklikleri üretim alanına taşıyacağımızı, ancak birçok müşterinin tarayıcılarında CSS'yi önbelleğe aldığını varsayalım. Yani burada bir soru. İstemcinin CSS önbelleğini temizleme zorlaması ve dosya yeniden adlandırma ( styles.css-> styles-v2.css). Tek bir mantıksal yol var ama Magento'da çalışmıyor çünkü mevcut dosyayı kontrol ediyor (bu yöntem JS dosyaları için çalışıyor), aşağıya bakınız:

<action method="addCss">
    <stylesheet>css/styles.css?1</stylesheet>
</action>  

Herhangi bir fikir?

Bununla baş etmenin bir yolu, CSS'nin birleşmesini sağlamaktır. Sonra önbelleği temizleyebilirsiniz ve yeni bir dosya adıyla yeni bir birleştirilmiş dosya oluşturulur.

System -> Configuration -> Developer -> CSS settings -> Merge CSS Files

Bildiğim kadarıyla, birleştirilmiş CSS dosyasının karma kodu, temeldeki dosyalar değiştirilse bile aynı kalır - yalnızca birleştirilmiş dosyalar grubuna yeni dosyalar eklenirse, karma değişir. - @Alex

Bununla baş etmenin başka bir yolu layout.xml kullanmak yerine,

sadece onları içine koy page/html/head.phtml

Veya <style>sürüm numarasına sahip bir etiket içeren bir blok oluşturun ve onu kafanızdaki XML'e koyun, böylece yalnızca belirli sayfalara yüklenmesini ve XML mizanpajlarını kullanmaya devam etmesini sağlayabilirsiniz.

Birleştirilmiş CSS dosyalarına zaman damgası bilgileri ekleyen OpenSource Modülü Aoe_JsCssTstamp'ı kullanabilirsiniz . Düz (birleştirilmemiş) CSS dosyaları için zaman damgaları henüz desteklenmiyor, ancak uygulanması kolay olabilir.

Tam olarak bunu yapan github 'Magento Cachebuster' ücretsiz bir uzantısı var. Bu yeniden

https://github.com/gknoppe-guidance/magento-cachebuster

Modül, Magento tarafından yaratılan URI'yi> statik dosyalar için> dosya zaman damgasını dosya adına ekleyerek otomatik olarak değiştirerek önbellekleme sağlar:

Önce: http://www.example.com/js/varien/js.js Sonra: http://www.example.com/js/varien/js.1324429472.js

Bunun için Speedster Advanced eklentisini kullanıyorum. Ancak temel ilke, birleştirilmiş css ve js dosyalarının adının en son değiştirilen dosyanın zaman damgasını içermesidir - bkz Mage_Core_Model_Design_Package::getMergedCssUrl(). Herhangi bir css dosyasını düzenlediğinizde, tarayıcıların önbelleğe alınmış sürümü yeniden kullanmak yerine yeni dosyayı istemesine neden olacak şekilde yeni bir dosya adı oluşturulur. Baş bloğunuz önbelleklenebileceğinden, bir Magento önbellek yenilemesi gerekir.

Ayrıca, css dosyaları için bir önbellek bozucu uyguladık. Sanırım en iyi yol, Mage_Page_Block_Html_Head öğesini uzatmak ve aşağıdaki işlevi sürmek ve $ skinItems dizisini istediğiniz değişikliklerle güncellemektir .

protected function &_prepareStaticAndSkinElements($format, array $staticItems, array $skinItems, $mergeCallback = null)
{
    $designPackage = Mage::getDesign();
    //$skinItems: contains all css
    foreach ($skinItems as $params => $rows) {
        foreach ($rows as $key=>$name) {
            $file = $designPackage->getFilename($name, array('_type' => 'skin'));
            $skinItems[$params][$key] = $name . "?fmt=" . filemtime($file);
        }
    }
    return parent::_prepareStaticAndSkinElements($format, $staticItems, $skinItems, $mergeCallback);

}

Buradan ilham aldım. Kaynak

Herhangi bir eklenti gerektirmeyen ve yalnızca yerleşik Magento yeteneklerini kullanan basit ancak hantal bir geçici çözüm vardır - mevcut bir sitede daha fazla kod yüklemeyi riske atmak zorunda kalmadan hızlıca yapmanız gerekiyorsa kullanışlıdır.

Buradaki fikir, önbellek bozan bir dosya adı oluşturmak için birleştirilmiş CSS sistemini kullanabileceğinizdir.

Birleştirilmiş CSS dosya adı, bir araya getirilen tüm dosyaların bir karması olduğundan, temaya bir ad için tarih damgası ile birlikte ekstra bir boş css dosyası ekleyebilirsiniz.

Yani:

1. Konfigürasyon> Gelişmiş> Geliştirici'deki CSS dosyalarını birleştirme
2. Tema düzenlerinizde, CSS dosyalarını başınıza nereye eklediğinizi (genellikle sayfa.xml) bulun ve fazladan bir stil sayfası dosyası ekleyin, ad benzersiz olduğu sürece istediğiniz herhangi bir şeyi arayın. <action method="addCss"><stylesheet>css/cachebust_091014.css</stylesheet></action>
3. Dış görünüm CSS klasörünüzde bu adla yeni bir css dosyası oluşturun, dosya içerikleri için sadece dosyanın ne olduğunu söyleyen bir yorum yaptım

Şimdi canlı yayınla ve magento önbelleğini temizle, birleştirilen css dosyasının artık farklı bir adı olacak ve önbelleklerin bozulacak!

Önbellek bozmak istediğiniz her zaman olduğu gibi zahmetlidir, bu dosya adını değiştirmeniz gerekir, ancak yerleşik Magento özelliklerinden başka bir şey gerektirmez, bu yüzden kendinizi sıkışmış bulursanız ve hızlı bir düzeltmeye ihtiyacınız olursa kullanışlıdır!

=> Bu kodu kullanmak yerine:

<action method="addCss">
    <stylesheet>css/styles.css?1</stylesheet>
</action>

=> Bu kodu kullanmaya çalışın:

<reference name="head">
    <block type="core/text" name="foocss">
        <action method="setText">
            <css><![CDATA[<link rel="stylesheet" type="text/css" href="foo.css?1" media="all" />]]></css>
        </action>
    </block>
</reference>

Ama çok hoş değil ...

Xml mizanpajlarında tüm CSS ve JS'nin sonuna bir sorgu dizesi ekleyecek bir modül buldum. Sorgu dizesi yönetici tarafından yapılandırılabilir.

https://github.com/mklooss/Loewenstark_Head

Temel fikir, _prepareStaticAndSkinElementsaşağıda gösterildiği gibi, modülde yapıldığı gibi bir sorgu dizesi içermeyi geçersiz kılmaktır .

protected function &_prepareStaticAndSkinElements($format, array $staticItems, array $skinItems, $mergeCallback = null)
{
    $version = Mage::getStoreConfig("design/head/meta_version_tag");
    $format = sprintf($format, "%s?v{$version}", "%s");
    return parent::_prepareStaticAndSkinElements($format, $staticItems, $skinItems, $mergeCallback);
}

Sorunuzda önerilen çözümü anlarsam, bunu bir çekirdek dosyaya hafif bir modla yapabilirsiniz ( aslında çekirdek dosyayı düzenlemeyin ):

Büyücü / Sayfa / Blok / Html / Head.php

? C = 198 satırına benzer bir şey ekleyin, böylece tüm css dosyalarında bu var

$html .= $this->_prepareStaticAndSkinElements('<link rel="stylesheet" type="text/css" href="%s?v=1"%s />' . "\n",

Fooman Speedster Advanced'in ( http://www.magentocommerce.com/magento-connect/fooman-speedsteradvanced-4030.html ) bir çözüm olabileceğini düşünüyorum:

"Javascript / CSS dosyaları güncellendiğinde, otomatik sürümle yüklendikten sonra tamamen otomatik"

Bunun için ücretsiz bir modül kurdum:

http://www.magentocommerce.com/magento-connect/frontend-flush-2048.html

Lütfen beklendiği gibi çalışmazsa bana bildirin, ancak birleştirilmiş dosyalardan birinin içeriği değiştiyse, kombine js ve css dosyalarının farklı bir karması olacak şekilde oluşturdum. Varsayılan olarak Magento, birleştirilmiş dosyanın karma değerini yalnızca dahil edilen dosyalardan birinin dosya adı değiştiyse değiştirir.

GÜNCELLEME

Ayrıca, ona inananlar için ücretsiz ve basit bir küçültme modülü yaptım.

http://www.magentocommerce.com/magento-connect/minify-7771.html

Fabrizio Branca tarafından yaratılan ve ilgilendiğiniz şeyi yapan gerçekten hoş bir modül var. Buna AOE_JsCSSTStamp denir . Bu ne yapar? Hem CSS hem de JS kaynaklarına zaman damgası ekler. CSS / JS önbelleğini temizlediğinizde zaman damgaları yeniden oluşturulur.

Tarayıcı farklı bir dosya adı görecektir - bu yüzden kaynakları tekrar indirecek ve tarayıcıda önbelleklemek yerine en yenisiyle sunulacaktır.

Mage_Page_Block_Html_Head içinde getCssJsHtml yöntemini düzenleyin, css düzenleme işleminden sonra birkaç gün boyunca böyle bir dize ekleyin ve hepsi bu ...

// static and skin css
        $html .= $this->_prepareStaticAndSkinElements('<link rel="stylesheet" type="text/css" href="%s?foo=WHAT_YOU_WANT_HERE"%s />' . "\n",
            empty($items['js_css']) ? [] : $items['js_css'],
            empty($items['skin_css']) ? [] : $items['skin_css'],
            $shouldMergeCss ? [Mage::getDesign(), 'getMergedCssUrl'] : null
        );

Birkaç yıl sonra ve dosyaları birleştirmeyecek basit bir dosya bulamadım ve basit, kendimi yarattım. Ana fikir, önbelleği temizledikten sonra Zaman Damgasını güncelleyeceğidir. Başka bir deyişle - bazılarını değiştirdiğinizde css/js, sadece önbelleği temizleyin ve Timestamp güncellenecektir.

Kaynak kodu burada -> https://github.com/archonkulis/ANSolutions_CssJsTimestamp

Çalışır 1.9+ sürümü. Eski sürümlerden emin değilim, ancak büyük olasılıkla da çalışması gerekiyor.

Temanızın bir kopyasını yeni bir adla (themev2) oluşturun - hem dış görünüm hem de uygulama / tasarım vb. Sonra yönetici olarak yeni temayı seçin.