Quellcode verschleiern/unleserlich machen und komprimieren

humanduck(47)

Published in

#deutsch

Words

561

Reading

3 min

Listen

Play

Quellcodeverschlüsselung

Wenn du Angst davor hast, dass dein HTML , Javascript, oder CSS Quellcode geklaut wird oder du einfach nicht jedem Zugriff auf ihn ermöglichen willst, bist du hier GENAU richtig!!!

Als Beispiel möchte ich eine von mir extra für dieses Tutorial erstellte Website nutzen. Unverschlüsselt sieht sie so aus :

und der dazugehörige Quellcode so :

<!DOCTYPE html>
 <html lang="de">
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Tutorial</title>

   </head>
   <body>
        <h1>WILLKOMMEN AUF MEINER SEITE</h1>
                <table style="font-size: 2em; border="2"; border align="center">
            3">Steckbrief
            
                ergqerg :
                2">asdsad
            
            
                Familienname :
                2">asd
            
            
                QERGQERG :
                2">QERGERQG
            
            
                QEGQEG :
                2">https://i.imgur.com/0t5ZJ94.jpg" width="500px">
            </tr>
            <tr>
                <td>QERGERQG :</td>
                <td colspan="2">DFGWRTG</td>
            </tr>
            <tr>
                <td>QERGQERG :</td>
                <td colspan="2">QREGQRG <img src="https://html-online.com/editor/tinymce4_6_5/plugins/emoticons/img/smiley-cool.gif" alt="cool" /></td>
            </tr>
            <tr>
                <td>QERG :</td>
                <td colspan="2">QREGQRG</td>
            </tr>
            <tr>
                <td>EGEQHH :</td>
                <td colspan="2">QERG</td>
            </tr>
            <tr>
                <td>REQQREG</td>
                <td colspan="2">hgDBF</td>
            </tr>
            <tr>
                <td>gdfgag</td>
                <td>asd</td>
                <td>sad</td>
            </tr>
            <tr>
                <td>Lieblingsfach :</td>
                <td colspan="2">asd</td>
            </tr>
            <tr>
                <td>Traumberuf :</td>
                <td colspan="2">asasd</td>
            </tr>   
            <tr>
                <td><a href="Geschichte1.html">Geschichte 1</a></td>
                <td><a href="Geschichte2.html">Geschichte 2</a></td>
                <td><a href="Geschichte3.html">Geschichte 3</a></td>
            </tr>   
        </table>
   </body>
 </html>

Der Code ist gut für jeden sichtbar und bereits von mir sehr schön formatiert, also optimal kopierbar und erneut einsetzbar.
Um dies zu verhindern nutzen wir Javascript. Wir wollen nämlich den gesamten Code zwischen den tags mit Javascript verschlüsseln und dann wieder in einsetzen. Falls wir es noch nicht gemacht haben, weisen wir jetzt dem tag eine Id zu, indem wir den tag umschreiben zu

Dann erstellen wir mit den tags Platz für unser Javascript welches wir zwischen die <head></head> tags setzen, was dann wie folgt aussieht : Doch bevor wir mit dem Script weitermachen, formatieren wir unseren Code so, dass wir ihn verschlüsseln können.

Dazu benutzen wir ein "Suchen und Einsetzen"-Tool unserer Wahl und suchen in unserem Code nach einem Anführungszeichen" und ersetzen dieses durch /" . Dadurch stören wir unseren Javascript Code später nicht.

Nun möchte ich zurück zu dem Script kommen und eine Website vorstellen, die wir zum Verschlüsseln nutzen werden .
Hier erst einmal der Link zur webpage : https://nur.gratis/online-tools/jsPacker.htm

Wenn man diese öffnet, sollte sie so aussehen :

Bevor wir unseren Code in das Feld

hinein kopieren, schreiben wir window.onload = function what(){ document.getElementById("beliebige_Id").InnerHTML = " hinein, dann den Code und dann ";};. Dieses Stück extra Code bewirkt, dass wir mit unserem Script den Code auch in den einsetzen!

Danach haben wir verschiedene Verschlüsselungsmöglichkeiten :

Dort wählen wir eine beliebige Möglichkeit aus und klicken auf das darunter liegende Feld "UND LOS...!" .

Unseren verschlüsselten Code finden wir jetzt in dem untersten Textfeld :

Der Code sieht in meinem Fall jetzt so aus :

eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('P.M=L K(){J.I(\'H\').G=\'F E D Bvt :sN :9h :gO :g :16h :o j :oR :jqCS9TX :912 :148 18 28 3\'};',62,74,'td||||tr|colspan|img|html|Geschichte|asd||href|table|cool|com|https|QERGERQG|QERGQERG||QERG|th|h2|border|h1|QREGQRG|src|REQQREG|style|asdsad|ergqerg|Geschichte3|Steckbrief|center|align|2em|size|font|SEITE|hgDBF|MEINER|AUF|WILLKOMMEN|innerHTML|beliebige_Id|getElementById|document|what|function|onload|Familienname|QEGQEG|window|imgur|EGEQHH|gdfgag|sad|alt|gif|smiley|Lieblingsfach|emoticons|plugins|tinymce4_6_5|editor|Traumberuf|online|asasd|Geschichte1|DFGWRTG|Geschichte2|500px|width|jpg|0t5ZJ94'.split('|'),0,{}))

Abschließend kopieren wir den Code zwischen unsere tags und können dann unser Programm erneut starten.

Unsere Websites werden identisch aussehen, aber der Quellcode hat sich verändert!

Neuer Quellcode :

<!DOCTYPE html>
 <html lang="de">
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Tutorial</title>
    <script>eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('P.M=L K(){J.I(\'H\').G=\'F E D Bvt :sN :9h :gO :g :16h :o j :oR :jqCS9TX :912 :148 18 28 3\'};',62,74,'td||||tr|colspan|img|html|Geschichte|asd||href|table|cool|com|https|QERGERQG|QERGQERG||QERG|th|h2|border|h1|QREGQRG|src|REQQREG|style|asdsad|ergqerg|Geschichte3|Steckbrief|center|align|2em|size|font|SEITE|hgDBF|MEINER|AUF|WILLKOMMEN|innerHTML|beliebige_Id|getElementById|document|what|function|onload|Familienname|QEGQEG|window|imgur|EGEQHH|gdfgag|sad|alt|gif|smiley|Lieblingsfach|emoticons|plugins|tinymce4_6_5|editor|Traumberuf|online|asasd|Geschichte1|DFGWRTG|Geschichte2|500px|width|jpg|0t5ZJ94'.split('|'),0,{}))
</script>
   </head>
   <body Id="beliebige_Id">
   </body>
 </html>

Zugehörige Website :

Wie wir sehen, ist dieser Code quasi nicht lesbar oder zumindest für Fremde absolut unbrauchbar !
Aber Achtung dieses Verfahren schützt nicht komplett da man in dem Chrome und jedem anderen Browser auch unter "Untersuchen" sich den Code angucken kann da gegen sind wir machtlos wir können aber probieren dem Angreifer seinen Angriff zu erschweren indem wir beispielsweise die "rechte Maustaste" zu blockieren.
Hier bei muss man aber aufpassen das man keine anderen wichtigen Funktionen unterdrückt oder Nutzer verschreckt. Daher sind solche Scripts mit Vorsicht zu genießen!

Dennoch hier eine Anleitung zu der Blockierung der rechten Maustaste, das folgende Script können wir genauso verschlüsseln wie oben beschrieben nur das wir dieses nicht mehr formatieren müssen!
Das Script zur Verhinderung der rechten Maustaste sieht so aus :

function DoFalse(){alert('Nicht möglich!'); return(false)}

       
if(document.layers)
{
 document.captureEvents(Event.MOUSEDOWN);
 document.onmousedown=DoFalse();
}

oder verschlüsselt so :

eval(function(p,a,c,k,e,d){e=function(c){return c.toString(36)};if(!''.replace(/^/,String)){while(c--){d[c.toString(a)]=k[c]||c.toString(a)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('e 1(){d(\'c böa!\');9(8)}7(0.6){0.5(4.3);0.2=1()}',15,15,'document|DoFalse|onmousedown|MOUSEDOWN|Event|captureEvents|layers|if|false|return|glich|m|Nicht|alert|function'.split('|'),0,{}))

Es gilt zu beachten das wir unseren <body> tag der im Moment so aussehen sollte <body Id="beliebige_Id"> noch onMouseDown="return DoFalse();" hinzufügen müssen so dass er dann so aussieht <body Id="beliebige_Id" onMouseDown="return DoFalse();"> .

Als kleines Fazit möchte ich noch sagen das ein totaler und sicherer Schutz nicht möglich ist, aber das man es dem Angreifer durchaus schwerer machen kann!

Abschließend möchte ich mich bedanken, dass Du es bis hierhin geschafft hast und würde mich sehr über konstruktive Kritik in den Kommentaren und/oder upvotes freuen.

Hier noch ein wenig Werbung für meinen dtube Kanal, auf dem ich auch das gleiche Thema bearbeitet habe :
https://d.tube/#!/c/humanduck