# Chapter 3

## Caching

### Control when social card images refresh

OpenGraph+ reads HTTP cache headers from your pages to decide when to re-render social card images. Since Astro can run in both static and SSR modes, how you configure caching depends on your setup.

This page covers the Astro side. For how OpenGraph+ handles caching at the HTTP level, see the [HTTP Caching](/content/docs/html-css/caching/index.html) guide.

## Static mode (default)

Astro generates static HTML by default. Cache headers come from your hosting provider, not Astro itself.

### Netlify / Cloudflare Pages

Create a `_headers` file in your `public/` directory:

```
# public/_headers
/*
  Cache-Control: public, max-age=604800
```

### Vercel

Add headers to your `vercel.json`:

```
{
  "headers": [\
    {\
      "source": "/(.*)",\
      "headers": [\
        { "key": "Cache-Control", "value": "public, max-age=604800" }\
      ]\
    }\
  ]
}
```

## SSR mode

With `output: 'server'` or `output: 'hybrid'`, you can set cache headers directly in your pages:

```
---
Astro.response.headers.set('Cache-Control', 'public, max-age=86400')
---
<html>
  <head>...</head>
  <body>...</body>
</html>
```

This gives you per-page control over caching.

## Meta tag overrides

If you can’t control HTTP headers (or want per-page control in static mode), use meta tags directly in your HTML:

```
<meta property="og:plus:cache:max_age" content="86400">
<meta property="og:plus:cache:etag" content="v1.2.3">
```

When the etag changes, OpenGraph+ re-renders even if the cache hasn’t expired. These meta tags take priority over HTTP headers.

See the [HTTP Caching guide](/content/docs/html-css/caching/index.html) for the full reference on cache headers and meta tag overrides.

## Purging

Force an immediate re-render from the OpenGraph+ dashboard by purging the cached image for any URL.

## Recommendations

| Page type            | Strategy                                      |
|---------------------|-----------------------------------------------|
| Static pages        | Long TTL via hosting headers (7 days)       |
| Blog posts          | Medium TTL (1 day) + etag meta tag          |
| Dynamic SSR pages   | `Cache-Control` header per-page (1-24 hours) |
| Frequently updated   | Short TTL + etag for instant invalidation    |