Токен формы в кэшированной странице: заявки теряются молча

Самая дорогая ошибка кэша, которую мы находили, — не медленная страница, а потерянная заявка. Форма выглядит нормально, посетитель вводит телефон, нажимает «Отправить» — и заявка не доходит. Без ошибки на экране и без записи в журнале, которую кто-то читает.

Это семнадцатая часть цикла «Кэш фрагментов и Redis».

Почему токен умирает в кэше

Формы WordPress защищаются токеном (wp_create_nonce), который печатается в разметку формы. Токен живёт около суток: два интервала по 12 часов. А разметка формы лежит в кэше — сутки, а при кэше на неделю и неделю. Посетитель получает форму из кэша с токеном, который уже не принимается.

Худший случай — HIT: страница пришла мгновенно, всё выглядит идеально, а отправка обречена.

Сколько это было

• 6 мёртвых токенов из 18 ячеек форм, включая «Заказать звонок»;
• мобильные ячейки страдали больше — 4 из 9 против 2 из 9: их реже пересобирали.

Как найти без отправки заявки

Запросите несколько закэшированных форм анонимно и сравните токены. Если у анонима три разных токена — формы собраны в разные интервалы, и самые старые уже мертвы.

Решение

• в разметке формы — пустое поле токена: value="";
• токен выдаёт отдельный некэшируемый адрес (с nocache_headers());
• скрипт запрашивает токен при первом фокусе на поле формы — а не при загрузке страницы, чтобы не тратить запрос на каждого посетителя;
• если сервер ответил кодом «плохой токен», скрипт берёт новый и повторяет отправку сам.

async function getToken(form) {
  const r = await fetch('/wp-json/forms/v1/token', { cache: 'no-store' });
  form.querySelector('[name=token]').value = (await r.json()).token;
}

form.addEventListener('focusin', () => getToken(form), { once: true });

async function send(form, retried = false) {
  const res = await post(form);
  if (res.code === 'bad_token' && !retried) {
    await getToken(form);
    return send(form, true);
  }
  return res;
}

Открытый вопрос: залогиненные

Если кэш блоков не обходится для залогиненных, администратор может запечь в кэш форму со своим токеном. С токеном из отдельного адреса это уже не страшно — в разметке токена нет. Но вопрос «обходить ли кэш блоков для администратора» у нас пока без единого ответа.