1. Oktober 2015 tecker2010

Javascript Code schützen mit Obfuskation und anderen Methoden

Kaum eine Webseite kommt noch ohne Javascript aus und sei es auch nur die Verwendung von jQuery für ein paar nette Aninmationen oder um Bilder elegant in einer Slideshow oder einem Lightbox Popup anzuzeigen. Doch mitunter stecken viele Stunden Arbeit in der Programmierung eigener Programme und Funktionen mit Javascript, welcher auf der eigenen Webseite oder für den einen Kunden erstellt wurden. Da Javascript eine Client-seitige Programmiersprache ist, wird sie zur Ausführung vollständig im Browser des Clients (dem Besucher der Webseite) geladen und ist somit komplett sichtbar. Jedem Besucher ist es also möglich den Code einzusehen, zu kopieren und eigenmächtig weiterzunutzen oder gar zu verbreiten.

Wir benötigen eine Möglichkeit unseren Code und somit unser Eigentum gegen unerwünschtes Kopieren und Urheberrechtsverletzungen zu schützen. Glücklicherweise standen schon viele vor diesem Problem und somit gibt es auch eine Reihe von Maßnahmen und viele kostenlose als auch kostenpflichtige Onlinetools, welche uns uns hierbei helfen. Die wichtigsten hier kurz vorgestellt und erläutert.

1. Ersetzen von Namen / Replacements

Sieht man sich das untenstehende Beispiel an, ist sofort ersichtlich, dass hier eine Funktion die Temperatur von Celsius in Fahrenheit umwandelt und ausgibt.

function CelsiusInFahrenheit() {
    var GradCelsius = 10;
    var GradFahrenheit = (GradCelsius * 9/5) + 32;
    alert(GradFahrenheit);
}

Sofern die Funktionsnamen, als auch Variablennamen unkenntlich bzw. durch einfache Buchstaben und nichtssagende Strings ersetzt werden, ist nicht mehr ersichtlich welchen tieferen Sinn die Funktion hat.

function a() {
    var _b = 10;
    var c = (_b * 9/5) + 32;
    alert(c);
}

 

 2. Code minimieren / Minification

Zwar nicht so effektiv wie die Ersetzung von Variablen- und Funktionsnamen, aber dennoch gebräuchlich ist die Minification des Codes. Durch Umbrüche und Einrückungen ist der Code nämlich immernoch gut lesbar. Werden diese entfernt, steht der Code nur noch in einer Zeile. Die Minimierung bzw. Minification ist eine sehr gebräuchliche Methode, da hierdurch auch die Größe deutlich komprimiert wird.

function a(){var _b=10;var c=(_b*9/5)+32;alert(c)}

 

3. Obfuskation

Bei Obfuskation (engl. obfuscation = „verschleiern“) wird der Code durch bewusste Veränderung des Codes unlesbar gemacht und so verwirrend umgewandelt (Encoding), dass er kaum bis garnicht mehr nachkonstruiert (Decoding) werden kann. Die Veränderung des Quelltextes wird durch aufwändige Algorithmen erreicht, vergleichbar mit einer Chiffrierung. Mit Hilfe dieses Algorithmus kann der Code wieder zurückgewandelt werden. Daher sollte man Onlinetools, welche sowohl Obfuskation (bzw. Encoding) als auch Decoding anbieten eher fernhalten.

Kaum vorstellbar, aber der nachfolgende Code führt exakt das gleiche aus wie das oben aufgeführte Beispiel.

eval(function(p,a,c,k,e,d){while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+c+'\\b','g'),k[c])}}return p}('4 8(){0 2=3;0 1=(2*9/5)+7;6(1)}',10,10,'var|c|b|10|function||alert|32|a|'.split('|')))

 

 4. Einschleusen / Code Insertion

Die Obfuskation macht den Quelltext komplett unleserlich. Um dem noch eins hinzuzufügen, kann vor der Obfuskation weiterer unnützer Code eingefügt werden, welcher mit obfuskiert wird. Dieser hat mit unserem Quelltext rein garnichts zu tun und auch keine Auswirkungen, sondern dient nur zusätzlich der Verwirrung. Im oben aufgeführten Quelltext werden nun noch weitere Variablen und Funktionsaufrufe eingefügt, welche keinen weiteren Nutzen haben.

