Come utilizzare Jscrambler 4 per proteggere l'integrità della tua applicazione

Negli ultimi anni, come linguaggio indipendente dalla piattaforma, JavaScript ha trovato la sua strada in un'ampia gamma di usi, dalle applicazioni mobili ai giochi basati su HTML5 e ai server Node.js. Sono lontani i giorni in cui si utilizzava JavaScript solo per effetti speciali e convalida del modulo.

Questo sviluppo è utile sia per gli sviluppatori che per i consumatori, che ottengono aggiornamenti più rapidi delle loro applicazioni indipendentemente dalla piattaforma su cui si trovano. 

Ma solleva anche questioni sulla sicurezza. 

Come possiamo assicurarci che le nostre applicazioni funzionino come previsto? Come applichiamo le nostre licenze? E che dire della pirateria?

In questo tutorial, esamineremo le minacce più comuni alle tue applicazioni JavaScript e come puoi proteggerti da esse. Vedremo anche i passaggi per rendere Jscrambler 4.0 una parte del flusso di lavoro di sviluppo per mantenere al sicuro le tue applicazioni JavaScript.

Proteggi la comunicazione tra client e server

Poiché JavaScript è utilizzato principalmente online, il punto di partenza naturale è la connettività tra l'applicazione in esecuzione sui dispositivi degli utenti e sul server.

Innanzitutto, lasciatemi toglierlo di mezzo: non importa quanto sia buona la protezione aggiunta sul lato client, è sempre necessario partire dal presupposto che il cliente possa essere compromesso. Alcuni arrivano al punto di dire che devi trattare il cliente come malevolo. 

Fondamentalmente, la ragione di ciò è che, indipendentemente da quanto tu abbia protetto il tuo client, la comunicazione HTTP tra il client JavaScript e il tuo server può sempre essere manomessa, con l'aiuto di strumenti di sniffing della richiesta o anche di client personalizzati che usano il tuo protocolli del server. 

Quindi, se la tua applicazione parla con un server, prima di aggiungere qualsiasi altra forma di sicurezza sul lato client, inizia proteggendo il tuo server il più possibile, proprio come faresti usando una normale interfaccia HTML.

1. Convalida i tuoi dati

Puoi pensare di proteggere il tuo server attraverso due concetti: integrità dei dati e riservatezza dei dati. 

L'integrità dei dati significa che i dati nella tua applicazione devono rimanere accurati e coerenti durante il suo ciclo di vita. Riservatezza dei dati significa che i dati dei tuoi utenti devono essere protetti e terze parti non dovrebbero mai accedervi.

Mentre dovresti eseguire la convalida dei parametri già nel client JavaScript, ciò non impedirà agli hacker di inviare dati malformati o addirittura dannosi al tuo server. Dopotutto, qualcuno che cerca di distruggere il tuo server probabilmente non utilizzerà nemmeno l'interfaccia utente!

Quindi, quando si lavora con un'applicazione JavaScript, tutte le convalide regolari lato server, dall'esclusione di caratteri HTML per verificare che gli attributi siano del tipo corretto, si applicano comunque.

A volte, i dati inviati sono formattati correttamente ma non hanno senso nello stato dell'applicazione, ad esempio quando un giocatore invia un punteggio incredibilmente alto. È possibile proteggere il server da situazioni come queste utilizzando i controlli di integrità e inserendo il maggior numero possibile di logica dell'applicazione sul server. 

2. Proteggi i tuoi dati

Un'altra parte della protezione della comunicazione client-server è garantire che tutti i dati specifici dell'utente rimangano riservati e accessibili solo dall'utente autorizzato. 

Il primo passo è usare SSL in tutte le comunicazioni tra il tuo client JavaScript e il tuo server per impedire ad altri utenti di Internet di spiare i dati passati tra i due.  

Successivamente, dovrai verificare che le richieste provengano effettivamente dall'utente corretto. I dettagli per il modo migliore per farlo dipendono dalla tua applicazione. Nelle applicazioni web-based, i nonces sono una tecnica utile, mentre nel contesto di un gioco, l'autenticazione OAuth potrebbe essere un approccio più naturale.

Tieni presente che non devi mai archiviare informazioni sensibili come password o chiavi API nel tuo client. È una buona idea pensare al tuo server come a un'API che può essere utilizzata dal client JavaScript ma anche da altri client su Internet.

Non è possibile controllare tutto sul server

Mentre i controlli sopra menzionati si applicano ad ogni tipo di applicazione, quando viene aggiunta una maggiore complessità al client, alcune verifiche diventano difficili da fare.

Nei giochi multiplayer, ad esempio, l'esecuzione di tutta la logica attraverso il server funzionerà bene finché il gioco è semplice e hai solo un numero limitato di giocatori. Ma man mano che la base di utenti attiva cresce, il carico sul server ti farà considerare la possibilità di spostare parte dell'elaborazione sul client. Lo stesso accade se la logica di gioco è così complessa che la simulazione sul server richiederebbe molte risorse.

