Jak ukryć kod JavaScript na stronie internetowej?

99

Czy można ukryć kod Javascript w html strony internetowej, gdy kod źródłowy jest wyświetlany za pomocą funkcji View Source w przeglądarce?

Wiem, że można zaciemnić kod, ale wolałbym, aby był on ukryty w funkcji źródła widoku.

arun nair
źródło
1
to po stronie klienta, więc będzie znajdować się na wszystkich klientach (przeglądarkach)
naveen
8
Dlaczego chcesz ukryć Javascript? To nie tak, że kiedykolwiek umieszczałeś jakiekolwiek poufne dane, których nie chcesz, aby użytkownik znalazł w nich ... prawda ?!
Paul
1
Skąd przeglądarka wie, jaki JavaScript ma uruchomić?
Wylie,
1
@PaulPRO ma dobry punkt widzenia - dlaczego miałbyś chcieć ukryć JavaScript? Każdy, kto chce wiedzieć, co robisz, ZAWSZE będzie mógł uzyskać skrypt za pomocą kilku naciśnięć klawiszy. Nie będą polegać tylko na View-Source. Każdy, kto nie wie, jak zdobyć skrypt, prawdopodobnie i tak nie będzie nim zainteresowany.
Stephen Chung
1
@UdayHiwarale Bardzo łatwo jest zobaczyć, jakie są zapytania GET i inne zapytania HTTP wykonywane przez klienta (wystarczy otworzyć konsolę programisty i przejść do zakładki sieci). Tworząc stronę internetową, powinieneś założyć na serwerze, że wszystkie żądania są sfałszowane przez atakującego - dlatego musisz zweryfikować wszystkie dane i ostrożnie uciec przed każdym ciągiem, który podzielisz na kod SQL lub inny.
Suzanne Dupéron

Odpowiedzi:

136

Nie jestem pewien, czy ktoś inny bezpośrednio odpowiedział na Twoje pytanie, które jest kodem przeglądanym za pomocą polecenia Wyświetl źródło w przeglądarce.

Jak powiedzieli inni, nie ma sposobu, aby chronić javascript, który ma działać w przeglądarce, przed zdeterminowaną przeglądarką. Jeśli przeglądarka może go uruchomić, każda określona osoba może go również wyświetlić / uruchomić.

Ale jeśli umieścisz javascript w zewnętrznym pliku javascript, który jest dołączony do:

<script type="text/javascript" src="http://mydomain.com/xxxx.js"></script>

tagi, kod javascript nie będzie od razu widoczny za pomocą polecenia Wyświetl źródło - tylko sam tag skryptu będzie widoczny w ten sposób. Nie oznacza to, że ktoś nie może po prostu załadować tego zewnętrznego pliku javascript, aby go zobaczyć, ale zapytałeś, jak trzymać go z dala od polecenia przeglądarki View Source i to zrobi.

Jeśli naprawdę chcesz, aby przeglądanie źródła było bardziej pracochłonne, wykonaj wszystkie następujące czynności:

  1. Umieść go w zewnętrznym pliku .js.
  2. Ukryj plik, tak aby większość nazw zmiennych natywnych została zastąpiona krótkimi wersjami, dzięki czemu wszystkie niepotrzebne spacje zostaną usunięte, więc nie można ich odczytać bez dalszego przetwarzania itp.
  3. Dynamicznie dołączaj plik .js, programowo dodając tagi skryptów (tak jak robi to Google Analytics). Spowoduje to, że dostęp do kodu źródłowego za pomocą polecenia Wyświetl źródło będzie jeszcze trudniejszy, ponieważ nie będzie łatwego linku do kliknięcia.
  4. Umieść tyle interesującej logiki, którą chcesz chronić na serwerze, którą pobierasz za pośrednictwem wywołań ajax, zamiast wykonywać lokalne przetwarzanie.

Biorąc to wszystko pod uwagę, myślę, że powinieneś skupić się na wydajności, niezawodności i uczynieniu swojej aplikacji świetną. Jeśli absolutnie musisz chronić jakiś algorytm, umieść go na serwerze, ale poza tym konkuruj o bycie najlepszym w sobie, a nie o tajemnice. Tak i tak ostatecznie działa sukces w sieci.