function a() {
    var _b = 10;
    var x = 0;
    var c = (_b * 9/5) + 32;
    b();
    alert(c);
}
function b() {
    z = 1
}

Nach der Obfuskation sieht dieser noch unlesbarer aus (falls man das überhaupt noch so sagen kann).

eval(function(p,a,c,k,e,d){while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+c.toString(a)+'\\b','g'),k[c])}}return p}('4 a(){2 3=8;2 6=0;2 c=(3*9/5)+7;b();d(c)}4 b(){e=1}',15,15,'||var|_0|function||x|32|10|||||alert|z'.split('|')))

 

Zwischenfazit

Die bisherigen Schritte dienten dazu, unseren Code zu verschleiern und unlesbar zu machen. Jedoch schützen diese Maßnahmen noch nicht davor, dass der Code dennoch von Fremden kopiert und genutzt werden kann, denn dieser funktioniert nach wie vor. Es bedarf also weiterer Schritte, so dass dieser nur auf unseren Webseite funktioniert und beim kopieren und einfügen in fremde Seiten funktionslos ist. Nachfolgend werden weitere Möglichkeiten gezeigt, mit welchen dies erreicht werden kann.

5. Domainzugehörigkeit

Wird der Quelltext auf unserer Webseite webcrab.de eingebaut, sollte er auch nur dort funktionieren. An einer oder mehreren Stellen im Code genügt also eine Überprüfung, ob die Domain die richtige ist.

function a() {
    if(window.location.href.indexOf("webcrab") > -1) {
        var _b = 10;
        var x = 0;
        var c = (_b * 9/5) + 32;
        b();
        alert(c);
    }
}
function b() {
    z = 1
}

Wird auch dieser obfuksiert, ergibt sich daraus der nachfolgende Code:

eval(function(p,a,c,k,e,d){while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+c.toString(a)+'\\b','g'),k[c])}}return p}('4 a(){g(f.j.7.k("d")>-1){2 3=8;2 e=0;2 c=(3*9/5)+i;b();h(c)}}4 b(){6=1}',21,21,'||var|_0|function||z|href|10|||||webcrab|x|window|if|alert|32|location|indexOf'.split('|')))

6. AJAX Abfragen und Bindung an den Server

Eine weitere Möglichkeit dafür zu sorgen, dass der Javascript Code nur auf dem eigenen Server ausgeführt wird, können mit Hilfe spezieller AJAX Abfragen erreicht werden. In einem Request an den Server kann ein Key angefordert werden, dessen MD5-Hash dem Client bekannt ist und anschließend abgeglichen wird. Sofern dieser übereinstimmt, wird die Funktion weiter ausgeführt oder entsprechend beendet.

$.ajax({
    'async': false,
    'global': false,
    'url': 'index.php?getHashKey',
    'success': function (data) {
        if($.md5(data.key) == 'ae43fa9c3a31fb8118f9a4') {
            // continue
        }
    }
});

 

7. Übersicht verschiedener Tools

Im Netz gibt es einige Seiten und diverse Tools, die das tun, was in den aufgeführten Schritten erläutert wurde (und noch mehr). Ein einfacher Javascript Encoder ist der Javascript Obfuscator von dantools.com. Mehr Optionen und eine eigene GUI erhält man auf javascriptobfuscator.com. Über die GUI stehen erweitere Optionen wie z.B. Dead Code Insertion zur Verfügung. Für größere Projekte empfiehlt sich der kommerzielle Vertreter jscrambler, hier kann man sich zunächst einen kostenlosen Testaccount anlegen und sich von den Möglichkeiten überzeugen lassen.

Fazit

Die hier gezeigten Beispiele zeigen selbstverständlich nicht alle Möglichkeiten seinen Javascript Code zu schützen, aber geben den notwendigen Schutz um es vor unnötigen Kopieren zu schützen. Es gibt einige Onlinetools, bei welchen sich einige oder gar alle diese Maßnahmen und noch weitere kombiniert anwenden lassen. Nichts desto trotz sollte man auch auf seine Copyright Hinweise und deren Maßnahmen, sofern diese nicht eingehalten werden, hinweisen.

Tagged:

Kontakt & Angebot

Webdesign, Webanwendungen oder IT-Beratung - ich helfe Ihnen gern weiter! Nutzen Sie das Kontaktformular für Fragen oder ein kostenloses Angebot.