È lì che i confini si confondono. 

Anche se l'idea di non fidarsi mai del client sembra buona, in pratica dovrai impostare una soglia, dicendo "questo è quanto mi fido del mio cliente" e esegui solo controlli di integrità sul server. Se alcune delle azioni del giocatore riguardano anche altri giocatori, è qui che devi coinvolgere maggiormente il server, lasciando i punti in cui l'utente può danneggiare solo la sua esperienza al cliente da gestire.

E i molti casi di utilizzo di JavaScript in cui non si dispone di un server o in cui la logica dell'applicazione sul server non ha senso, come app mobili, lettori di streaming HTML5 e applicazioni di mappe?

Infine, è bene tenere a mente che, indipendentemente dalla sicurezza del server, il tuo client JavaScript è sempre esposto. Quindi, a meno che non aggiungiate qualche tipo di protezione, è molto facile per un utente malintenzionato (ad esempio, Man-in-the-Browser o attacchi di estrazione dati) per ottenere l'accesso a dati sensibili o per modificare l'esperienza utente..

Proteggi il tuo JavaScript

Come linguaggio dinamico, JavaScript può essere modificato nel browser utilizzando strumenti di base come il debugger integrato nel browser. Se sai cosa stai facendo, puoi sostituire parti del codice e cambiare il comportamento dell'applicazione al volo.

Come abbiamo visto sopra, dovresti assicurarti che i dati non validi non arrivino mai al database sul tuo server. Ma alcuni cambiamenti sono più limitati di questo. Un plug-in malware può aggiungere nuovi pulsanti alla tua applicazione per attirare l'utente verso un sito esterno. Oppure l'utente potrebbe incidere il client per vedere più del gioco senza giocarci.

Modifiche come questa non interromperanno l'intera applicazione, ma cambieranno il modo in cui l'utente la sperimenta. Nel caso del malware, questo può anche rappresentare una seria minaccia alla privacy dell'utente.

Poiché JavaScript è un linguaggio interpretato, è impossibile impedirlo completamente. Un hacker dedicato troverà sempre un modo per superare gli ostacoli, proprio come un ladro può rompere qualsiasi blocco. Ma possiamo fare irruzione così duramente che la maggior parte degli utenti userà metodi appropriati (come essere bravi nel gioco) piuttosto che hackerare l'applicazione.

Qui è dove Jscrambler può aiutarti. 

1. Rendi difficile il tuo JavaScript

Jscrambler è una piattaforma di sicurezza JavaScript che mira a garantire che le applicazioni JavaScript siano eseguite nel modo in cui sono state sviluppate.

Per provare Jscrambler, visita la sua homepage e iscriviti per una prova gratuita. Se lo trovi all'altezza delle tue aspettative, puoi in seguito scegliere uno dei suoi piani a pagamento.

Dopo l'accesso, se c'è del testo che dice "È ora disponibile una nuova versione di Jscrambler" nella parte superiore della pagina significa che stai ancora visualizzando la versione precedente. Clicca su Provalo ora.

Jscrambler 4 organizza il tuo lavoro in applicazioni, ognuna delle quali può essere costituita da uno o più file JavaScript. Quindi, vedrai la schermata per selezionare l'applicazione su cui lavorare. 

Se vuoi testare la funzionalità usando una tua applicazione JavaScript, clicca su Crea app

Per ora, però, scegliamo Terreno di gioco. In questa modalità, potrai provare tutte le trasformazioni su uno script di esempio, mentre le trasformazioni che puoi applicare alla tua applicazione effettiva sono limitate dal tuo livello di iscrizione.

A sinistra, vedrai il Albero dei file, un elenco di file nella tua applicazione e un Inserisci pulsante per l'importazione o la creazione di nuovi file. Nel parco giochi, il pulsante Aggiungi è disabilitato.

Sulla destra, c'è un menu per la raccolta del Specifiche della lingua e Modalità di applicazione per la tua app. Jscrambler li usa per garantire che il codice trasformato funzioni nell'ambiente selezionato, tenendo conto dei suoi limiti e delle sue possibilità.

Ora andremo con ES5 e una base App Browser Web.

Clicca sul nome del file (clock.js) per iniziare a lavorarci.

Il contenuto del file verrà mostrato al centro dello schermo: il codice sorgente a sinistra e la versione trasformata da Jscrambler a destra.

Quindi, selezionare il Trasformazioni di codice scheda a destra per rivelare un elenco di trasformazioni disponibili. Jscrambler ti permette di scegliere le trasformazioni che trovi rilevanti per il tuo codice. Puoi anche usare annotazioni nel tuo codice per cambiare il modo in cui il codice viene trasformato. Ciò può essere utile in blocchi di codice critici per le prestazioni, ad esempio le funzioni di rendering nei giochi.