jfriend00
źródło
2
Niezły sposób, aby bezpośrednio odpowiedzieć na pytanie. Użycie JavaScript do wygenerowania<script> sprawiłoby, że lepiej by go nie było w widoku źródła (nadal było widoczne pod aktywnym DOM) - to znaczy, nie można go po prostu „kliknąć prawym przyciskiem myszy” w widoku źródła. Możliwe, że wspomniany <script>element zostanie usunięty po wykonaniu JavaScript, co nieco utrudni (ale nie niemożliwe) pobranie oryginalnego kodu ... oczywiście ruch sieciowy będzie bardzo łatwo pojawiał się w Firebug lub podobnym ;-)
3
@Quentin - Twój adres URL widoku źródła jest głupi - nie o to się tutaj prosi ani nie proponuje. Każdy może zobaczyć kod. Powiedziałem to tak samo jak każdy inny. Pytanie brzmi tylko, jak to jest łatwe i, zgodnie z zadanym pytaniem, jak widoczne jest, gdy ktoś przegląda źródło? Moja sugestia sprawia, że ​​jest to jeden krok usunięty z widoku źródła - to wszystko, ale jest to ważny dodatkowy krok.
jfriend00
fetch ("SCRIPT TO HIDE URL or DATAURL"). then (function (t) {return t.text () || false;}). then (c => self [atob ("ZXZhbA")] (c))
Zibri
Myślę, że możemy również dodać oncontextmenu = 'return false;' w tagu html.
falero80s
@ falero80s - To próbuje zatrzymać menu prawego przycisku myszy, ale nie zatrzymuje wszystkich innych sposobów przeglądania źródła strony.
jfriend00
38

Nie, to niemożliwe.

Jeśli nie podasz tego przeglądarce, to przeglądarka jej nie ma.

Jeśli tak, to to (lub łatwe do zrozumienia odniesienie do niego) stanowi część źródła.

Quentin
źródło
4
Nie jestem pewien, czy ta odpowiedź naprawdę odpowiedziała na zadane pytanie (mimo że otrzymała 10 głosów za w ciągu 15 minut). Zapytali, jak utrzymać kod z dala od polecenia przeglądarki View Source. To jest możliwe. Zobacz moją odpowiedź poniżej. Nie pytali, jak uniemożliwić przeglądanie kodu przez zdeterminowanego hakera.
jfriend00
8
Nie trzeba wiele na drodze do ustalenia, aby kliknąć łącze w widoku źródła dla dokumentu HTML, aby dostać się do źródła widoku dla skryptu.
Quentin
Moim zdaniem pytanie nie zostało poprawnie zinterpretowane. Tworzenie pliku JS jest powszechne, użytkownik chce tutaj (myślę), jak ukryć dowolną wartość zmiennej JS, gdy ktoś wybierze opcję „wyświetl źródło strony”. +1 z mojej strony.
shaILU
Ta odpowiedź nie ma sensu. tutaj lepiej jest dać sugestię. Lepsza opcja użycia zewnętrznego pliku.
Lalit Mohan
15

Moje rozwiązanie jest inspirowane ostatnim komentarzem. To jest kod invisible.html

<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="invisible_debut.js" ></script>
<body>
</body>

Czysty kod invisible_debut.js to:

$(document).ready(function () {
var ga = document.createElement("script"); //ga is to remember Google Analytics ;-)
ga.type = 'text/javascript';
ga.src = 'invisible.js';
ga.id = 'invisible';
document.body.appendChild(ga);
$('#invisible').remove();});

Zauważ, że na koniec usuwam utworzony skrypt. invisible.js to:

$(document).ready(function(){
    alert('try to find in the source the js script which did this alert!');
    document.write('It disappeared, my dear!');});

invisible.js nie pojawia się w konsoli, ponieważ został usunięty i nigdy w kodzie źródłowym, ponieważ został utworzony przez javascript.

Jeśli chodzi o invisible_debut.js, zaciemniłem go, co oznacza, że ​​znalezienie adresu URL invisible.js jest bardzo skomplikowane. Nie idealne, ale wystarczająco trudne dla normalnego hakera.

Armand Arapian
źródło
3
Dziwne jest to, że dokładnie postępowałem zgodnie z instrukcjami i jestem w stanie znaleźć invisible.jsw źródłach. Wersja Chrome 34.0.1847.131 m
Boyang
2
@Boyang, po prostu nie pojawia się w konsoli, ale jeśli znamy ścieżkę, nadal możemy ją znaleźć.
Panadol Chong
1
Nie tylko to, ale zawsze pojawi się na karcie Sieć większości narzędzi dla programistów. Znowu każdy szanujący się haker będzie miał dostępne DevTools.
GoldBishop
13

Use Html Encrypter Część Head, która ma

<link rel="stylesheet" href="styles/css.css" type="text/css" media="screen" />
<script type="text/javascript" src="script/js.js" language="javascript"></script>

