Datenübergabe Perl/PHP <=> JavaScript
Gelesen bei AboutWebDesign.de
URL: http://www.aboutwebdesign.de/awd/content/1041344582.shtml
Perl bzw. PHP und JavaScript - eigentlich unvereinbar, da die einen auf dem Server ausgeführt werden, die andere jedoch vom Interpreter des Client-Browsers. Nichtsdestotrotz oder gerade deswegen ergänzen sie sich ganz gut: manche Probleme lassen sich eben besser auf dem Server lösen, andere eher auf dem Client.
Oft stößt man dabei auf das Problem, dass Daten zwischen den verschiedenen Programmiersprachen übergeben werden müssen. Daher werden wir im Folgenden zeigen, wie sich das in der Praxis bewerkstelligen lässt.
Übrigens lassen wir dabei die Möglichkeit, externe Module nachzuinstallieren, außen vor. Das ist auf den meisten Servern ohnehin nicht möglich. Wenn das bei Ihnen anders ist, durchsuchen Sie z.B. das CPAN mit dem Stichwort "javascript". Sie werden dann Perl-Module herunterladen können, die ganze Datenstrukturen auf einmal übergeben.
Ebenfalls außen vor lassen wir komplexe Datenstrukturen. Einfache, skalare Variablenübergaben reichen meist aus und helfen, die Sache nicht unnötig zu verkomplizieren.
JavaScript => Server
Die einfachste Methode, Daten von JavaScript zum Server zu übertragen, besteht darin, ein Server-Script mit vorher generierten Argumenten aufzurufen.
Im Detail funktioniert das so:
- Wir definieren ein paar Variablen, die wir übergeben wollen.
- Aus diesen Variablen bauen wir eine URL
- Diese URL wird aufgerufen.
Im Code sieht das so aus:
function uebergabe()
{
// Übergabe-Variablen
var produkt = "Super-Staubsauger";
var preis = "12 EUR";
var besteller = "Hans Schmalmeister";
// URL bauen
var url = 'http://www.domain.de/cgi-bin/xyz.pl?' +
'produkt=' + produkt + '&' +
'preis=' + preis + '&' +
'besteller=' + besteller;
// Aufruf
document.location.href = url;
}
Dass hier ein Perl-Script aufgerufen wird, spielt keine Rolle. Mit PHP würde es genauso funktionieren.
Vergessen Sie dabei niemals, die erhaltenen Daten auch auf dem Server nochmals zu prüfen. Man könnte Ihr System manipulieren. Bezogen auf unser Beispiel hieße das, in der Perl- oder PHP-Anwendung zu überprüfen, ob der "Super-Staubsauger" wirklich 12 Euro kostet.
Sonderzeichen quoten
Ein Problem ist noch ungelöst: was ist, wenn Ihre Variablen Sonderzeichen wie das kaufmännische Und (&) enthalten? Der URL-Zusammenbau würde dann durcheinandergeraten, weil das kaufmännische Und in URLs als Trennzeichen zwischen zwei Variablen interpretiert wird.
Um das zu vermeiden, rufen Sie einfach eine vordefinierte JavaScript-Funktion auf, die diese Sonderzeichen durch entsprechend "geschützte" Sequenzen ersetzt: encodeURIComponent().
Modifiziert sieht unser Code nun also so aus:
function uebergabe()
{
// Übergabe-Variablen
var produkt = "Super&Sta ubsauger&";
var preis = "12 EUR";
var besteller = "Hans Schmalmeister";
// Sonderzeichen ersetzen
produkt = encodeURIComponent(produkt);
preis = encodeURIComponent(preis);
besteller = encodeURIComponent(besteller);
// URL bauen
var url = 'http://www.domain.de/cgi-bin/xyz.pl?' +
'produkt=' + produkt + '&' +
'preis=' + preis + '&' +
'besteller=' + besteller;
document.location.href = url;
}
Aufruf der Übergabe-Funktion
Sie können Sie Übergabe-Funktion jederzeit und überall aufrufen. Besonders interessant wird sie im Zusammenhang mit Formular-Eingaben, die vielleicht erst überprüft und dann noch clientseitig weiterverarbeitet werden sollen, bevor sie an den Server übergeben werden. Einige Anregungen dazu finden Sie in unserem eBook unter Formulareingaben überprüfen.
Perl/PHP => JavaScript
Für die umgekehrte Austauschrichtung verwenden wir einen einfacheren Ansatz: wir erzeugen auf dem Server ein JavaScript, das wir an den Browser schicken und dort ausführen lassen.
Perl
Das könnte in Perl so aussehen:
#!/usr/bin/perl
print "Content-type: text/html\n\n";
my $nachricht1 = "Hallo Kunde!";
my $nachricht2 = "Willkommen auf unserer Website.";
my $code = qq(
<html>
<head>
<script>
var n1 = "${nachricht1}";
var n2 = "${nachricht2}";
alert(n1);
alert(n2);
</script>
</head>
<body>
<h1>Unser Online-Shop</h1>
</body>
</html>
);
print $code;
PHP
<html>
<head>
<script>
var n1 = "<?php echo $nachricht1; ?>";
var n2 = "<?php echo $nachricht2; ?>";
alert(n1);
alert(n2);
</script>
</head>
<body>
<h1>Unser Online-Shop</h1>
</body>
</html>
Sonderzeichen-Probleme
Leider können wir auch hier Sonderzeichen-Probleme nicht ganz vermeiden: in unserem Beispiel dürften die nachricht1/2-Variablen weder doppelte Anführungszeichen noch Zeilenumbrüche enthalten, denn das würde den JavaScript-Interpreter verwirren.
Daher ersetzen wir die problematischen Sonderzeichen durch ihre gequoteten Versionen. In JavaScript stellt man dazu den entsprechenden Zeichen einen Backslash voran, Zeilenumbrüche werden durch \n ersetzt.
Der entsprechende Perl-Code dazu:
#!/usr/bin/perl
print "Content-type: text/html\n\n";
my $nachricht1 = "Hallo Kunde!";
my $nachricht2 = qq(Willkommen auf unserer Website.\n\nWir sind sehr glücklich, dass gerade Sie sozusagen "hergefunden" haben);
$nachricht1 = "e($nachricht1);
$nachricht2 = "e($nachricht2);
my $code = qq(
<html>
<head>
<script>
var n1 = "${nachricht1}";
var n2 = "${nachricht2}";
alert(n1);
alert(n2);
</script>
</head>
<body>
<h1>Unser Online-Shop</h1>
</body>
</html>
);
sub quote
{
my $str = shift;
$str =~ s/"/\\"/g;
$str =~ s/\n/\\n/g;
return $str;
}
print $code;
Die Veränderung liegt, wie Sie sicher bemerkt haben, in der Definition und im Aufruf der quote-Funktion. Die dort verwendeten regulären Ausdrücke können Sie im Prinzip auch in PHP verwenden, zumindest, wenn Sie dort den "Perl-Style" Regex-Parser verwenden.
Fazit
Es gibt Möglichkeiten des client- und serverseitigen Zusammenspiels, die allenfalls durch recht einfach zu behebende Sonderzeichen-Probleme behindert werden. Erfahrungsgemäß sollten Sie daher an dieser Stelle suchen, wenn ein Fehler auftritt und Ihr Code syntaktisch korrekt ist.