Per testare le trasformazioni, selezionale una alla volta. Quindi fare clic su Proteggi l'app nella parte inferiore della finestra per creare una nuova versione del codice trasformato.

Accanto al pulsante, vedrai un misuratore che presenta gli effetti di queste modifiche sul tuo codice JavaScript.

Nel meter, vedrai tre icone, che rappresentano il costo, la resilienza e la potenza (andando da sinistra a destra nella schermata sopra) delle trasformazioni che hai selezionato per la tua applicazione.

Per iniziare, seleziona la casella di controllo di fronte a Flusso di controllo, e quindi fare clic su Proteggi l'app.

Il Controllo del flusso di appiattimento è una delle nuove potenti trasformazioni aggiunte in Jscrambler 4. Riduce il flusso di controllo dello script in modo che diventi difficile per una persona che legge il codice per seguire la logica della tua applicazione. 

Quindi, continua selezionando alcune opzioni di offuscamento. Man mano che ne aggiungi di più, noterai come il tuo codice diventa sempre più difficile da leggere, e quindi modifica senza comprometterne la funzionalità.

Inoltre, quando si fa clic su Proteggi l'app ancora, anche senza modificare le impostazioni, noterai che il contenuto dello script protetto cambia ogni volta. 

Le trasformazioni di Jscrambler sono polimorfo, assicurandosi che le trasformazioni producano un output diverso ogni volta. In questo modo, anche se qualcuno fosse in grado di hackerare la versione corrente, la prossima volta che eseguirai il tuo codice con Jscrambler, quelle modifiche non funzionerebbero più.

2. Fai che la tua applicazione si protegga

Finora abbiamo parlato dei modi per assicurarci che l'applicazione funzioni come previsto impedendo all'utente e agli estranei di modificare il codice sorgente. Ma questa non è l'unica minaccia alla tua applicazione di cui devi preoccuparti. 

Poiché JavaScript è diventato popolare nelle applicazioni standalone e mobili, la pirateria è diventata un problema reale anche in questo ambito.

Sono sicuro che tutti abbiamo fatto clic "Vedi la fonte" per imparare come fare un nuovo fantastico effetto o trucco e adattare ciò che abbiamo imparato sui nostri siti web. Non è di questo che sto parlando qui. 

Supponiamo, invece, che tu abbia creato un popolare gioco per dispositivi mobili in HTML5 e JavaScript. Grazie alla portabilità di JavaScript, puoi utilizzare lo stesso codice su Android, iOS e altre piattaforme e raggiungere un pubblico più ampio senza il lavoro extra di scrivere versioni native per ogni ambiente. Ma c'è un problema: chiunque può copiare il codice JavaScript, apportare alcune modifiche e venderlo come proprio!

Le trasformazioni del passaggio precedente aiutano a prevenire ciò rendendo difficile la lettura del codice e il reverse engineering. In aggiunta a loro, Jscrambler aggiunge trappole di codice, funzionalità che fa sì che il codice si protegga da solo.

Diamo un'occhiata ad alcuni di loro.

In Jscrambler, nell'elenco delle trasformazioni, troverai una sezione intitolata Code Locks.

Le trasformazioni in questa sezione aggiungono un ulteriore livello di sicurezza alla tua applicazione JavaScript. 

Usandoli, puoi limitare l'esecuzione del tuo codice a un determinato set di browser, un intervallo di tempo (utile per le demo che non dovrebbero essere eseguibili dopo che il periodo di anteprima è finito), su un determinato dominio (di solito il tuo) e un particolare sistema operativo.

