[HTML/JavaScript] - Entities in URL (&)

[gvanh]

Hallo!

Op iedere pagina van een website wordt onderaan voor mijn statistieken-module een dynamisch plaatje geladen, dat in de URL de screen resolutie en kleurdiepte meegeeft, zoiets als dit:

JavaScript:

        function hit() {
            var lnk = '/stathit.php?act=hit';
            if ( typeof(screen) != 'undefined') {
                 lnk += '&screenres=' + screen.width + 'x' + screen.height;
                 lnk += '&screendepth=' + screen.colorDepth;
            }
            lnk += '&url=' + document.URL;
            lnk += '&language='+escape(navigator.appName=='Netscape' ? navigator.language : navigator.userLanguage);
            img = document.createElement('img');
            img.style.border = '0px';
            img.style.width = '1px';
            img.style.height = '1px';
            img.style.display = 'none';
            document.body.appendChild(img);
        } // hit()
        hit();

In bovenstaand voorbeeld heb ik alle ampersands ingevuld met hun entity (&), zodat de pagina goed valideert in de W3C HTML-validator. Alleen wordt nu het script niet geladen. Als ik de ampersands gewoon als & erin zet, dan werkt het wel, maar dan gaat de validator piepen.

Ook als ik de numerieke entity gebruik (&) wordt het script (stathit.php) niet geladen en dus de hit niet geregistreerd.

Ik heb geprobeerd om unescape te gebruiken, maar dat werkt ook niet.

Wat is de correcte manier om dit af te handelen?

[crisp]

XHTML DTD zeker? In dat geval moet je eens kijken hoe je script-data in een CDATA section kan zetten, of je scripts extern includen. Binnen script moet je geen entities gebruiken (tenzij je ook echt als XHTML serveert).

[ Voor 10% gewijzigd door crisp op 06-10-2008 12:24 ]

[gvanh]

XHTML inderdaad.

Ik ga even kijken naar CDATA, thanks.

----

Aanvulling: ter referentie voor in de search:
http://www.codehouse.com/javascript/tips/xhtml/

[ Voor 59% gewijzigd door gvanh op 06-10-2008 12:33 . Reden: URL naar info toegevoegd. ]

[_Thanatos_]

Zo dus:

HTML:

<script type="text/javascript">
//<![CDATA[
Hier je script
//]]>
</script>

Maar extern is altijd beter. Voor caching, voor nette scheiding van html en script, voor onderhoudbaarheid.

Overigens als je een functie declareert en em vervolgens direct aanroept, kun je er beter een anonieme functie van maken. Een global genaamd "hit" heeft nml een vrij grote kans een conflict met iets anders te veroorzaken. Voorbeeld:

JavaScript:

(function() {
  //hier de inhoud van je "hit" functie
})();

[ Voor 12% gewijzigd door _Thanatos_ op 06-10-2008 13:32 ]

[Bosmonster]

Het is ook beter encodeURI() en encodeURIComponent() te gebruiken ipv escape.

Overigens is het natuurlijk erg interessant een eigen stats-functie te bouwen, maar met een gratis pakket als Google Analytics bespaar je jezelf een hoop tijd, database-IO en krijg je er een ongelofelijk schat aan informatie voor terug, die je zelf nooit kunt evenaren. Die optie zou ik dus ook eens bekijken!

[ Voor 100% gewijzigd door Bosmonster op 06-10-2008 14:00 ]

[gvanh]

Ja ... helemaal waar. Google analytics wordt vaak naast eigen statistiekenmodule gebruikt. Google stats heeft een hoop info waartoe ik niet direct toegang heb. Aan de andere kant heb ik binnen CMS-omgeving weer info die Google niet heeft, zoals informatie binnenin de objecten (pagina's, nieuwsberichten, etc.) en informatie over eventueel ingelogde gebruikers. Door verschillende systemen te combineren krijg je - denk ik - het beste inzicht.

JavaScript doe ik overigens normaal gesproken ook altijd met een "include.js", o.a. wegens genoemde redenen. In dit geval worden er echter door m'n template parser extra variabelen in het script "geplakt", dus dan is het wel makkelijk om dat in één template te kunnen doen. De javascript bestanden worden niet door de parser gehaald. Dan zou het wel weer kunnen door bijvoorbeeld een sectie XML of hidden form inputs op te nemen of zo ... maar dat voert voor nu nog even te ver ... misschien doe ik dat op termijn nog wel.

Dank in elk geval voor feedback ... altijd prettig om zo nu en dan een kritische blik over m'n code te krijgen.

[Bosmonster]

gvanh schreef op dinsdag 07 oktober 2008 @ 00:03:
Ja ... helemaal waar. Google analytics wordt vaak naast eigen statistiekenmodule gebruikt. Google stats heeft een hoop info waartoe ik niet direct toegang heb. Aan de andere kant heb ik binnen CMS-omgeving weer info die Google niet heeft, zoals informatie binnenin de objecten (pagina's, nieuwsberichten, etc.) en informatie over eventueel ingelogde gebruikers. Door verschillende systemen te combineren krijg je - denk ik - het beste inzicht.

Al deze informatie kun je eenvoudig met Google Analytics koppelen en weer onttrekken. Je weet niet half wat er allemaal mee mogelijk is

2 opmerkinkjes over je script overigens:

1. je voegt nergens de url van de img aan je nieuw gecreeerde img toe
2. Je zet je img op display:none. Dit zou kunnen betekenen dat sommige browsers ervoor kiezen de afbeelding ook niet te laden.
3. Je escapet (of encodeURIComponent't dus) de document.URL niet, terwijl juist die gekke tekens zal bevatten.

[ Voor 19% gewijzigd door Bosmonster op 07-10-2008 09:28 ]