Hvis du noen gang har måttet skrive et faktisk prosjekt, finnes det sikkerhetsbekymringer — eller bør i det minste være det. Etter hvert som teknologien utvikler seg, kan vi skrive fantastiske, kraftige og høyytelsessystemer på kort tid, men det betyr også at ondsinnede mennesker og teknologier blir kraftigere og vanskeligere å overvinne. Derfor er det avgjørende å beskytte mot alle vanlige sårbarheter når man utvikler systemer i dag.
Angular tar seg av mye sikkerhet rett ut av boksen: det har sitt eget variable beskyttelsessystem og sanitærfunksjoner som forhindrer ondsinnet kode i appen din. En annen funksjon er kodekomprimering.
Minimering og forvirring
Kodekomprimering er en teknikk som reduserer størrelsen på kildekoden ved å fjerne unødvendige tegn som mellomrom og kommentarer, noe som forbedrer lasteytelsen til kildekoden. Denne prosessen er vanlig i webutvikling for JavaScript-, CSS- og HTML-filer, og den legger på en eller annen måte til et sikkerhetslag ved å skjule koden. Den komprimerte koden er ekstremt vanskelig å lese, og derfor regnes den som en slags obfuskering. Verktøyet kan imidlertid dekomprimere koden for å gjøre den lesbar, noe som deretter kan reverse-engineeres. Det er her forvirringen kommer inn.
Som et supplement til komprimering er kodeobfuskering en teknikk som gjør kildekoden vanskelig å forstå og reverse-engineere. Den brukes ofte for å beskytte immaterielle rettigheter, forhindre tukling og avskrekke omvendt ingeniørarbeid, noe som gjør det vanskelig for angripere å forstå logikken i koden og identifisere potensielle sårbarheter. Den konverterer lesbar kode til mer komplekse og obskure versjoner uten å endre funksjonaliteten. Kodeobfuskeringsverktøy kan også legge til død kode for å villede angripere, noe som gjør det vanskeligere å forstå programvarekodebasen.
Vel, la oss forvirre Angular-appen vår hvis du synes den er nyttig.
Webpack-obfuskator
Angular bruker Webpack under pakkefasen og har sine egne standardinnstillinger for å pakke modulene du utvikler. Vi vil utnytte dette og tilpasse hvordan Webpack pakker Angular-appene. Først, installer følgende pakker:
JavaScript-obfuscator: En kraftig gratis JavaScript-obfuscator med ulike funksjoner for å beskytte kildekoden din.
mens webpack-obfuscator bruker det som en plugin for å gi funksjonalitet til Webpack. Du kan finne JavaScript-obfuscator-koden her, og Webpack obfuscator-pluginen her.Innloggingen med hyperkoblingen er synlig.
Deretter lager du en custom-webpack.config.js-fil med den egendefinerte konfigurasjonen vi ønsker å bruke under bunteringsprosessen. Her er et enkelt eksempel:
Du kan tilby mange forskjellige konfigurasjonsmuligheter for plugins, webpack-obfuscator for å finjustere det forvirrede utgangspunktet. Dette er den enkleste måten å legge til debugProtection i koden din, noe som gjør det vanskelig å bruke konsollen til å holde oversikt over applikasjonens variabler og funksjoner.
Merk: Den andre i WebpackObfuscatorArray-parametere er filer som utelukker obfuskering。
Så langt har vi satt opp konfigurasjonen for Webpack. Nå må vi bruke den. Vi trenger også en annen avhengighet:
Dette vil hjelpe oss å integrere vår tilpassede webpakkebygger med Angular, slik at vi fortsatt kan bygge strukturer med Angular. Når pakken er installert, trenger vi bare å endre filen angular.json. Søk etter build-attributtet og legg til følgende:
Ved å erstatte builderfrom med @angular-devkit/build-angular:browser til @angular-builders/custom-webpack:browser, kan vi fortsatt bygge for nettleseren, men nå kan vi injisere vår egendefinerte webpack-konfigurasjon. Egenskapen customWebpackConfig setter referansen til filen slik at Angular kan bruke den.
Hvis alt er satt opp riktig, bør byggekommandoene dine fungere fint, og resultatet blir en forvirrende Angular-app!
brist
Vær imidlertid oppmerksom på at denne metoden har ulemper når det gjelder pakkestørrelse. Kodeobfuskering gjør det vanskeligere å reversere kode, men måten den deklarerer variabler på bruker flere tegn, noe som resulterer i en økning i størrelsen på pakken – nesten i motsatt retning av kodeminimering.
Det er det. Sørg for å bruke den bevisst og lær hvordan du kan rette opp svakhetene ved denne teknologien!
Original:Innloggingen med hyperkoblingen er synlig.
Referanse:Innloggingen med hyperkoblingen er synlig. |
Publisert 2024-12-23 11:06:14
|
|
|