copy and paste it to HTML Encrypter and the Result will goes like this
and paste it the location where you cut the above sample

<Script Language='Javascript'>
<!-- HTML Encryption provided by iWEBTOOL.com -->
<!--
document.write(unescape('%3C%6C%69%6E%6B%20%72%65%6C%3D%22%73%74%79%6C%65%73%68%65%65%74%22%20%68%72%65%66%3D%22%73%74%79%6C%65%73%2F%63%73%73%2E%63%73%73%22%20%74%79%70%65%3D%22%74%65%78%74%2F%63%73%73%22%20%6D%65%64%69%61%3D%22%73%63%72%65%65%6E%22%20%2F%3E%0A%3C%73%63%72%69%70%74%20%74%79%70%65%3D%22%74%65%78%74%2F%6A%61%76%61%73%63%72%69%70%74%22%20%73%72%63%3D%22%73%63%72%69%70%74%2F%6A%73%2E%6A%73%22%20%6C%61%6E%67%75%61%67%65%3D%22%6A%61%76%61%73%63%72%69%70%74%22%3E%3C%2F%73%63%72%69%70%74%3E%0A'));
//-->

SZYFROWNIK HTML Uwaga: jeśli masz skrypt java na swojej stronie, spróbuj wyeksportować go do pliku .js i upodobnić do powyższego przykładu.

A także ten Encrypter nie zawsze działa w jakimś kodzie, który sprawi, że Twoja witryna będzie zepsuta ... Wybierz najlepszą część, którą chcesz ukryć, na przykład w <form> </form>

Może to zostać odwrócone przez zaawansowanego użytkownika, ale nie wszyscy tak jak ja wiedzą o tym.

Mam nadzieję, że to pomoże

HINAYUPAKS
źródło
3
Podany link nie jest otwarty, daje błąd kodu 404.
Akash Limbani
W ten sam sposób hakerzy umieszczają złośliwy kod w witrynie. Niektóre z bardziej zaawansowanych narzędzi Security Web Crawler wyszukują taki kod i usuwają go ze źródła strony.
GoldBishop
8

Nie jestem pewien, czy istnieje sposób, aby ukryć te informacje. Bez względu na to, co robisz, aby zaciemnić lub ukryć wszystko, co robisz w JavaScript, nadal sprowadza się to do tego, że Twoja przeglądarka musi go załadować, aby z niego korzystać. Nowoczesne przeglądarki mają gotowe do użycia narzędzia do debugowania / analizy sieci, które sprawiają, że wyodrębnianie i przeglądanie skryptów jest banalne (wystarczy nacisnąćF12 na przykład w Chrome).

Jeśli martwisz się ujawnieniem jakiejś tajemnicy handlowej lub algorytmu, jedynym rozwiązaniem jest hermetyzacja tej logiki w wywołaniu usługi sieciowej i wywołanie tej funkcji przez stronę za pośrednictwem technologii AJAX.

Mark Carpenter
źródło
Powiedzmy, że martwisz się ujawnieniem tajemnicy. Powiedzmy, że umieszczasz go w pliku PHP i wywołujesz przez Ajax. Wtedy każdy może zadzwonić do tego pliku PHP i znaleźć sekret. Prawdopodobnie istnieje sposób na ochronę tajemnic za pomocą PHP i starałem się go znaleźć. Wygeneruj liczbę losową i wymagaj, aby wszystkie zasoby podawały ją jako argument do pliku PHP. Myślę, że to działa, ale nie wtedy, gdy złośliwy użytkownik używa narzędzi programistycznych.
David Spector
8

„To niemożliwe!”

O tak, to jest ....

//------------------------------
function unloadJS(scriptName) {
  var head = document.getElementsByTagName('head').item(0);
  var js = document.getElementById(scriptName);
  js.parentNode.removeChild(js);
}


//----------------------
function unloadAllJS() {
  var jsArray = new Array();
  jsArray = document.getElementsByTagName('script');
  for (i = 0; i < jsArray.length; i++){
    if (jsArray[i].id){
      unloadJS(jsArray[i].id)
    }else{
      jsArray[i].parentNode.removeChild(jsArray[i]);
    }
  }      
}
Addinall
źródło
4
Bardzo dobra odpowiedź. Rzeczywiście ukrywa użycie javascript, jednak tylko wtedy, gdy używasz inspektora elementów / narzędzi programistycznych, nadal możesz zobaczyć, czy patrzysz przez View Source. (Przynajmniej na Chrome)
Patrick Bard,
czy zmienna „head” jest tutaj zbędna, czy pełni jakąś ważną funkcję?
Master James,
3
ukrywa to tylko częściowo ... każda ujawniona funkcja (globalna) może być pokazana przez narzędzia deweloperskie i pojawi się jako funkcja anonimowa, ale narzędzia programistyczne mówią wszystko, w tym skąd została załadowana
Zibri
to tylko ukrywa ją przed źródłem .. anynomiczna funkcja zrobiłaby to samo: fetch ("SKRYPT DO UKRYCIA"). then (function (t) {return t.text () || false;}). then (c = > siebie [atob ("ZXZhbA")] (c))
Zibri
5

