Top Menu cache problem

Question

I have added category thumbnail images for sub-categories in top navigation.
On non secure pages images are being pulled from non secure path that is correct but when I am navigating to https page, the images are still pulled from http page which is incorrect.
To fix the issue I have modified method getCacheKeyInfo in class Mage_Page_Block_Html_Topmenu from

 $shortCacheId = array(
 'TOPMENU',
 Mage::app()->getStore()->getId(),
 Mage::getDesign()->getPackageName(),
 Mage::getDesign()->getTheme('template'),
 Mage::getSingleton('customer/session')->getCustomerGroupId(),
 'template' => $this->getTemplate(),
 'name' => $this->getNameInLayout(),
 $this->getCurrentEntityKey()
 );
 $cacheId = $shortCacheId;
 $shortCacheId = array_values($shortCacheId);
 $shortCacheId = implode('|', $shortCacheId);
 $shortCacheId = md5($shortCacheId);
 $cacheId['entity_key'] = $this->getCurrentEntityKey();
 $cacheId['short_cache_id'] = $shortCacheId;
 return $cacheId;

to

$shortCacheId = array(
 'TOPMENU',
 Mage::app()->getStore()->getId(),
 (int)Mage::app()->getStore()->isCurrentlySecure(),
 Mage::getDesign()->getPackageName(),
 Mage::getDesign()->getTheme('template'),
 Mage::getSingleton('customer/session')->getCustomerGroupId(),
 'template' => $this->getTemplate(),
 'name' => $this->getNameInLayout(),
 $this->getCurrentEntityKey()
 );
 $cacheId = $shortCacheId;
 $shortCacheId = array_values($shortCacheId);
 $shortCacheId = implode('|', $shortCacheId);
 $shortCacheId = md5($shortCacheId);
 $cacheId['entity_key'] = $this->getCurrentEntityKey();
 $cacheId['short_cache_id'] = $shortCacheId;
 return $cacheId;

But the issue persists and still the images in top navigation are getting pulled from http url on https page.

Please let me know how this issue can be fixed.
Any help will be appreciated.
CODE FOR ADDING IMAGES
I have re-written class Mage_Catalog_Model_Observer below methods

public function addCategoryImages(Varien_Event_Observer $observer) {
 $block = $observer->getEvent()->getBlock();
 $block->addCacheTag(Mage_Catalog_Model_Category::CACHE_TAG);
 $this->_addCategoriesToMenu(
 Mage::helper('catalog/category')->getStoreCategories(), $observer->getMenu(), $block, true
 );
}
public function _addCategoriesToMenu($categories, $parentCategoryNode, $menuBlock, $addTags = false) {
 $categoryModel = Mage::getModel('catalog/category');
 foreach ($categories as $category) {
 if (!$category->getIsActive()) {
 continue;
 }
 $nodeId = 'category-node-' . $category->getId();
 $categoryModel->setId($category->getId());
 if ($addTags) {
 $menuBlock->addModelTags($categoryModel);
 }
 $tree = $parentCategoryNode->getTree();
 $categoryData = array(
 'name' => $category->getName(),
 'id' => $nodeId,
 'url' => Mage::helper('catalog/category')->getCategoryUrl($category),
 'is_active' => $this->_isActiveMenuCategory($category),
 'thumbnail' => $categoryModel->load($category->getId())->getThumbnail()
 );
 $categoryNode = new Varien_Data_Tree_Node($categoryData, 'id', $tree, $parentCategoryNode);
 $parentCategoryNode->addChild($categoryNode);
 $flatHelper = Mage::helper('catalog/category_flat');
 if ($flatHelper->isEnabled() && $flatHelper->isBuilt(true)) {
 $subcategories = (array) $category->getChildrenNodes();
 } else {
 $subcategories = $category->getChildren();
 }
 $this->_addCategoriesToMenu($subcategories, $categoryNode, $menuBlock, $addTags);
 }
}

I have added "thumbnail" in categoryData array and then fetched this in template app/design/frontend/rwd/bluebath/template/page/html/topmenu/renderer.phtml

Below is the code for renderer.phtml

$html = '';

$children = $menuTree->getChildren(); $parentLevel = $menuTree->getLevel(); $childLevel = is_null($parentLevel) ? 0 : $parentLevel + 1;

