GoldenLine
Zaloguj się
Wojciech Mazurek

Wojciech Mazurek właściciel, PPHU
Neuron

Temat: Skrypt GA - Czy ktoś by mnie mógł oświecić jak to działa ?

Witam
Na co dzień programuje w objectpascalu i dopiero od niedawna zgłębiam tajniki JavaScriptu
i dopiero zaczynam go wyczuwać .

Nie mogę zatrybić jak działa, a w zasadzie jak jest "wiązany" ze stroną i używany skrypt google analist :



  var _gaq = _gaq || [];

  _gaq.push(['_setAccount', 'UA-294535301-1']);

  _gaq.push(['_trackPageview']);



  (function() {

    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;

    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';

    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);

  })();


Rozumiem (chyba) że dopisywany do treści strony jest skrypt ga.js pobierany z serwera google ale co dalej?

Jak by ktoś mi to wytłumaczył w prostych żołnierskich słowach byłbym wdzięczny ;)
Link do wypowiedziLink
Roch Szatan

Roch Szatan As

Temat: Skrypt GA - Czy ktoś by mnie mógł oświecić jak to działa ?

Z tego co się orientowałem kiedyś to jest jakoś tak
- przy pomocy ga.js skrypt wrzuca inne dokumenty .js w <head> zobacz w kod przy pomocy firebuga
- skrypt tworzy globalny obiekt i przy pomocy różnych metod pobiera dane o twojej przeglądarce adres IP lokalizacje itp...
- i wysyła postem do googla
Jakoś tak to działa :)Michał Szaniewski edytował(a) ten post dnia 13.09.12 o godzinie 15:19
Link do wypowiedziLink
Marcin Kubala

Marcin Kubala

Temat: Skrypt GA - Czy ktoś by mnie mógł oświecić jak to działa ?

var _gaq = _gaq || [];

Do zmiennej lokalnej (var, zasięg bieżącego bloku oraz wszystkich zagnieżdżonych w nim) _gag wrzucamy wartość _gag (zmienna globalna, albo jakiś domknięcie?) lub pustą tablicę, jeśli ta nie istnieje.
Takie konstrukcje wykorzystuje się m.in. do tworzenia własnych przestrzeni nazw (zobacz np. https://github.com/qcadoo/qcadoo/blob/master/qcadoo-vie..., linie 24-28)
_gaq.push(['_setAccount', 'UA-294535301-1']);

_gaq.push(['_trackPageview']);

Modyfikujemy naszą tablicę _gag, dodając na jej koniec elementy (w tym wypadku inne tablice)
https://developer.mozilla.org/en-US/docs/JavaScript/Ref...

A ta dziwna konstrukcja (funkcja w nawiasie, (function(..) {..})(..) lub (function(..) { .. }(..)) ) to IIFE - Immediately-Invoked Function Expression, tutaj jest to dość fajnie opisane: http://benalman.com/news/2010/11/immediately-invoked-f...

Co się dzieje wewnątrz funkcji?
var ga = document.createElement('script');

Tworzony jest element (obiekt DOM) <script> i przypisywany do zmiennej ga. Użycie var ogranicza jej zasięg do bieżącego bloku oraz kolejnych zagnieżdżeń.
ga.type = 'text/javascript';

ga.async = true;

ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';

Naszemu elementowi <script/> ustawiamy takie atrybuty jak: type, src (lokalizacja w której znajduje się skrypt JS) oraz async (http://www.w3schools.com/html5/att_script_async.asp)
Nasza zmienna w tm momencie przechowuje następujący element:
<script type="text/javascript" async="true" src="..google-analytics.com/ga.js"></script>
var s = document.getElementsByTagName('script')[0];

Znajdujemy pierwsze wystąpienie elementu <script /> na stronie.
Zwróć uwagę, że w tej chwili nasz element jeszcze nie został umieszczony na stronie (w hierarchii DOM obiektu document).
Tutaj Pan Michał chyba nie do końca ma rację - skrypt zostanie dopisany tam gdzie występuje tag <script /> po raz pierwszy.
Jeśli Umieścisz sobie wszystkie skrypty na końcu <body>, nowy skrypt zostanie dodany wlasnie tam (jako pierwszy).
s.parentNode.insertBefore(ga, s);

Umieszczamy nasz nowo utworzony element <script /> przed znalezionym w poprzednim kroku elementem (dosłownie: weź pierwszy znaleziony el. <script> (s), przejdź do jego rodzica/el. w którym został on osadzony (.parentNode) i wstaw do niego ga przed elementem s (.insertBefore(ga, s))).

Więcej o tego typu technikach znajdziesz w sieci pod hasłem "JavaScript DOMscripting".

Zawartość IIFE zostanie "zewaluowana" w momencie parsowania ('wczytania' skryptu).

Mam nadzieję, że pomogłem.
Link do wypowiedziLink
Wojciech Mazurek

Wojciech Mazurek właściciel, PPHU
Neuron

Temat: Skrypt GA - Czy ktoś by mnie mógł oświecić jak to działa ?

Marcin Kubala:
Mam nadzieję, że pomogłem.

Noooo
Szkoda że można przybić tylko jednego plusa ;)

Jednak nadal nie wiem tego co mnie najbardziej ciekawi - w którym momencie następuje wysłanie danych do serwerów google. Domyślałem się że skrypt modyfikuje kod choć w podglądzie strony w analizie w chrome widać tylko jedną linię kodu która nie pasuje do źródła i to w sekcji head.

W zasadzie to teraz pisząc uświadomiłem sobie że w kodzie dowolnej biblioteki można użyć funkcji które silnik przeglądarki znajdzie i wywoła, np funkcji $(document).ready choć w tej chwili nie wiem czy można ją umieszczać w wielu miejscach - muszę sprawdzić.
Link do wypowiedziLink
Krzysztof Safjanowski

Krzysztof Safjanowski Senior JavaScript
Lead Developer

Temat: Skrypt GA - Czy ktoś by mnie mógł oświecić jak to działa ?

Wojciech Mazurek:

W zasadzie to teraz pisząc uświadomiłem sobie że w kodzie dowolnej biblioteki można użyć funkcji które silnik przeglądarki znajdzie i wywoła, np funkcji $(document).ready choć w tej chwili nie wiem czy można ją umieszczać w wielu miejscach - muszę sprawdzić.

Metoda addEventListener pozwala zarejestrować obserwatora zdarzeń dla określonego typu zdarzenia na elemencie. Można znaleźć ją w ga.js. – można dowolnie wiele obserwatorów zarejestrować dla dowolnego zdarzenia, np. load

A w kodzie można znaleźć także (fragment funkcji do POST’owania zebranych danych):


(c = W.XMLHttpRequest) c = new c, "withCredentials" in c && (m = c, m.open("POST", b, h), m.setRequestHeader("Content-Type", "text/plain"))
Link do wypowiedziLink
« Wróć do tematów
Odpowiedz

Podobne tematy





Wyślij zaproszenie do
Anuluj