Anni di supporto per il plug-in WordPress mi hanno insegnato una cattiva abitudine. un cliente ti invia un blob di opzioni seriali rotte, devi leggerlo presente, quindi lo incolli nel primo unserializer online che Google ti dà Ho fatto questo per molto tempo senza pensarci - fino al giorno in cui ho guardato quello che ho appena incollato I' era un cliente' s wp_options Esporta. Conteneva la password SMTP, una chiave API MailChimp e un codice di licenza. Tutto era appena stato inviato a un server di cui non sapevo nulla, gestito da qualcuno che non riuscivo a nominare, in un paese che non riuscivo a indovinare.
Non è successo niente di male, per quanto ne so. That' è la parte inquietante - non ho modo di saperlo. Non c'è alcuna notifica per & quot; la tua pasta è stata registrata.& quot; I dati o erano presenti nei registri di accesso di someone' oppure lo facevano't e I' non scopriranno mai quale.
Questo incidente è una parte importante del motivo per cui Toolz.dev funziona in questo modo. Ognuno dei 50 strumenti sul sito elabora il tuo input nel tuo browser. Non & quot; promettiamo di eliminarlo dopo l'elaborazione& quot; - non viene mai trasmesso in primo luogo Questa guida spiega la differenza tra queste due architetture, perché è più importante per gli sviluppatori che per quasi chiunque altro e come verificare uno strumento' si afferma in circa 30 secondi. E, poiché alla fine ho incollato quel blob del cliente in un posto sicuro, il Non serializzatore PHP Questo ha sostituito la mia cattiva abitudine.
tl; dr: Gli strumenti lato server trasmettono il tuo input a qualcun altro' s machine, dove può essere registrato, mantenuto, violato o condiviso - e puoi' t verificarne uno qualsiasi Gli strumenti lato client ti spediscono il codice ed elaborano tutto localmente; la verifica richiede un controllo della scheda Rete DevTools. Per qualsiasi cosa contenga credenziali: JWT,
wp-configvalori, stringhe di connessione, risposte API: utilizza strumenti lato client come Formattatore JSON, Decoder JWT, Formattatore SQL, e Condivisore di yam. Tutto acceso Toolz.dev viene eseguito nel browser.
Cosa succede effettivamente quando incolli in uno strumento online?
Ci sono esattamente due architetture e ogni strumento online ne utilizza una.
lato server: Il tuo input va dal tuo browser al server dello strumento, viene elaborato lì e il risultato torna indietro. cinque passaggi e i tuoi dati esistono sull'infrastruttura di qualcun altro durante tre di essi.
Your browser → network → their server → network → your browser
(input) (transit) (processing, (transit) (result)
logging?,
retention?)
lato cliente: il tuo browser scarica il tool's JavaScript una volta, e poi tutto - input, elaborazione, output - avviene in una scheda sulla tua macchina L'unica cosa che ha mai attraversato la rete è stato il codice.
Their server → your browser
(code) (input + processing + result, all local)
La distinzione suona accademica fino a quando non si elenca ciò che può accadere ai dati su un server che si don' t controllare Può atterrare nei registri di accesso e log delle applicazioni Può essere catturato da tracker di errore come Sentry, che snapshot richiesta contesto quando qualcosa si lancia Può essere mantenuto nei backup molto tempo dopo l'operatore & quot; eliminato& quot; it. Può essere letto da qualsiasi dipendente con accesso log Può essere spazzato su in una violazione E con diversi & quot; strumento libero& quot; operatori, può essere il prodotto reale - monetizzato attraverso analisi o venduto come dati di formazione.
Nessuno di questi richiede malizia. Le sole configurazioni di registrazione predefinite da sole ne faranno la maggior parte. L'operatore di quel non serializzatore che ho usato probabilmente non ha mai guardato la password SMTP del mio cliente. Ma "probabilmente" non è una posizione di sicurezza.
Perché questo è un affare più grande per gli sviluppatori che per chiunque altro?
Per quello che incolliamo. Un utente medio incolla un paragrafo di testo in un contatore di parole. Uno sviluppatore incolla:
Risposte API con token live. You're debug di un'integrazione, si copia l'intera risposta - intestazioni incluse - e la si formatta per leggerla Quello Authorization: Bearer ... L'intestazione è appena andata ovunque viva il formattatore. GitGuardian's Immersione in stato di segreti la ricerca ha rilevato circa 12,8 milioni di segreti esposti in GitHub pubblico commette solo nel 2023 Nessuno pubblica numeri equivalenti per gli strumenti online, perché a differenza di GitHub, tool operators' i registri sono' t pubblicamente scansionabili That' non è rassicurante - significa che la superficie di perdita è invisibile.
JWTS. Un token Web JSON è codificato in base64url, non crittografato RFC 7519 è esplicito su questo. Il carico utile di ogni token che incolla in un decoder lato server consegna l'ID dell'utente, l'e-mail, i ruoli e la scadenza. Se il token è ancora valido, hai potenzialmente consegnato una credenziale di sessione di lavoro. decodificarli localmente con il Decoder JWT invece.
SQL con dati reali in esso. La query che stai formattando ha a WHERE email = '[email protected]' clausola in essa e i nomi delle tabelle tracciano l'intero schema. la Formattatore SQL lo tiene nella tua scheda.
file di configurazione. wp-config.php valori, .env Contenuti, manifesti di Kubernetes, database.yml- la configurazione è dove vivono le credenziali. I' hai convalidato i file YAML che contenevano tutti i segreti che aveva la mia app Laravel. Quello' è un incolla che desideri venga attraversato dal lato client Condivisore di yam, non un modulo post.
Dati WordPress serializzati. La mia rovina personale, secondo l'introduzione WordPress memorizza opzioni e metadati come stringhe serializzate su PHP, e il loro debug significa serializzarli: il Non serializzatore PHP Lo fa senza che i dati del tuo cliente escano la tua macchina.
Un pasta negligente di una qualsiasi di queste categorie è un incidente di sicurezza che nessuno rileverà, riferirà o ripulirà.
Come si verifica che uno strumento sia effettivamente lato client?
Questa è la parte che mi piace di più dell'architettura lato client: Non devi fidarti della politica sulla privacy di nessuno. L'affermazione è verificabile meccanicamente.
- Apri la pagina degli strumenti.
- Apri DevTools (F12) → network Tab. Controllare "Conserva registro."
- Incolla in alcuni dati di test riconoscibili -
MY-SECRET-TEST-12345funziona - ed eseguire lo strumento. - Guarda l'elenco delle richieste.
Se lo strumento è lato client, vedrai il caricamento della pagina iniziale e le risorse statiche, quindi nessuna cosa quando elabori Se una richiesta si attiva quando premi il pulsante di conversione/formato/processo, filtra le richieste e ispeziona i payload per la tua stringa di test Trovato? lato server Fatto - ci è voluto mezzo minuto e ora sai di più su quello strumento di quanto la sua politica sulla privacy ti direbbe mai.
Due note di onestà su Toolz.dev, perché questo taglia in entrambi i modi. Innanzitutto, il sito carica l'analisi per i conteggi di visualizzazione della pagina e tiene traccia la quale è stato utilizzato uno strumento - per i limiti di utilizzo - ma mai che cosa ci metti Esegui il controllo della rete da solo; l'input non appare mai in nessuna richiesta In secondo luogo, il lato client ha una vera limitazione: il tuo browser fa il lavoro, quindi una transcodifica video da 4 GB è & #39; t avviene in una scheda Per la categoria di strumenti formattatore/convertitore/codificatore, tuttavia, il moderno JavaScript è più che abbastanza veloce - di solito più veloce del lato server, perché lì & #39; non carica alcun viaggio di andata e ritorno.
Lato server vs lato client: il confronto diretto
| Strumenti lato server | Strumenti lato client | |
|---|---|---|
| Dove avviene l'elaborazione | Server dell'operatore | Il tuo browser |
| dati trasmessi? | Sì, ogni volta | No - solo il tool's il codice viene scaricato |
| Può essere registrato/mantenuto dall'operatore | Sì, spesso per impostazione predefinita | No - operatore non lo riceve mai |
| esposto in una violazione dello strumento | Sì, se mantenuto | no |
| verificabile da te | No, ti fidi della politica | Sì - Scheda Rete DevTools, ~30 secondi |
| Necessario accordo per il processore del GD | Sì, se dati personali (art. 28) | Non si verifica alcun trattamento da parte di una terza parte |
| Funziona offline dopo il carico | no | Spesso sì |
| Velocità per le attività di sviluppo tipiche | Carica + Coda + Scarica | Istantaneo: nessun viaggio di andata e ritorno in rete |
| Computazione pesante (video, file enormi) | più adatto | limitato dal tuo dispositivo |
Cosa dice il GDPR su questo?
I' sono uno sviluppatore, non un avvocato, quindi trattalo come un contesto ingegneristico piuttosto che come una consulenza legale, ma lo schema è importante per chiunque gestisca i dati degli utenti dell'UE.
sotto Regolamento (UE) 2016/679 (GDPR), se prendi dati personali - un cliente's supporta l'esportazione, una risposta API con i record degli utenti - e li spingi attraverso un server di terze parti' s, quella terza parte sta elaborando dati personali per tuo conto L'articolo 28 dice che richiede un accordo di trattamento dei dati Chiediti quanti formattatori online gratuiti offrono un DPA Non ne ho mai visto uno.
Gli strumenti lato client eludono tutta la questione, non attraverso un'abile redazione legale ma attraverso l'architettura: nessun dato raggiunge il provider, quindi non c'è un trattamento di terze parti su cui cartaceo La minimizzazione dei dati (articolo 5, paragrafo 1, lettera c) è soddisfatta nel modo più letterale possibile - la quantità dei tuoi dati che il provider raccoglie è zero La stessa logica aiuta con HIPAA (i dati sanitari non raggiungono mai un server non conforme), gli audit SOC 2 (nessun subprocessore non controllato nel percorso dati) e PCI DSS.
Per essere chiari: l'utilizzo di strumenti lato client non fa Il tuo prodotto Conforme al GDPR Rimuove una perdita specifica e sorprendentemente comune nel flusso di lavoro di sviluppo: quella in cui uno sviluppatore, cercando di essere utile su un ticket di supporto, incolla i dati personali in un sito Web casuale.
Quali attività non dovrebbero mai toccare un server?
Il mio triage personale, ordinato per quanto una perdita farebbe male:
Mai lato server: contiene o implica credenziali:
- Formattazione delle risposte e dei payload delle API: Formattatore JSON
- Token di decodifica: Decoder JWT, convertitore base64
- Query di formattazione: Formattatore SQL
- Configurazione delle configurazioni: Condivisore di yam
- Debug di dati WordPress: Non serializzatore PHP
- Hashing e confronto valori: Generatore di hash
- Generazione di credenziali: Generatore di password, Generatore di UUID
Preferisci fortemente client-side - proprietario ma non segreto:
- Codice interno o contratti diversi: testo Differenza, JSON DIFF
- Testare la regex rispetto alle linee di registro di produzione: tester regex
- Conversione di timestamp da log e token: Convertitore di timestamp
- Comprimere schermate interne: compressore di immagini
Pulire basse, ma lato client è ancora solo più veloce:
- Conta le parole: Contatore di parole
- Testo segnaposto: Generatore di Ipsum di Lorem
- Colori e sfumature: selettore, Generatore di sfuma
C'è una procedura dettagliata più lunga della cassetta degli attrezzi completa nel Guida agli strumenti di produttività per gli sviluppatori E il Guida agli strumenti di codifica.
Se hai veramente bisogno di uno strumento lato server - una conversione pesante senza alternative locali - igienizza prima Scambia chiavi reali per YOUR_API_KEY, email reali per [email protected]. Sono 60 secondi di ricerca e sostituzione che trasformano un potenziale incidente in un non evento.
Perché la maggior parte degli strumenti online è comunque lato server?
In parte storia, in parte incentivi Nel 2010, i browser erano' all'altezza del lavoro - l'elaborazione pesante doveva avvenire su un server Quel vincolo è andato: i moderni motori JavaScript e WebAssembly gestiscono la formattazione, la conversione, l'hashing e la compressione delle immagini a velocità indistinguibili da quelle native, e le API del browser (File, Canvas, Web Crypto) coprono l'I/O.
Gli incentivi sono il problema più appiccicoso L'elaborazione lato server consente a un operatore di vedere l'utilizzo in dettaglio, applicare i limiti con precisione, mantenere proprietaria la logica di elaborazione e, nei casi peggiori, trattare i dati stessi come entrate Uno strumento che non riceve mai i tuoi dati può' t monetizzare i tuoi dati, che è proprio il motivo per cui alcuni operatori non vogliono' t vogliono l'architettura anche se ora è tecnicamente facile.
Quando ho creato gli strumenti per Toolz.dev, il lato client era in realtà il più semplice La scelta ingegneristica, non solo quella più privata: nessun server di elaborazione da ridimensionare, nessun caricamento su protezione, nessuna politica di conservazione da scrivere e ogni strumento funziona in modo identico nell'app Web e nell'app desktop perché la logica è semplice dattiloscritto indipendente dalla piattaforma. La storia della privacy e la storia dell'ingegneria indicano la stessa direzione. È raro quando succede; prendi la vittoria.
Domande frequenti
Cosa significa effettivamente "Elaborazione lato cliente"?
Tutto il calcolo avviene nel tuo browser, in JavaScript (o WebAssembly), sul tuo dispositivo. L'unico ruolo del server sta fornendo il codice dello strumento quando viene caricata la pagina. Il tuo input non viene mai visualizzato in nessuna richiesta di rete, che puoi confermare nella scheda Rete DevTools.
Come posso verificare se uno strumento è lato client?
Apri DevTools (F12) → Scheda Rete, abilita & quot; Conserva log, & quot; incolla i dati riconoscibili dei test nello strumento, e processali Se nessuna richiesta contenente i tuoi fire di stringa di test, lo strumento è lato client Su Chrome puoi anche passare DevTools a & quot; Offline" dopo il caricamento della pagina - un vero strumento lato client continua a funzionare.
Gli strumenti lato client sono più lenti di quelli lato server?
Per le attività tipiche degli sviluppatori, loro' sono più veloci - lì' non c'è caricamento, nessuna coda, nessun download L'elaborazione di un file JSON da 2 MB localmente è quasi istantanea, mentre un round-trip del server aggiunge latenza ad ogni passaggio L'eccezione è il calcolo pesante (trascodifiche video di grandi dimensioni, file su scala gigabyte), in cui un server potente batte una scheda del browser.
Toolz.dev raccoglie qualcosa?
L'analisi della visualizzazione della pagina e l'utilizzo anonimo per strumento contano (utilizzati per i limiti di velocità) - ma mai il contenuto che elabori I file di input, output e caricati rimangono nel tuo browser Questo è verificabile con il controllo della scheda Rete piuttosto che qualcosa che devi prendere per fede.
Incollare un JWT in un decoder online è davvero rischioso?
Sì, più di quanto la maggior parte degli sviluppatori supponga Per RFC 7519, i payload JWT sono codificati, non crittografati - chiunque detenga il token può leggere le affermazioni, e se il token has' t scaduto, potrebbe essere utilizzabile come credenziale live Incollarne uno in un decoder lato server trasmette un token di sessione possibilmente valido a una terza parte sconosciuta Usa un decoder lato client.
L'uso di strumenti lato client mi rende conforme al GDPR?
Nessuna scelta di uno strumento ti rende conforme. Ciò che gli strumenti lato client rimuovono è un rischio specifico: i dati personali dai tuoi sistemi che raggiungono un processore di terze parti non controllato (che richiederebbe un accordo di elaborazione dati dell'articolo 28 che quasi certamente non hai con un sito di strumenti gratuito). Gli obblighi del proprio prodotto non vengono influenzati.
Il mio datore di lavoro può vedere cosa elaboro negli strumenti lato client?
Il monitoraggio della rete vede quali siti visiti, non cosa digiti in uno strumento lato client - there's nessuna richiesta che porta il tuo input da osservare Il monitoraggio degli endpoint installato sul dispositivo stesso (acquisizione dello schermo, keylogger) vede tutto indipendentemente dall'architettura dello strumento, quindi la risposta onesta è: non tramite la rete, possibilmente tramite l'endpoint.
E se non ci fosse un'alternativa lato client per il mio compito?
Igienizza prima di incollare: sostituire le credenziali con i segnaposto (YOUR_API_KEY), scambiare dati personali reali con valori fittizi, stripname host e URL interni. Quindi controlla l'informativa sulla privacy dello strumento per la registrazione e la conservazione del linguaggio, preferisci gli strumenti open source che puoi ispezionare e trattare "libero, closed-source, lato server" come la combinazione più a rischio.
Qual è la differenza tra gli strumenti lato client e lato server?
Gli strumenti lato client spediscono il codice al tuo browser ed eseguono lì; gli strumenti lato server spediscono i tuoi dati a una macchina che fai & #39; t controllano ed eseguono lì Funzionalmente l'output può essere identico - la differenza riguarda interamente chi finisce per tenere il tuo input Con uno strumento lato server i tuoi dati esistono, per quanto brevemente, su qualcun altro disco & #39; s, nei loro registri e nei loro backup.
I formattatori e gli abbellimenti JSON online sono sicuri da usare?
Dipende dall'implementazione, non dalla categoria Formattazione JSON è banale da fare in JavaScript, quindi un formattatore lato client non ha motivo di trasmettere nulla - e il controllo della scheda Rete lo regola in dieci secondi Fai più attenzione del solito qui, perché gli sviluppatori JSON incollano in formattatori risposte API sproporzionatamente contenenti token, indirizzi email e ID interni.