Myślę, że znalazłem rozwiązanie, aby ukryć niektóre kody JavaScript w źródle widoku przeglądarki. Ale musisz do tego użyć jQuery.

Na przykład:

W pliku index.php

<head>
<script language = 'javascript' src = 'jquery.js'></script>
<script language = 'javascript' src = 'js.js'></script>
</head>

<body>
<a href = "javascript:void(null)" onclick = "loaddiv()">Click me.</a>

<div id = "content">
</div>

</body>

Ładujesz plik w treści html / php, wywoływany przez funkcję jquery w pliku js.js.

js.js

function loaddiv()
{$('#content').load('content.php');}

Oto sztuczka.

W pliku content.php umieść kolejny tag head, a następnie wywołaj stamtąd inny plik js.

content.php

<head>
<script language = 'javascript' src = 'js2.js'></script>
</head>

<a href = "javascript:void(null)" onclick = "loaddiv2()">Click me too.</a>

<div id = "content2">
</div>

w pliku js2.js utwórz dowolną funkcję.

przykład:

js2.js

function loaddiv2()
{$('#content2').load('content2.php');}

content2.php

<?php
echo "Test 2";
?>

Kliknij link, a następnie skopiuj i wklej go do nazwy pliku jquery.js

http://dl.dropbox.com/u/36557803/jquery.js

Mam nadzieję, że to pomoże.

Jepp
źródło
1
Zapewni to tylko minimalną ochronę. Przejście do karty sieciowej narzędzi deweloperskich przeglądarki i zobaczenie wszystkich pobranych skryptów, w tym tych ładowanych przez Ajax, jest trywialne.
JJJ
4

Możesz użyć document.write.

Bez jQuery

<!DOCTYPE html>
<html>
<head><meta charset=utf-8></head>
<body onload="document.write('<!doctype html><html><head><meta charset=utf-8></head><body><p>You cannot find this in the page source. (Your page needs to be in this document.write argument.)</p></body></html>');">
</body></html>

Lub z jQuery

$(function () {
  document.write("<!doctype html><html><head><meta charset=utf-8></head><body><p>You cannot find this in the page source. (Your page needs to be in this document.write argument.)</p></body></html>")
});
Blue Sheep
źródło
2

Nie jest możliwe!

Jedynym sposobem jest zaciemnienie javascript lub zminimalizowanie kodu javascript, co utrudnia użytkownikowi końcowemu wykonanie inżynierii wstecznej. jednak nie jest niemożliwe do odtworzenia.

gabriele brunori
źródło
1

Podejście, które zastosowałem kilka lat temu -

Potrzebujemy pliku jsp, pliku java serwletu i pliku java filtru.

Przyznaj użytkownikowi dostęp do pliku jsp. Adres URL pliku jsp typu użytkownika.

Przypadek 1 -

  • Plik JSP przekieruje użytkownika do serwletu.
  • Serwlet wykona rdzeń skryptu osadzony w pliku xxxxx.js i
  • Używając Printwriter, wyrenderuje odpowiedź użytkownikowi.

  • W międzyczasie Servlet utworzy plik klucza.

  • Gdy serwlet spróbuje wykonać znajdujący się w nim plik xxxx.js, filtr
    aktywuje się i wykryje istnienie pliku klucza, a tym samym usunie
    plik klucza .

W ten sposób jeden cykl się skończył.

Krótko mówiąc, plik klucza zostanie utworzony przez serwer i zostanie natychmiast usunięty przez filtr.

Stanie się to przy każdym trafieniu.

Przypadek 2 -

  • Jeśli użytkownik spróbuje uzyskać źródło strony i bezpośrednio kliknie plik xxxxxxx.js, filtr wykryje, że ten plik klucza nie istnieje.
  • Oznacza to, że żądanie nie pochodzi z żadnego serwletu. W związku z tym zablokuje łańcuch żądań.

Zamiast tworzenia pliku można użyć wartości ustawienia w zmiennej sesji.

Bhushan Mahajan
źródło