itube-specs 0.0.1008 → 0.0.1010

package/components/info/model.vue

@@ -224,6 +224,9 @@ const shareModelCard = computed<IModelCard>(() => ({
   title: props.card.title,
   videosCount: props.card.videosCount,
   thumbUrl: props.card.img || '',
+  primaryImageSmallUrl: props.card.img || undefined,
+  primaryImageSmallAvifUrl: props.card.imgAvifUrl,
+  gender: props.card.gender,
   guid: props.card.guid || '',
   parameters: [],
   country: shareCountry.value,

package/components/layout/header.vue

@@ -10,16 +10,16 @@
       glow
       class="layout-header__logo"
     />
-    <LayoutNiche
-      class="layout-header__niche _from-sd"
-      icon-size="20"
-    />
-
     <LayoutNotifications
       v-if="featureFlags.FeatureFollowEnabled"
       class="layout-header__notifications"
     />
 
+    <LayoutNiche
+      class="layout-header__niche _from-sd"
+      icon-size="20"
+    />
+
     <div
       ref="languageRef"
       class="layout-header__language _from-sd"
@@ -147,6 +147,12 @@ function closeLanguage() {
   }
 }
 
+.layout-header.--no-notifications .layout-header__niche {
+  @include from-br($brkpnt-burger) {
+    grid-column: 3;
+  }
+}
+
 .layout-header.--no-notifications .layout-header__language {
   @include from-br($brkpnt-burger) {
     grid-column: 4;
@@ -195,11 +201,11 @@ function closeLanguage() {
 /**
  * Поиск стоит строго по центру ШАПКИ, а не по центру свободного места: он растянут
  * на всю строку сетки и центрирован `justify-self`. Иначе центр уезжал влево —
- * правая группа (ниша, колокольчик, язык, вход) шире логотипа, и с добавлением
+ * правая группа (колокольчик, ниша, язык, вход) шире логотипа, и с добавлением
  * переключателя ниш перекос дошёл до сотни пикселей.
  *
  * Наезжать при этом не на что: по обе стороны резервируется `--header-side-space`
- * — ширина более широкой (правой) группы: ниша 54 + колокольчик, язык и вход.
+ * — ширина более широкой (правой) группы: колокольчик, ниша 54, язык и вход.
  * Считается БЕЗ бокового паддинга шапки, потому что `100%` у поиска — это уже
  * контентная ширина. Не хватило места — поиск сужается, а боковые группы остаются
  * на своих местах. Значение вынесено в переменную: у сайта без переключателя ниш
@@ -240,7 +246,7 @@ function closeLanguage() {
 
 .layout-header__niche {
   @include from-br($brkpnt-burger) {
-    grid-column: 3;
+    grid-column: 4;
     grid-row: 1;
   }
 }
@@ -253,7 +259,7 @@ function closeLanguage() {
 
 .layout-header__notifications {
   @include from-br($brkpnt-burger) {
-    grid-column: 4;
+    grid-column: 3;
     grid-row: 1;
   }
 }

package/components/layout/language.vue

@@ -151,6 +151,7 @@ const {
   countriesItems,
   setCountry,
   loadCountries,
+  withCountryCarry,
 } = useClientCountry();
 
 // Именительный падеж считает ICU, своей таблицы имён нет. Пустой `place` = служебный код
@@ -213,7 +214,7 @@ function changeLocale(locale: string) {
   emit('change', locale);
   rememberLangChoice(locale);
   localeCookie.value = locale;
-  window.location.href = switchLocalePath(locale);
+  window.location.href = withCountryCarry(switchLocalePath(locale));
 }
 
 async function changeCountry(item: ISelectItem) {

package/composables/use-auth-cookie.ts

@@ -0,0 +1,35 @@
+import { useSharedCookieDomain } from './use-shared-cookie-domain';
+
+const AUTH_COOKIE = 'jwtoken';
+const EXPIRED = 'expires=Thu, 01 Jan 1970 00:00:00 GMT';
+
+/**
+ * Кука авторизации `jwtoken`. У локалей на поддоменах — общая для всех языков (`.a.com`), иначе
+ * вход на `ru.a.com` не виден на `a.com`. Старые host-only куки (до общего домена) и куку на
+ * `xDomain` гасит при входе и выходе, чтобы под одним именем не висели две разные.
+ */
+export const useAuthCookie = () => {
+  const domain = useSharedCookieDomain();
+  const xDomain = useRuntimeConfig().public.xDomain as string | undefined;
+  const cookie = useCookie<string | null | undefined>(AUTH_COOKIE, { path: '/', secure: true, httpOnly: false, sameSite: 'lax', domain });
+
+  function expireStale() {
+    if (!import.meta.client) return;
+    const stale = [undefined, xDomain].filter(item => item !== domain);
+    for (const item of stale) {
+      document.cookie = [`${AUTH_COOKIE}=`, 'path=/', item ? `domain=${item}` : '', EXPIRED, 'Secure'].filter(Boolean).join('; ');
+    }
+  }
+
+  function setToken(token: string) {
+    expireStale();
+    cookie.value = token;
+  }
+
+  function clearToken() {
+    cookie.value = null;
+    expireStale();
+  }
+
+  return { cookie, setToken, clearToken };
+};

package/composables/use-client-country.ts

@@ -1,9 +1,20 @@
 import type { ISelectItem } from '../types';
 import { isoCodeMap } from '../utils/iso-code-map';
 import { DictionariesApiService } from '../services/api/dictionaries.service';
+import { useSharedCookieDomain } from './use-shared-cookie-domain';
+import { COUNTRY_CARRY_PARAM, hasLocaleSubdomains, type LocaleSubdomains } from '../config/locale-domains';
 
-/** Ручной выбор страны переживает перезагрузку год — читает его server/middleware/country.ts */
-const COOKIE_OPTS = { maxAge: 60 * 60 * 24 * 365, path: '/', secure: true, sameSite: 'lax' as const };
+/**
+ * Ручной выбор страны переживает перезагрузку год — читает его server/middleware/country.ts. У
+ * локалей на поддоменах кука общая для всех языков, иначе смена языка теряет выбор.
+ */
+const cookieOpts = () => ({
+  maxAge: 60 * 60 * 24 * 365,
+  path: '/',
+  secure: true,
+  sameSite: 'lax' as const,
+  domain: useSharedCookieDomain(),
+});
 
 /**
  * Единый источник страны клиента: ISO-код (гео-заголовок прокси или ручной выбор
@@ -24,7 +35,7 @@ export const useClientCountry = () => {
   // падежей и артиклей в ECMA-402 нет. Ручной выбор страны в селекторе перезагружает
   // страницу, поэтому клиенту словарь не нужен.
   const place = useState<string>('clientCountryPlace', () => '');
-  const codeCookie = useCookie<string | null>('clientCountryCode', COOKIE_OPTS);
+  const codeCookie = useCookie<string | null>('clientCountryCode', cookieOpts());
 
   /** ISO-код → имя файла флага (у части стран код локали отличается от кода страны) */
   const toIcon = (value: string) => {
@@ -71,5 +82,19 @@ export const useClientCountry = () => {
     }
   };
 
-  return { code, icon, place, flagSrc, countriesItems, setCountry, loadCountries };
+  /**
+   * Страна не зависит от языка. Обычно её переносит общая cookie, а где её не бывает (localhost, IP
+   * при локалях на поддоменах) — ручной выбор едет в URL перехода на другую локаль.
+   */
+  const withCountryCarry = (url: string): string => {
+    const subdomains = useRuntimeConfig().public.locales?.subdomains as LocaleSubdomains | undefined;
+    if (!import.meta.client || !hasLocaleSubdomains(subdomains) || useSharedCookieDomain() || !codeCookie.value) return url;
+
+    const target = new URL(url, window.location.href);
+    target.searchParams.set(COUNTRY_CARRY_PARAM, codeCookie.value);
+
+    return target.toString();
+  };
+
+  return { code, icon, place, flagSrc, countriesItems, setCountry, loadCountries, withCountryCarry };
 };

package/composables/use-lang-choice.ts

@@ -1,4 +1,4 @@
-import { LANG_COOKIE, baseDomainFromHost, hasLocaleSubdomains, type LocaleSubdomains } from '../config/locale-domains';
+import { LANG_COOKIE, hasLocaleSubdomains, sharedCookieDomain, type LocaleSubdomains } from '../config/locale-domains';
 
 /**
  * Явный выбор языка на сайтах с локалями на поддоменах. Пишет cookie `lang` (значение — поддомен
@@ -12,8 +12,7 @@ export const useLangChoice = () => {
   function rememberLangChoice(code: string) {
     if (!import.meta.client || !hasLocaleSubdomains(subdomains)) return;
 
-    const base = baseDomainFromHost(window.location.host, subdomains);
-    const isLocalhost = /^localhost(?::\d+)?$|^\d+\.\d+\.\d+\.\d+/.test(base);
+    const domain = sharedCookieDomain(window.location.host, subdomains);
 
     const parts = [
       `${LANG_COOKIE}=${subdomains[code] || ''}`,
@@ -21,8 +20,7 @@ export const useLangChoice = () => {
       `max-age=${60 * 60 * 24 * 365}`,
       'samesite=lax',
     ];
-    // на localhost domain-атрибут с точкой браузеры отбрасывают
-    if (!isLocalhost) parts.push(`domain=.${base}`);
+    if (domain) parts.push(`domain=${domain}`);
     if (window.location.protocol === 'https:') parts.push('secure');
 
     document.cookie = parts.join('; ');

package/composables/use-shared-cookie-domain.ts

@@ -0,0 +1,13 @@
+import { sharedCookieDomain, type LocaleSubdomains } from '../config/locale-domains';
+
+/**
+ * `domain` для cookie, общих для всех языковых поддоменов (авторизация, выбор страны): `.a.com`
+ * с `ru.a.com`. У префиксных локалей, на localhost и IP — `undefined` (host-only).
+ */
+export const useSharedCookieDomain = (): string | undefined => {
+  const subdomains = useRuntimeConfig().public.locales?.subdomains as LocaleSubdomains | undefined;
+  const headers = import.meta.server ? useRequestHeaders(['x-forwarded-host', 'host']) : {};
+  const host = import.meta.server ? headers['x-forwarded-host'] || headers['host'] || '' : window.location.host;
+
+  return sharedCookieDomain(host, subdomains);
+};

package/composables/use-user.ts

@@ -7,6 +7,7 @@ import type {
   IRegistrateForm,
   IChangeEmail
 } from '../types';
+import { useAuthCookie } from './use-auth-cookie';
 
 function omit<T extends object, K extends keyof T>(obj: T, keys: K[]): Omit<T, K> {
   const result = {} as Omit<T, K>;
@@ -24,10 +25,11 @@ function omit<T extends object, K extends keyof T>(obj: T, keys: K[]): Omit<T, K
  */
 export const useUser = (apiService) => {
   const { show, showError } = useSnackbar();
+  const { cookie: authCookie, setToken, clearToken } = useAuthCookie();
   const register = async (form: IRegistrateForm) => {
     const response = await apiService.register(form);
     if (response) {
-      useCookie('jwtoken', { path: '/', secure: true, httpOnly: false }).value = response.token;
+      setToken(response.token);
       await getProfile();
     }
   };
@@ -64,7 +66,7 @@ export const useUser = (apiService) => {
   const login = async (form: ILoginForm) => {
     const response = await apiService.login(form);
     if (response) {
-      useCookie('jwtoken', { path: '/', secure: true, httpOnly: false }).value = response.token;
+      setToken(response.token);
       await getProfile();
     }
   };
@@ -111,10 +113,7 @@ export const useUser = (apiService) => {
 
   const signOut = () => {
     const { generateLink } = useGenerateLink();
-    const cookie = useCookie('jwtoken', { path: '/', secure: true, httpOnly: false });
-    cookie.value = undefined; // или null
-    const domain = useRuntimeConfig().public.xDomain;
-    document.cookie = `jwtoken=; path=/; domain=${domain}; expires=Thu, 01 Jan 1970 00:00:00 GMT; Secure`;
+    clearToken();
 
     const profile = useState<IProfileData | null>('profileData');
     profile.value = null;
@@ -124,7 +123,7 @@ export const useUser = (apiService) => {
   };
 
   return {
-    isAuthorized: computed(() => !!useCookie('jwtoken').value),
+    isAuthorized: computed(() => !!authCookie.value),
     register,
     login,
     password,

package/config/__tests__/locale-domains.test.ts

@@ -6,6 +6,7 @@ import {
   localeDomains,
   localeFromHost,
   localesWithDomains,
+  sharedCookieDomain,
   subdomainsOf,
 } from '../locale-domains';
 
@@ -36,6 +37,15 @@ describe('locale-domains', () => {
     expect(baseDomainFromHost('api.a.com', SUBS)).toBe('api.a.com');
   });
 
+  it('общий домен cookie: базовый с точкой, без поддоменов и на localhost/IP — host-only', () => {
+    expect(sharedCookieDomain('ru.a.com', SUBS)).toBe('.a.com');
+    expect(sharedCookieDomain('a.com', SUBS)).toBe('.a.com');
+    expect(sharedCookieDomain('jp.stage.a.com:8080', SUBS)).toBe('.stage.a.com');
+    expect(sharedCookieDomain('ru.localhost:3000', SUBS)).toBeUndefined();
+    expect(sharedCookieDomain('192.168.1.5:3000', SUBS)).toBeUndefined();
+    expect(sharedCookieDomain('ru.a.com', {})).toBeUndefined();
+  });
+
   it('локаль по хосту, иначе дефолтная', () => {
     expect(localeFromHost('jp.a.com', SUBS, 'en')).toBe('ja');
     expect(localeFromHost('a.com', SUBS, 'en')).toBe('en');

package/config/locale-domains.ts

@@ -14,6 +14,12 @@
 /** Имя cookie явного выбора языка. Значение — поддомен локали, у дефолтной пусто. */
 export const LANG_COOKIE = 'lang';
 
+/**
+ * Query, в котором переключатель языка переносит ручной выбор страны на хост другой локали, когда
+ * общей cookie нет (localhost, IP). Читает и тут же убирает server/middleware/country.ts.
+ */
+export const COUNTRY_CARRY_PARAM = 'country';
+
 /** Код локали → её поддомен. У дефолтной локали поддомена нет. */
 export type LocaleSubdomains = Readonly<Record<string, string>>;
 
@@ -63,6 +69,20 @@ export function baseDomainFromHost(host: string, subdomains: LocaleSubdomains):
   return Object.values(subdomains).includes(firstLabel) ? clean.slice(firstLabel.length + 1) : clean;
 }
 
+/**
+ * Атрибут `domain` для cookie, общих для всех языковых поддоменов (выбор языка, страны):
+ * `.a.com` с `ru.a.com` и `a.com`. Без поддоменов, на localhost и IP — `undefined` (host-only):
+ * domain-атрибут без точки в имени браузеры там отбрасывают.
+ */
+export function sharedCookieDomain(host: string, subdomains?: LocaleSubdomains | null): string | undefined {
+  if (!hasLocaleSubdomains(subdomains)) return undefined;
+
+  const base = baseDomainFromHost(host, subdomains as LocaleSubdomains).replace(/:\d+$/, '');
+  if (base === 'localhost' || /^\d+\.\d+\.\d+\.\d+$/.test(base)) return undefined;
+
+  return `.${base}`;
+}
+
 /** Код локали по фактическому хосту (по языковому поддомену), иначе дефолтная. */
 export function localeFromHost(host: string, subdomains: LocaleSubdomains, defaultCode: string): string {
   const firstLabel = cleanHost(host).split('.')[0];

package/middleware/auth.global.ts

@@ -1,8 +1,10 @@
 // Глобальный auth-middleware: при наличии jwtoken-куки подтягивает профиль в
 // useState('profileData') один раз за сессию (если ещё не загружен). На 400/401
 // считает токен невалидным и чистит куку. Работает и на SSR, и на клиенте.
+import { useAuthCookie } from '../composables/use-auth-cookie';
+
 export default defineNuxtRouteMiddleware(async () => {
-  const cookie = useCookie('jwtoken', { path: '/', secure: true, httpOnly: false, sameSite: 'lax' });
+  const { cookie, clearToken } = useAuthCookie();
   if (!cookie.value) return;
 
   const profileData = useState<any>('profileData', () => null);
@@ -23,11 +25,7 @@ export default defineNuxtRouteMiddleware(async () => {
     profileData.value = await fetchProfile();
   } catch (error: any) {
     if (error?.statusCode === 400 || error?.statusCode === 401) {
-      cookie.value = null;
-      if (import.meta.client) {
-        // Nuxt-кука не всегда удаляется на клиенте с нужным domain — дочищаем вручную
-        document.cookie = `jwtoken=; path=/; domain=${runtimeConfig.public.xDomain}; expires=Thu, 01 Jan 1970 00:00:00 GMT; Secure`;
-      }
+      clearToken();
     } else {
       console.error('Error get profile:', error);
     }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "itube-specs",
   "type": "module",
-  "version": "0.0.1008",
+  "version": "0.0.1010",
   "main": "./nuxt.config.ts",
   "types": "./types/index.d.ts",
   "scripts": {

package/plugins/countries.server.ts

@@ -6,6 +6,7 @@
 // сюда не кладётся. Полный список стран лениво догружает селектор языка на клиенте.
 import { getCountryPlace } from '../lib/countries';
 import { getPathLocale } from '../runtime/utils/server/get-path-locale';
+import { hasLocaleSubdomains, localeFromHost, type LocaleSubdomains } from '../config/locale-domains';
 
 /** Опции легаси-кук — нужны только чтобы их погасить (см. ниже) */
 const LEGACY_COOKIE_OPTS = { path: '/', secure: true, sameSite: 'lax' as const };
@@ -26,7 +27,14 @@ export default defineNuxtPlugin(async () => {
 
   if (!code) return;
 
-  const { codes, default: defaultCode } = useRuntimeConfig().public.locales as { codes: string[], default: string };
+  const { codes, default: defaultCode, subdomains } = useRuntimeConfig().public.locales as {
+    codes: string[], default: string, subdomains?: LocaleSubdomains
+  };
+  // Локаль i18n тут ещё не готова: у локалей на поддоменах она в хосте, у префиксных — в пути
+  const host = event?.node.req.headers['x-forwarded-host'] as string || event?.node.req.headers.host || '';
+  const locale = hasLocaleSubdomains(subdomains)
+    ? localeFromHost(host, subdomains as LocaleSubdomains, defaultCode)
+    : getPathLocale(event?.path || '', codes, defaultCode);
 
-  countryPlace.value = await getCountryPlace(code, getPathLocale(event?.path || '', codes, defaultCode));
+  countryPlace.value = await getCountryPlace(code, locale);
 });

package/server/middleware/country.ts

@@ -1,7 +1,19 @@
 // Определяет страну клиента и кладёт ISO-код в event.context.clientCountryCode:
 // сначала из cookie `clientCountryCode` (ручной выбор в селекторе), иначе из
 // заголовков прокси (Cloudflare `cf-ipcountry` / `x-country-code` / `x-country`).
+// Выбор, перенесённый переключателем языка в query (там, где общей cookie между языковыми
+// поддоменами нет), кладётся в cookie этого хоста, а query убирается редиректом.
+import { COUNTRY_CARRY_PARAM } from '../../config/locale-domains';
+
 export default defineEventHandler((event) => {
+  const carried = getQuery(event)[COUNTRY_CARRY_PARAM];
+  if (event.method === 'GET' && typeof carried === 'string' && /^[a-z]{2}$/i.test(carried)) {
+    setCookie(event, 'clientCountryCode', carried.toLowerCase(), { maxAge: 60 * 60 * 24 * 365, path: '/', secure: true, sameSite: 'lax' });
+    const url = getRequestURL(event);
+    url.searchParams.delete(COUNTRY_CARRY_PARAM);
+    return sendRedirect(event, `${url.pathname}${url.search}`, 302);
+  }
+
   const cookie = getCookie(event, 'clientCountryCode');
   if (cookie) {
     event.context.clientCountryCode = cookie.trim().toLowerCase();

package/server/utils/__tests__/locale-redirect.test.ts

@@ -44,6 +44,14 @@ describe('resolveLocaleRedirect', () => {
     expect(resolveLocaleRedirect({ ...base, method: 'POST' }).location).toBeUndefined();
   });
 
+  it('переход с самого сайта — выбор языка, без редиректа', () => {
+    const withReferer = (referer: string) => resolveLocaleRedirect({ ...base, headers: { ...base.headers, referer } });
+    expect(withReferer('https://jp.a.com/models')).toEqual({ vary: true });
+    expect(withReferer('https://a.com/')).toEqual({ vary: true });
+    expect(withReferer('https://google.com/search?q=a')).toEqual({ vary: true, location: 'https://jp.a.com/videos?page=2' });
+    expect(withReferer('not a url')).toEqual({ vary: true, location: 'https://jp.a.com/videos?page=2' });
+  });
+
   it('неизвестное значение cookie — как отсутствие выбора', () => {
     expect(resolveLocaleRedirect({ ...base, langCookie: 'xx' }).location).toBe('https://jp.a.com/videos?page=2');
   });

package/server/utils/locale-redirect.ts

@@ -33,6 +33,17 @@ function isKnownLangChoice(value: string, subdomains: LocaleSubdomains, codes: r
   return !sub || Object.values(subdomains).includes(sub) || codes.includes(sub);
 }
 
+/** Пришёл ли запрос со страницы этого же сайта: базовый домен Referer совпадает с текущим. */
+function isSameSiteReferer(referer: string | undefined, host: string, subdomains: LocaleSubdomains): boolean {
+  if (!referer) return false;
+  try {
+    return baseDomainFromHost(new URL(referer).host, subdomains) === baseDomainFromHost(host, subdomains);
+  }
+  catch {
+    return false;
+  }
+}
+
 export interface ILocaleRedirectInput {
   method: string
   path: string
@@ -54,7 +65,8 @@ export interface ILocaleRedirectDecision {
  *
  * Не уводит: не-GET, служебные пути и не-html, ботов (иначе поисковик индексирует не то,
  * что объявлено в canonical/hreflang), заход уже на языковой поддомен, явный выбор в cookie
- * `lang`.
+ * `lang`, переход с самого сайта (Referer на том же базовом домене) — это выбор языка
+ * переключателем, а cookie могла не доехать: на localhost она живёт только на своём поддомене.
  */
 export function resolveLocaleRedirect(input: ILocaleRedirectInput): ILocaleRedirectDecision {
   const { method, path, headers, langCookie, subdomains, codes, defaultCode } = input;
@@ -74,6 +86,8 @@ export function resolveLocaleRedirect(input: ILocaleRedirectInput): ILocaleRedir
 
   if (langCookie !== undefined && isKnownLangChoice(langCookie, subdomains, codes)) return skip;
 
+  if (isSameSiteReferer(headers['referer'], host, subdomains)) return { vary: true };
+
   const acceptLanguage = headers['accept-language'] || '';
   if (!acceptLanguage) return skip;