UTMパラメータをフォームの非表示項目に渡す方法

<script>
window.addEventListener('load', function () {
  "use strict";

  /** Cookieの値を取得する関数 */
  function getCookie(name) {
    const value = document.cookie.split('; ').find(row => row.startsWith(name + '='));
    return value ? decodeURIComponent(value.split('=')[1]) : null;
  }

  /** Cookieに値を保存する関数（maxAgeは保存秒数） */
  function setCookie(name, value, maxAgeSeconds) {
    document.cookie = name + '=' + encodeURIComponent(value) + '; max-age=' + maxAgeSeconds + '; path=/';
  }

  /** 現在の日本時間の日付（YYYY-MM-DD）を取得する関数 */
  function getTodayLocalDate() {
    const now = new Date();
    now.setMinutes(now.getMinutes() - now.getTimezoneOffset());
    return now.toISOString().slice(0, 10);
  }

  /** その日の0時までの残り時間（秒）を取得 */
  function getSecondsUntilEndOfDay() {
    const now = new Date();
    const endOfDay = new Date(now);
    endOfDay.setHours(23, 59, 59, 999);
    return Math.floor((endOfDay - now) / 1000);
  }

  /** 最初の訪問URLとその日付を記録（_fvurlに保存） */
  const currentDate = getTodayLocalDate();
  const existingFvurlRaw = getCookie('_fvurl');
  const existingFvurlParts = existingFvurlRaw ? existingFvurlRaw.split('___') : [];
  const existingUrl = existingFvurlParts[0];
  const existingDate = existingFvurlParts[1];
  const secondsToSave = Math.min(1800, getSecondsUntilEndOfDay());

  if (!existingUrl || existingDate !== currentDate) {
    const valueToSave = window.location.href + '___' + currentDate;
    setCookie('_fvurl', valueToSave, secondsToSave);
  }

  /** 記録したURLだけを取り出す（フォーム入力に使用） */
  const finalFvurl = getCookie('_fvurl');
  const savedURL = finalFvurl ? finalFvurl.split('___')[0] : null;
  if (savedURL) console.log("初回訪問URL:", savedURL);

  /** URLパラメータをオブジェクトとして取得（utm用） */
  function getUrlParams(url) {
    const params = {};
    if (!url) return params;
    const query = url.split('?')[1];
    if (!query) return params;
    query.split('&').forEach(pair => {
      const [key, value] = pair.split('=');
      if (key && value) params[decodeURIComponent(key)] = decodeURIComponent(value);
    });
    return params;
  }

  /** 対象フォームがあれば値を反映 */
  const contactForm = document.querySelector('form.contact_form');
  if (contactForm) {
    function updateHiddenFields() {
      const groups = document.querySelectorAll('.group');
      const params = getUrlParams(savedURL);

      /** 初回訪問URL → 「非表示項目」フィールドに入力 */
      let targetInputURL = null;
      groups.forEach(group => {
        const label = group.querySelector('label');
        if (label && label.textContent.includes('非表示項目')) targetInputURL = group.querySelector('input');
      });
      if (targetInputURL && savedURL) {
        const setValue = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'value').set;
        setValue.call(targetInputURL, savedURL);
        targetInputURL.dispatchEvent(new Event('input', { bubbles: true }));
      }

      /** utm_source → 対応するフィールドに入力 */
      let targetInputSource = null;
      groups.forEach(group => {
        const label = group.querySelector('label');
        if (label && label.textContent.includes('utm_source')) targetInputSource = group.querySelector('input');
      });
      if (targetInputSource && params.utm_source) {
        const setValue = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'value').set;
        setValue.call(targetInputSource, params.utm_source);
        targetInputSource.dispatchEvent(new Event('input', { bubbles: true }));
      }

      /** utm_medium → 対応するフィールドに入力 */
      let targetInputMedium = null;
      groups.forEach(group => {
        const label = group.querySelector('label');
        if (label && label.textContent.includes('utm_medium')) targetInputMedium = group.querySelector('input');
      });
      if (targetInputMedium && params.utm_medium) {
        const setValue = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'value').set;
        setValue.call(targetInputMedium, params.utm_medium);
        targetInputMedium.dispatchEvent(new Event('input', { bubbles: true }));
      }

      /** utm_campaign → 対応するフィールドに入力 */
      let targetInputCampaign = null;
      groups.forEach(group => {
        const label = group.querySelector('label');
        if (label && label.textContent.includes('utm_campaign')) targetInputCampaign = group.querySelector('input');
      });
      if (targetInputCampaign && params.utm_campaign) {
        const setValue = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'value').set;
        setValue.call(targetInputCampaign, params.utm_campaign);
        targetInputCampaign.dispatchEvent(new Event('input', { bubbles: true }));
      }
    }

    /** ページ読み込み時に実行 */
    updateHiddenFields();

    /** 動的にフォームが生成されても対応 */
    const observer = new MutationObserver(updateHiddenFields);
    observer.observe(document.body, { childList: true, subtree: true });
  }
});
</script>