Facebook Pixel неявный PageView

Я пытаюсь добавить отслеживание Facebook Pixel в свое приложение Angular.

В качестве первого шага я просто добавил базовый код пикселя Facebook в один из моих базовых html-файлов следующим образом:

!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
document,'script','https://connect.facebook.net/en_US/fbevents.js');

Я обнаружил, что как только я инициализирую свой пиксель fbq('init', '1234567890');, событие PageView отправляется неявно.

Хотя я вижу, что это несколько полезно для среднего стандартного приложения, это нежелательное поведение при работе с такими фреймворками, как Angular, чьи структуры URL плохо обрабатываются fbq. Например. www.hi.com/#/hello регистрируется просто как www.hi.com.

Кто-нибудь сталкивался с этой проблемой или нашел лучший способ интеграции Facebook Pixel с Angular? Я видел несколько примеров, в которых упоминаются Angular и FBQ, а также несколько устаревший плагин Angular. Кажется, никто из них не упоминает об этом.


facebook-pixel
person Jovani    schedule 11.04.2016    source источник

Ответы (2)


arrow_upward
11
arrow_downward

Похоже, пиксель Facebook слушает метод pushState() API истории браузера и автоматически отслеживает события PageView.

Вы можете отключить это, установив для параметра disablePushState значение true в объекте fbq.

Таким образом, код будет выглядеть так:

!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
document,'script','https://connect.facebook.net/en_US/fbevents.js');

fbq('init', '1234567890');
fbq.disablePushState = true;

После этого вы можете использовать плагин Angulartics Facebook Pixel или вызвать window.fbq('track', 'PageView'); вручную в своем коде. .

Обратите внимание, что это недокументированный метод, и его работа в будущем не гарантируется! Надеемся, что в будущем Facebook предоставит документированный способ сделать это. Кредиты относятся к этому сообщению в блоге от "Джоша" .

Обновление, июль 2017 г. Это было рассмотрено в блоге Facebook, так что я думаю, что оно официально поддерживается: Пометка одностраничных приложений с помощью пикселя Facebook.

person lari    schedule 01.07.2016
comment
fbq.disablePushState = true; также упоминается в документации для разработчиков здесь: developers.facebook.com /docs/marketing-api/audiences-api/pixel Это также решение для моего веб-приложения Rails/Turbolinks, которое ведет себя как SPA. В противном случае событие PageView отслеживается неявно при клике, а другое — после окончательной загрузки страницы с помощью Turbolinks. - person Mike Lieser; 11.11.2020

arrow_upward
1
arrow_downward

если вы хотите отслеживать с помощью пикселя FB, я предлагаю вам компонент angularjs:

пиксель Facebook angulatrics

Отслеживание страниц выполняется angulatrics автоматически, поэтому вам не нужно об этом заботиться.

npm install angulartics-facebook-pixel

Затем добавьте angulartics.facebook.pixel в качестве зависимости для вашего приложения:

require('angulartics')

angular.module('myApp', [
  'angulartics', 
  require('angulartics-facebook-pixel')
]);

см. также: https://github.com/angulartics/angulartics

Я надеюсь, что это помогает.

person thegio    schedule 11.04.2016
comment
Эй, тегио! Спасибо за вашу помощь. Я немного изучил их и собирался попробовать плагин, когда заметил неявное поведение кода пикселя. Я дам им шанс, спасибо. - person Jovani; 12.04.2016
comment
Как я и подозревал. У меня все это установлено и настроено, но это мало что меняет. Я думаю, что Angulartics работает хорошо, но плагин Facebook Pixel, возможно, устарел. Он не сообщает так, как говорят документы Angulartics. Код Facebook Pixel по-прежнему запускает PageViews на каждой странице, и они по-прежнему просто регистрируются как исходящие из корневого URL-адреса, а не из маршрута Angular. - person Jovani; 12.04.2016