narkq / react-yandex-metrika

React component for Yandex.Metrika
127 stars 25 forks source link

Не считается время на странице, вебвизор без верстки #23

Open nadam131 opened 5 years ago

nadam131 commented 5 years ago

На React SPA проекта с SSR понадобилось подключить Яндекс Метрику. Следовал строго по инструкции.

В App.js сделал импорты:

import { YMInitializer } from 'react-yandex-metrika'
import ym from 'react-yandex-metrika'

В этом же файле добавил хит, при переходе на новый стейт

componentDidUpdate(prevProps) {
        if (prevProps.location !== this.props.location) {
            console.log('hit')
            ym('hit', prevProps.location.pathname)
        }
   }

Отправляю предыдущую страницу, т.к если отправлять текущую, в метрике не сходятся заголовки.

Сам инициализатор кидаю в том же App.js

<ThemeProvider theme={themeDefault}>
    .....            
   <YMInitializer
       accounts={[123456]}
       options={{ webvisor: true }}
       version="2"
     />
    ....
</ThemeProvider>

Итог Хиты в метрику приходят, но есть несколько проблем:

  1. Не считается время проведенное на каждой странице. Общее время выводится только на странице входа.

image

  1. В вебвизоре почему-то каша

image

sneerin commented 5 years ago

Та же проблема, это вообще реально на SPA получить результаты как у fullstory?

ralexandr commented 5 years ago

Столкнулся с таким же багом. При этом сервис logRocket стили и разметку погружает как надо. Почему метрика не хочет нормально отображать UI - не понятно. Если кто-то смог решить/обойти эту проблему, дайте знать, пожалуйста

slavau commented 5 years ago

Hi everyone, I have exactly the same problem, webvisor records sessions on my SPA without css styles, only content. Has anyone been able to resolve this issue? Help please, without that yandex metrica does not give much benefits for me. Thanks

belimposition commented 4 years ago

Вебвизор не умеет в CSSOM - его нужно отключить и возможно это поможет увидеть стили на страницах. у меня сейчас такая же проблема с моим next.js + styled-components приложением, пока решения не нашёл

The webvisor doesn't know how to do CSSOM - you need to turn it off and maybe it will help to see the styles on the pages.

ThemNumbers commented 1 year ago

Вебвизор не умеет в CSSOM - его нужно отключить и возможно это поможет увидеть стили на страницах. у меня сейчас такая же проблема с моим next.js + styled-components приложением, пока решения не нашёл

The webvisor doesn't know how to do CSSOM - you need to turn it off and maybe it will help to see the styles on the pages.

Удалось найти решение в итоге?

irondimk commented 2 months ago

Вебвизор не умеет в CSSOM - его нужно отключить и возможно это поможет увидеть стили на страницах. у меня сейчас такая же проблема с моим next.js + styled-components приложением, пока решения не нашёл The webvisor doesn't know how to do CSSOM - you need to turn it off and maybe it will help to see the styles on the pages.

Удалось найти решение в итоге?

У меня styled-components + React, аналогичная проблема, в том что вебвизор яндекса не отображает стили из-за CSSOM.

Моё решение: обернул проект StyleSheetManager и передал атрибут disableCSSOMInjection. Да, это добавит времени рендеру стилей, но видеть опыт пользователей в вебвизоре приоритетнее.