Dette innlegget vil beskrive prosessen for å skjule JavaScript-koden i visningskilden.
Hvordan skjule JavaScript-kode i View Source?
Først, for å skjule JavaScript-kode i visningskilden, se hvordan du åpner visningskilden i utviklerverktøyet. På nettsiden er det flere måter å åpne visningskilden på og se den aktuelle koden.
Den første måten er å ' Høyreklikk ' på siden og klikk på ' Vis sidekilde alternativ i en kontekstmenyen ' eller bruk snarveistasten ' Ctrl+U ':
Den vil vise den fullverdige kildekoden til siden i en ny fane som vist nedenfor:
Den andre måten er å ' Høyreklikk ' på siden og klikk på ' Undersøke alternativ fra en kontekstmenyen ' eller bruk hurtigtastene ' F12 ', og ' Ctrl+Shift+I '.
Mens du klikker på ' Undersøke '-alternativet, vil det åpne vinduet nedenfor med alternativer, der brukeren kan se koden.
La oss legge til funksjonalitet for å forhindre at høyreklikk og hurtigtaster på en nettside åpner ' Vis sidekilde ' alternativet.
Bruk kodelinjene nedenfor for å forhindre høyreklikk på en nettside:
dokument. addEventListener ( 'kontekstmenyen' , ( og ) => {og. forhindreStandard ( ) ;
} , falsk ) ;
Kodebiten ovenfor:
- Først påkaller du ' addEventListener() '-metoden ved å sende referansen til ' kontekstmenyen '.
- Deretter ringer du ' preventDefault() ' metoden og sett den ' falsk ”, som betyr at den stopper standard høyreklikkhendelse/alternativ.
Kodebiten nedenfor forhindrer snarveien inkludert ' Ctrl+Shift+I ', ' Ctrl+U ' og ' F12 ':
dokument. addEventListener ( 'taste ned' , ( og ) => {hvis ( og. ctrl-tasten || og. nøkkelkode == 123 ) {
og. stopppropagasjon ( ) ;
og. forhindreStandard ( ) ;
}
} ) ;
Produksjon
GIF-en ovenfor indikerer at ingen handling blir utført under ' Høyreklikk ' eller snarveistaster:
La oss nå se hvordan du skjuler kildekoden hvis brukeren bruker alternativet nedenfor.
Utdraget ovenfor viser en annen måte å åpne ' Utviklerverktøy ” annet enn å høyreklikke og hurtigtaster.
For å skjule JavaScript-koden fra dette alternativet, bruk de angitte trinnene:
Trinn 1: JavaScript-kode
Opprett en JavaScript-fil for JavaScript-koden som er relevant for sidens funksjonalitet. Her laget vi en JavaScript-fil kalt ' JSfile.js , hvor all JavaScript-koden vil bli plassert:
Trinn 2: Skjul JavaScript-kode
Skjul nå JavaScript-filen ved å følge disse kodelinjene i en stikkord:
scriptElement. type = 'tekst/javascript' ;
scriptElement. src = 'JSfile.js' ;
dokument. kropp . vedleggChild ( scriptElement ) ;
I kodebiten ovenfor:
- Opprett et nytt skriptelement ved å bruke ' createElement() 'metoden.
- Legg til JavaScript-kodefilen ' JSfile.js ', i det nyopprettede skriptelementet som et underordnet element ved å kalle ' appendChild() 'metoden.
Produksjon
Ovennevnte GIF indikerer at i sidefeltet til ' Kilde '-fanen, etter å ha åpnet ' Utviklerverktøy ', det er ingen ' JS file.js ”, fordi det nå er et underordnet element av skriptelementet.
Konklusjon
For å skjule JavaScript-kode i visningskilden, deaktiver hurtigtastene som ' Ctrl+Shift+I ', ' Ctrl+U ' og ' F12 ” som brukes til å åpne utviklerens verktøy for å se kildekoden, og høyreklikk kontekstmenyen på nettsiden. Eller lagre JavaScript-kodefilen i en annen skripttag. Dette innlegget beskriver prosessen for å skjule JavaScript-koden i visningskilden.