search

nuxt / vue-meta

Manage HTML metadata in Vue.js components with SSR support
https://vue-meta.nuxtjs.org
Other
4.08k stars 247 forks source link

Vue meta and serverCacheKey (LRU Caching) #190

Closed mattickx closed 5 years ago

mattickx commented 6 years ago

I'am seeing wrong meta data when using LRU caching and SSR. Setting a serverCacheKey in a component's options, will cache the component server side.

Case: Let's say we have a component A and B with both a serverCacheKey and a different vue meta title.

The following:

<template>
   <A>
      <B></B>
   </A>
</template>

Will result in: The first load the rendered meta title will be Title B. A second reload (cache hit) will render title A.

I know this is related to SSR Caching and not directly to Vue Meta. Still, it would be helpful as I encountered this use case, as such others might aswel. An example in the docs would do wonders 👍

Request: SSR + Caching (LRU) components and keep rendering the correct metadata even on a cache hit.

pimlie commented 5 years ago

I am not sure what we could do to fix this as afaik Vue doesnt emit any events when a component is re-used from cache? The docs also mention you shouldnt use component caching when child components produce side effects (which is what vue-meta does): https://ssr.vuejs.org/guide/caching.html#when-to-use-component-caching

But if anyone has an idea for a workaround we are open to suggestions ofc!

Btw, probably not what you need but client side the correct meta title will be displayed once the fix for #283 is released

stale[bot] commented 5 years ago

Thanks for your contribution to vue-meta! This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. If you would like this issue to remain open:

  1. Verify that you can still reproduce the issue in the latest version of vue-meta
  2. Comment the steps to reproduce it Issues that are labeled as pending will not be automatically marked as stale.
JUST-Limbo commented 2 days ago

i think:when vue instance lifecycle hooks were called,vue-meta power function will be called at the same time. so if your nested component use cache,at the first time,you can get the correct metainfo. but metainfo get [undefined] at the second time,because the cached component instance lifecycle hooks did not be called. so many years have passed, and surprisingly few people have mentioned this problem.