Why are cookies being caches in hook_prepress_node() and how can I prevent or work around this issue?

In Drupal 9 we have a _preprocess_node() hook that loads a users cookies like:

function THEME_preprocess_node(&$variables) {


  $parameters = [];
  if (isset($_COOKIE['utm_source'])){
    $parameters[] = 'utm_source=' . $_COOKIE['utm_source'];
    $parameters['#cache']['contexts'][] = 'cookies:utm_source';
  }
  if (isset($_COOKIE['utm_medium'])){
    $parameters[] = 'utm_medium=' . $_COOKIE['utm_medium'];
    $parameters['#cache']['contexts'][] = 'cookies:utm_medium';
  }
  if (isset($_COOKIE['utm_campaign'])){
    $parameters[] = 'utm_campaign=' . $_COOKIE['utm_campaign'];
    $parameters['#cache']['contexts'][] = 'cookies:utm_campaign';
  }
  $parameters = implode('&', $parameters);

  $variables['parameters'] = '&' . $parameters;
}

In my Node template:

{{ parameters }}

But it will load the cached cookies, even from other visitors until the cache is cleared.

We're trying to load the cookie parameters into a node template but it appears that preprocess hooks are caching the data. Even with all caching modules turned off.

So, is there another way we should be checking and passing cookie data to a node template?

You must take into consideration render caching. In this case you must add a cache context that references the cookie. There are other questions in this forum with examples, and the big pipe module has another:

$has_big_pipe_nojs_cookie = $request->cookies->has(BigPipeStrategy::NOJS_COOKIE);
$page['#cache']['contexts'][] = 'cookies:' . BigPipeStrategy::NOJS_COOKIE;

You haven't shown all your code, but what I think you need here is something like:

$variables['#cache']['contexts'][] = 'cookies:utm_source';