모듈에 대한 많은 기능 (템플릿, 레이아웃, CSS)을 변경하고 이러한 변경 사항을 프로덕션 사이트로 옮길 것이라고 생각하지만 많은 고객이 브라우저에 CSS를 캐시했다고 가정합니다. 여기 질문이 있습니다. 클라이언트의 CSS 캐시를 강제로 플러시하고 파일 이름을 바꾸지 않는 방법 ( styles.css-> styles-v2.css) 하나의 논리적 방법이 있지만 Magento에서는 작동하지 않습니다.이 방법은 JS 파일에 대해이 방법이 작동하는 방식으로 기존 파일을 확인하므로 아래를 참조하십시오.
<action method="addCss">
<stylesheet>css/styles.css?1</stylesheet>
</action>
어떤 아이디어?
답변:
이를 처리하는 한 가지 방법은 CSS를 병합하는 것입니다. 그런 다음 캐시를 지우면 새 파일 이름으로 병합 된 새 파일이 만들어집니다.
System -> Configuration -> Developer -> CSS settings -> Merge CSS Files내가 아는 한 병합 된 CSS 파일의 해시 코드는 기본 파일이 변경된 경우에도 동일하게 유지됩니다. 병합 된 파일 세트에 새 파일이 추가되면 해시가 변경됩니다. -@ 알렉스
이것을 처리하는 또 다른 방법은 layout.xml을 사용하는 대신
그냥 당신의에 넣어
page/html/head.phtml
또는 <style>버전 번호 가 포함 된 태그 가 포함 된 블록을 만들어 머리에 XML로 넣을 수 있으므로 특정 페이지에만로드하고 XML 레이아웃을 계속 사용할 수 있습니다.
타임 스탬프 정보를 병합 된 CSS 파일에 추가 하는 OpenSource 모듈 Aoe_JsCssTstamp 를 사용할 수 있습니다 . 일반 (병합되지 않은) CSS 파일의 타임 스탬프는 아직 지원되지 않지만 구현하기 쉽습니다.
github 'Magento Cachebuster'에는 정확히 이것을 수행하는 무료 확장이 있습니다. 다시
https://github.com/gknoppe-guidance/magento-cachebuster
이 모듈은 파일의 타임 스탬프를 파일 이름에 추가하여> 정적 파일에 대해 Magento가 생성 한 URI를 자동으로 변경하여 캐시 버스 팅을 제공합니다.
이전 : http://www.example.com/js/varien/js.js 이후 : http://www.example.com/js/varien/js.1324429472.js
내 자신의 확장명 Speedster Advanced를 사용합니다. 그러나 기본 원칙은 병합 된 css 및 js 파일 이름에 마지막으로 수정 된 파일의 타임 스탬프가 포함된다는 것 Mage_Core_Model_Design_Package::getMergedCssUrl()입니다. CSS 파일을 편집 할 때마다 캐시 된 버전을 재사용하는 대신 브라우저가 새 파일을 요청하도록하는 새로운 파일 이름이 생성됩니다. 헤드 블록이 캐시 될 수 있으므로 Magento 캐시를 새로 고쳐야합니다.
또한 CSS 파일에 대한 캐시 버스터를 구현했습니다. 가장 좋은 방법은 Mage_Page_Block_Html_Head 를 확장 하고 아래 함수를 타고 원하는 변경 사항으로 $ skinItems 배열을 업데이트 하는 것입니다.
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);
}
여기에서 영감을 얻었습니다. 출처
플러그인이 필요없고 내장 된 Magento 기능 만 사용하는 간단하지만 번거로운 해결 방법이 있습니다. 더 이상 코드를 설치할 위험없이 기존 사이트에서 빠르게 수행해야하는 경우에 유용합니다.
병합 된 CSS 시스템을 사용하여 캐시 무효화 파일 이름을 생성 할 수 있습니다.
병합 된 CSS 파일 이름은 병합 된 모든 파일의 해시이므로 이름에 날짜 스탬프가있는 테마에 빈 CSS 파일을 추가하면됩니다.
그래서:
<action method="addCss"><stylesheet>css/cachebust_091014.css</stylesheet></action>이제 라이브를 푸시하고 magento 캐시를 플러시하면 병합 된 CSS 파일의 이름이 달라지고 캐시가 파열됩니다!
캐시를 버스트하려고 할 때마다 파일 이름을 변경해야 할 때 번거롭지 만 Magento 기능이 내장되어 있기 때문에 자신을 고착시키고 빠른 수정이 필요한 경우 편리합니다!
=>이 코드를 사용하는 대신 :
<action method="addCss">
<stylesheet>css/styles.css?1</stylesheet>
</action>
=>이 코드를 사용해보십시오 :
<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>
그러나 그것은 좋지 않습니다 ...
XML 레이아웃의 모든 CSS 및 JS 끝에 쿼리 문자열을 추가하는 모듈을 찾았습니다. 쿼리 문자열은 관리자가 구성 할 수 있습니다.
https://github.com/mklooss/Loewenstark_Head
기본 아이디어는 _prepareStaticAndSkinElements아래에 표시된 것처럼 모듈에서 수행 한 것처럼 쿼리 문자열을 포함 하도록 재정의 하는 것입니다.
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);
}
귀하의 질문에 제안 된 해결책을 이해하면 핵심 파일에 약간의 수정을 사용하여 수행 할 수 있습니다 ( 실제로 핵심 파일을 편집하지 마십시오 ).
마법사 / 페이지 / 블록 /Html/Head.php
모든 CSS 파일에 다음이 추가되도록 198 행에? v = 1과 같은 것을 추가하십시오.
$html .= $this->_prepareStaticAndSkinElements('<link rel="stylesheet" type="text/css" href="%s?v=1"%s />' . "\n",Fooman Speedster Advanced ( http://www.magentocommerce.com/magento-connect/fooman-speedsteradvanced-4030.html )가 해결책이 될 수 있다고 생각 합니다.
"Javascript / CSS 파일이 업데이트 될 때 자동 버전 관리를 통해 완전히 자동화 된 설치"
나는 이것을 위해 무료 모듈을 만들었습니다.
http://www.magentocommerce.com/magento-connect/frontend-flush-2048.html
연결된 파일 중 하나의 내용이 변경된 경우 결합 된 js 및 css 파일이 다른 해시를 갖도록 빌드했습니다. 기본적으로 Magento는 포함 된 파일 중 하나의 파일 이름이 변경된 경우 결합 된 파일의 해시 만 변경합니다.
최신 정보
나는 또한 그것을 믿는 당신을 위해 무료로 간단한 축소 모듈을 만들었습니다.
http://www.magentocommerce.com/magento-connect/minify-7771.html
Fabrizio Branca가 만든 멋진 모듈이 있습니다.이 모듈은 여러분이 관심있는 것을 정확하게 수행합니다. AOE_JsCSSTStamp 라고 합니다 . 그것은 무엇입니까? CSS 및 JS 리소스 모두에 타임 스탬프를 추가합니다. CSS / JS 캐시를 플러시하면 타임 스탬프가 다시 생성됩니다.
브라우저에는 다른 파일 이름이 표시되므로 리소스를 다시 다운로드하여 브라우저에 캐시되지 않고 최신 파일로 제공합니다.
Mage_Page_Block_Html_Head 에서 getCssJsHtml 메소드를 편집하고 CSS 편집 후 며칠 동안 이와 같은 문자열을 추가하면됩니다.
// 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
);
몇 년 후 파일을 병합하지 않고 간단한 유용한 확장명을 찾지 못하면 내 자신을 만들었습니다. 주요 아이디어는 캐시를 플러시 한 후 타임 스탬프를 업데이트한다는 것입니다. 즉 css/js, 일부를 변경하면 캐시를 플러시하면 타임 스탬프가 업데이트됩니다.
소스 코드는 여기-> https://github.com/archonkulis/ANSolutions_CssJsTimestamp
1.9+ 버전 에서 작동합니다 . 그러나 이전 버전에 대해서는 확실하지 않지만 대부분 잘 작동합니다.
스킨과 앱 / 디자인 등 새로운 이름 (themev2)으로 테마를 복사 한 다음 관리자에서 새 테마를 선택하십시오.