CMS Catalog - Ecommerce
- Автор темы lsnull
- Дата начала
AchiLLeSS
Мой дом здесь!
- Регистрация
- 13 Дек 2006
- Сообщения
- 867
- Реакции
- 446
когда человек в строке поиска вбивает "купить айфон18промакс"
lsnull
Постоялец
- Регистрация
- 18 Сен 2013
- Сообщения
- 408
- Реакции
- 135
- Автор темы
- #25
FIX
Товары с истекшим сроком публикации отображались в ленте из-за отсутствия проверки даты окончания (expires_at) в SQL-запросах и клиентском слое ленты подписок:
Причина
- Серверные эндпоинты ленты подписок (/api/subscriptions/feed и /api/subscriptions/feed/filters):
- В SQL-запросах производилась выборка только по флагам активности и черновика (p.is_active = 1 и p.is_draft = 0), но отсутствовало условие проверки актуальности срока публикации: AND (p.expires_at IS NULL OR p.expires_at > CURRENT_TIMESTAMP).
- В результате товары, у которых истек expires_at, продолжали попадать в выборку персональной ленты и подсчет фильтров по категориям/продавцам.
- Клиентская обработка:
- Компонент SubscriptionFeed выводил все полученные с сервера элементы без дополнительной валидации через хелпер isProductActive(...).
Что было исправлено
- На сервере:
- В роутах /api/subscriptions/feed и /api/subscriptions/feed/filters добавлено строгое условие фильтрации AND (p.expires_at IS NULL OR p.expires_at > CURRENT_TIMESTAMP).
- В ответ API добавлены полные поля публикации (expires_at, duration_days, is_active, is_draft, sale_end_at).
- На клиенте:
- В SubscriptionFeed добавлена дополнительная проверка isProductActive(item) перед отображением элементов ленты.
- Оптимизирована загрузка изображений карточек ленты через миниатюры WebP (getProductThumbnailUrl).
lsnull
Постоялец
- Регистрация
- 18 Сен 2013
- Сообщения
- 408
- Реакции
- 135
- Автор темы
- #26
Реализована оптимизация изображений товаров и генерация миниатюр (thumbnails) в формате WebP:
- Структура путей для изображений:
- Оригинал высокого качества: /uploads/products/{id}/orig_<hash>.webp (сжатие WebP с сохранением деталей, максимальный размер до 1920px по большей стороне).
- Оптимизированная миниатюра для карточек: /uploads/products/{id}/thumb_<hash>.webp (компактный квадратный формат 450×450 WebP со сжатием для быстрой загрузки каталога).
- Серверная обработка изображений (sharp):
- При загрузке фото через форму создания или редактирования объявления генерируются оба файла и сохраняются в папку /uploads/products/{id}/.
- При удалении фото или обновлении галереи удаляются как оригинальные файлы, так и соответствующие миниатюры.
- Добавлен on-demand генератор в Express, который при запросе миниатюры может сгенерировать её на лету, если на диске присутствует оригинальное фото.
- Отображение в интерфейсе:
- В карточках каталога, предпросмотре при наведении, корзине и миниатюр используются пути thumb_<hash>.webp.
- При клике на фото, переходе в модальное окно товара и открытии полноэкранного просмотрщика (Lightbox) отображается оригинал orig_<hash>.webp.
В карточки товаров ленты подписок добавлено отображение рейтинга и количества отзывов:
- Серверный слой:
- В эндпоинт /api/subscriptions/feed добавлены подзапросы для расчета среднего рейтинга (rating) и общего количества опубликованных отзывов (reviews_count) по каждому товару.
- Интерфейс и типы:
- Обновлены модели Product и SubscriptionFeedItem с поддержкой полей rating и reviews_count.
- В компоненте SubscriptionFeed (как в режиме Сетка, так и в режиме Список) в нижнюю панель карточки рядом со счетчиком просмотров добавлен блок рейтинга:
- Иконка звезды (Star) с янтарной подсветкой при наличии отзывов.
- Средний балл рейтинга (например, 4.5).
- Количество отзывов в скобках (например, (3)).
- Всплывающая подсказка с подробной информацией о рейтинге и отзывах.
Последнее редактирование:
lsnull
Постоялец
- Регистрация
- 18 Сен 2013
- Сообщения
- 408
- Реакции
- 135
- Автор темы
- #27
Сейчас еще проблема в другом, я хочу проект переписать на Next.js в нем из коробки идет хорошее SEO, то что я не учел в начале... Сейчас оно реализовано, но скорость в разы больше при генерации страницы для роботов.
Все эти SSR, ISR
SSR, вот в Next например - Сервер сайд рендеринг, страницы генерятся на сервере в момент запроса и отдают на клиент весь HTML со всеми метатегами, что нужно для поисковых ботов
lsnull
Постоялец
- Регистрация
- 18 Сен 2013
- Сообщения
- 408
- Реакции
- 135
- Автор темы
- #28
Динамическая серверная инъекция метатегов, Open Graph, Twitter Cards и микроразметки Schema.org / JSON-LD) полностью реализован и расширен для всех ключевых разделов каталога.
Что было реализовано:
- Динамическая генерация SEO-тегов на сервере (seoService):
- Страницы товаров (/product/:slugOrId):
- Заголовок (<title>) с названием, ценой и состоянием товара (например: Professional Studio Microphone — Купить за $129.99 | ListVend Catalog).
- Полные теги Open Graph (og:title, og:description, og:image, product
rice:amount, productrice:currency, product:availability, product:condition). - Карточки Twitter Cards (summary_large_image).
- Структурированные данные Schema.org (Product) в формате JSON-LD: рейтинг, количество отзывов, галерея фотографий, продавец, актуальная цена и наличие на складе.
- Страницы категорий (/category/:slugOrId):
- Индивидуальные метатеги с количеством товаров в категории и диапазоном цен («от $X до $Y»).
- Schema.org разметка CollectionPage и цепочка навигации BreadcrumbList.
- Профили продавцов (/user/:username):
- Рейтинг продавца, количество успешных сделок и число активных товаров.
- Schema.org разметка ProfilePage (Person).
- Главная страница, Лента подписок и Корзина (/, /feed, /cart):
- Метатеги для социальных сетей и поисковиков + поисковое действие WebSite / SearchAction.
- Страницы товаров (/product/:slugOrId):
- Совместимость со SPA-клиентом:
- Поисковые роботы (Яндекс, Google) и краулеры мессенджеров (Telegram, WhatsApp, VK, Facebook, Discord, Twitter) мгновенно получают готовый HTML с нужными метатегами и превью.
- В браузере приложение продолжает работать быстро и плавно как полноценное SPA (с обновлением заголовков на клиенте через хук useSEO).