$counter = 1; $childrenCount = $children->count();

$parentPositionClass = $menuTree->getPositionClass(); $itemPositionClassPrefix = $parentPositionClass ? $parentPositionClass . '-' : 'nav-';

if(Mage::app()->getStore()->isCurrentlySecure()){ $mediaurl = Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_MEDIA,true); }else{
$mediaurl = Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_MEDIA); }

foreach ($children as $child) { $child->setLevel($childLevel); $child->setIsFirst($counter == 1); $child->setIsLast($counter == $childrenCount); $child->setPositionClass($itemPositionClassPrefix . $counter);

$outermostClassCode = 'level' . $childLevel;
$_hasChildren = ($child->hasChildren()) ? 'has-children' : '';
if ($childLevel != 0) {
 $urls = $mediaurl . 'catalog/category/' . $child->getData('thumbnail');
 $img = '<img src="' . $urls . '" alt="' . $child->getName() . '" />';
}
$html .= '<li ' . $this->_getRenderedMenuItemAttributes($child) . '>';
if ($childLevel != 0) {
 $html .= '<a href="' . $child->getUrl() . '" class="' . $outermostClassCode . ' ' . $_hasChildren . '">' . $img .

$this->escapeHtml($this->($child->getName())) . ''; } else { $html .= 'getUrl() . '" class="' . $outermostClassCode . ' ' . $_hasChildren . '">' . $this->escapeHtml($this->($child->getName())) . ''; }

if (!empty($childrenWrapClass)) {
 $html .= '<div class="' . $childrenWrapClass . '">';
}
$nextChildLevel = $childLevel + 1;
if (!empty($_hasChildren)) {
 $html .= '<ul class="level' . $childLevel . '">';
 $html .= '<li class="level' . $nextChildLevel . '">';
 $html .= '<a class="level' . $nextChildLevel . '" href="' . $child->getUrl() . '">';
 $html .= $this->__('View All ') . $this->escapeHtml($this->__($child->getName()));
 $html .= '</a>';
 $html .= '</li>';
 $html .= $this->render($child, $childrenWrapClass);
 $html .= '</ul>';
}
if (!empty($childrenWrapClass)) {
 $html .= '</div>';
}
$html .= '</li>';
$counter++; }

return $html;

• Marius: From what I know, the topmenu does not have images in a default install. It just renders ul, li and a elements all in text format. In case you added the images yourself somehow, please post your code in the question.
• Anshu Mishra: @Marius I have edited the question and added the code that I have used to display the images. Can you please look into it again and help me out in fixing this issue.
• Marius: I assume you also changed the template that renders the menu in order to be able to use thumbnails, right? If so, post it here
• Anshu Mishra: @Marius I have added the full code of my renederer.phtml

Answer 1

Modified method getCacheKeyInfo in class Mage_Page_Block_Html_Topmenu as below

public function getCacheKeyInfo()
 {
 $shortCacheId = array(
 'TOPMENU',
 Mage::app()->getStore()->getId(),
 (int)Mage::app()->getStore()->isCurrentlySecure(), // newly added line to check if secure or non secure
 Mage::getDesign()->getPackageName(),
 Mage::getDesign()->getTheme('template'),
 Mage::getSingleton('customer/session')->getCustomerGroupId(),
 'template' => $this->getTemplate(),
 'name' => $this->getNameInLayout(),
 $this->getCurrentEntityKey()
 );
 $cacheId = $shortCacheId;
 $shortCacheId = array_values($shortCacheId);
 $shortCacheId = implode('|', $shortCacheId);
 $shortCacheId = md5($shortCacheId);
 $cacheId['entity_key'] = $this->getCurrentEntityKey();
 $cacheId['short_cache_id'] = $shortCacheId;
 return $cacheId;
 }

Answer 2

The simplest solution might be to not worry about which protocol the user is using, by forcing the src on the image to be protocol relative. This brings the advantage of not diluting the cache.

$url = preg_replace('~^https?:~i', '', Mage::helper('catalog/category')->getCategoryUrl($category));

NB: The one caveat to this is it will only work if your media domain / path is the same (with the exception of the protocol) for both protocols (the settings web/unsecure/base_media_url and web/unsecure/base_media_url). Though I've found they generally are

• Anshu Mishra: My secure and unsecure urls are different, therefore it is not a good solution for me.