Una funzionalità più potente per proteggere il tuo codice è lato client RASPA (Autoprotezione dell'applicazione runtime). Modifica il tuo codice JavaScript, facendolo difendere dalla manomissione del runtime. Ad esempio, l'applicazione smetterà di funzionare se qualcuno tenta di aprire il debugger.

Finalmente, nel Ottimizzazione sezione, selezionare minification per minimizzare il codice e rendere il file più piccolo.

Quindi, fare clic su Proteggi l'app, seguito da Scarica l'app per scaricare il codice sorgente e utilizzarlo nella tua applicazione.

Jscrambler tiene traccia della cronologia delle trasformazioni, quindi puoi sempre tornare a una versione precedente.

3. Usa i modelli per rendere il tuo lavoro più facile

Come abbiamo visto, la configurazione del livello di protezione selezionando le caselle di controllo una per una è semplice. Ma puoi comunque accelerare il tuo flusso di lavoro raggruppando le tue comuni combinazioni di trasformazioni in modelli.

Dopo aver trovato una serie di trasformazioni che desideri memorizzare per uso futuro, fai clic su Crea modello in fondo al Impostazioni dell'applicazione sezione.

Jscrambler ti chiederà di dare al tuo modello un nome e una descrizione. 

Digitare qualcosa di descrittivo per il futuro e fare clic su Salva modello

Puoi anche utilizzare uno dei modelli già disponibili su I tuoi modelli tab:

Sposta il puntatore del mouse sopra i nomi dei modelli per leggere di più su di essi e capire quando hanno senso. Quindi fai clic su di essi per vedere quali trasformazioni applicano al tuo codice.

4. Fai di Jscrambler una parte del tuo flusso di lavoro di sviluppo

Finora, abbiamo coperto alcuni modi in cui Jscrambler può aiutarti a proteggere la tua applicazione utilizzando l'interfaccia utente web. Mentre l'interfaccia è intuitiva, man mano che la tua applicazione cresce, vorrai qualcosa di più semplice.

Inoltre, come ho detto prima, Jscrambler è polimorfico, generando un output diverso ogni volta. Quindi, è utile eseguire di nuovo lo strumento di tanto in tanto, anche se non ci sono modifiche ai file specifici.

Per fare ciò, diamo uno sguardo allo strumento da riga di comando di Jscrambler.

Innanzitutto, scarica e installa lo strumento da riga di comando utilizzando npm. Sulla riga di comando, digitare:

sudo npm install -g jscrambler

Una volta completata l'installazione, torna alle tue applicazioni nell'amministratore di Jscrambler. 

Si noti che per utilizzare lo strumento da riga di comando, è necessario utilizzare un'applicazione reale anziché lo script del parco giochi. Quindi, se non hai ancora un'applicazione, creane una ora.

Dopo aver selezionato le trasformazioni che desideri applicare, fai clic sul pulsante di download nell'angolo in alto a destra della pagina. Questo scaricherà le tue impostazioni sul tuo computer come file JSON.

Copia il file JSON nel tuo progetto. Non affidarlo al controllo della versione poiché il file contiene la chiave API e il segreto per l'utilizzo dell'API Jscrambler.

Quindi, esegui il jscrambler comando per eseguire le trasformazioni sui tuoi file JavaScript. 

Ad esempio, se hai solo un file, test.js, puoi eseguire il seguente comando:

$ jscrambler -c jscrambler.json -o test.protected.js test.js 

Nel comando, hai passato nel file JSON contenente le impostazioni dell'applicazione utilizzando il -c parametro, seguito dal file di output (-o test.protected.js), e infine il file JavaScript da proteggere.

Per eseguire la protezione di tutti i file JavaScript nella directory del progetto, è possibile utilizzare qualcosa come questo:

$ jscrambler -c jscrambler.json -o protected / ** / *. js

In questo esempio, invece di un file di output, si definisce una directory (protetta) dove Jscrambler metterà i risultati della protezione.

Ora, non devi tornare all'interfaccia utente web di Jscrambler ogni volta che apporti modifiche ai tuoi file JavaScript. Questo renderà più probabile che ti ricorderai del passaggio, e quindi manterrai la tua applicazione sicura.

Come ulteriore miglioramento, è possibile anche impostare l'attività Jscrambler da eseguire ogni volta che si verificano modifiche negli script, ad esempio utilizzando Grunt. Oppure potrebbe anche essere un'attività sul tuo server di integrazione continua, in esecuzione ogni volta che viene impegnata una nuova versione del codice.

Conclusione

Jscrambler fornisce strumenti all'avanguardia per rendere difficile per cracker, imbroglioni e malware iniettare funzionalità indesiderate all'applicazione o modificare le variabili dell'applicazione. Rende anche difficile per gli altri copiare il tuo codice e ridistribuirlo come proprio.

La sicurezza è un campo complesso con molteplici minacce diverse da considerare. Pertanto, quando il codice JavaScript parla con un server, la soluzione migliore consiste nell'utilizzare una combinazione di best practice per lo sviluppo del server, validazione dei parametri affidabile e una piattaforma di sicurezza JavaScript come Jscrambler per rendere il client a prova di manomissione. In questo modo, puoi prevenire la maggior parte degli attacchi contro l'integrità della tua applicazione già nel client e assicurarti che i tuoi clienti ottengano l'esperienza che hai progettato per loro.

Jscrambler può anche aiutarti a sconfiggere gli attacchi Man-in-the-Browser (MitB) e le frodi, i bot, le minacce da 0 giorni e l'APT (Advanced Persistent Threats) rilevando le modifiche apportate al DOM e dandoti tutte le informazioni di cui hai bisogno fermare questi attacchi. Per ulteriori informazioni, contattare [email protected].

Per ulteriori informazioni su Jscrambler, le sue nuove funzionalità e gli ultimi aggiornamenti, è anche possibile visitare il sito Web Jscrambler.