Ha valaha is írnod kellett egy valódi projektet, biztonsági aggályok vannak — vagy legalábbis kellene, hogy legyenek. Ahogy a technológia fejlődik, rövid idő alatt csodálatos, erőteljes, nagy teljesítményű rendszereket tudunk írni, de ez azt is jelenti, hogy a rosszindulatú emberek és technológiák egyre erősebbé és nehezebben legyőzhetők. Ezért elengedhetetlen, hogy ma rendszerfejlesztéskor minden gyakori sebezhetőségtől megvédjük.
Az Angular sok biztonsági intézkedést vállal már a dobozból fogva: saját változó védelmi rendszere és fertőtlenítő funkciói vannak, amelyek megakadályozzák a rosszindulatú kód futtatását az alkalmazásodban. Egy másik funkció a kódtömörítés.
Minimalizálás és zavar
A kódtömörítés egy olyan technika, amely csökkenti a forráskód méretét azáltal, hogy eltávolítja a felesleges karaktereket, például szóközöket és hozzászólásokat, javítva a forráskód betöltési teljesítményét. Ez a folyamat gyakori a webfejlesztésben JavaScript, CSS és HTML fájlok esetében, és valahogy biztonsági réteget ad hozzá azzal, hogy elrejti a kódot. A tömörített kód rendkívül nehezen olvasható, ezért tekintik valamilyen rejtélyezésnek. Az eszköz azonban képes leboncolni a kódot, hogy olvashatóvá tegyék, amit aztán visszafejthető. Itt jön a zavar.
A tömörítést kiegészítve a kód elrejtése egy olyan technika, amely megnehezíti a forráskód megértését és visszafejtését. Gyakran használják a szellemi tulajdon védelmére, a manipuláció megelőzésére és a visszafejtés elrettentésére, ami megnehezíti a támadók számára a kód logikáját és a potenciális sebezhetőségek felismerését. Olvasható kódot bonyolultabb és homályosabb verziókká alakít anélkül, hogy megváltoztatná a funkcióit. A kód elrejtő eszközök is hozzáadhatnak halott kódot, hogy félrevezetjék a támadókat, megnehezítve a szoftver kódbázisának megértését.
Nos, összekeverjük az Angular alkalmazásunkat, ha hasznosnak találod.
Webpack rejtőző
Az Angular a Webpacket használja a csomagolási fázisban, és saját alapértelmezett beállításai vannak a fejlesztett modulok csomagolásához. Ezt kihasználjuk, és személyre szabjuk, hogyan csomagolja a Webpack az Angular alkalmazásokat. Először telepítsd a következő csomagokat:
javascript-obfuscator: Egy erőteljes ingyenes JavaScript rejtőztető, amely számos funkcióval védi a forráskódodat.
míg a webpack-obfuscator bővítményként használja a funkciók biztosítására a Webpackhez. A JavaScript obfuszkátor kódját itt megtalálod, a Webpack obfuszkátor plugint pedig itt.A hiperlink bejelentkezés látható.
Ezután hozz létre egy custom-webpack.config.js fájlt azzal a testreszabott konfigurációval, amit a csomagolás során alkalmazni szeretnénk. Íme egy egyszerű példa:
Sokféle konfigurációs lehetőséget adhatsz pluginekhez, például webpack-obfuscatorhoz, hogy finomhangold a zavaros kimenetet. Ez a legegyszerűbb megoldás, amellyel a DebugProtection hozzáadható a kódodhoz, ami megnehezíti, hogy a konzol segítségével nyomon kövesd az alkalmazás változóit és funkcióit.
Megjegyzés: A második a WebpackObfuscatorbanA tömb paraméterek olyan fájlok, amelyek kizárják az elrejtést.。
Eddig beállítottuk a Webpack konfigurációját. Most használni kell. Szükségünk van egy másik függőségre is:
Ez segít abban, hogy integráljuk egyedi webpack építőnket az Angular-rel, így továbbra is építhessünk struktúrákat az Angular segítségével. Miután a csomag bevan van telepítve, csak a fájlt kell angular.json módosítanunk. Keresse meg a build attribútumot, és adja hozzá a következőket:
Ha a builderfrom-t @angular-devkit/build-angular:browser-ra cseréljük @angular-builders/custom-webpack:browser-ra, még mindig építhetünk a böngészőhöz, de most már beépíthetjük a saját webpack konfigurációnkat. A customWebpackConfig tulajdonság beállítja a fájl hivatkozását, hogy az Angular használni tudja.
Ha minden helyesen van beállítva, a build parancsaid rendben működnek, és az eredmény egy zavaros Angular alkalmazás lesz!
Hiány
Azonban kérjük, vegye figyelembe, hogy ennek a módszernek vannak hátrányai a csomagméret szempontjából. A kód elrejtése megnehezíti a kód visszafejtését, de a változók deklarálása több karaktert használ, ami a csomag méretének növekedéséhez vezet – szinte az ellenkező irányba a kód minimalizálásával.
Ennyi. Használd céltudatosan, és tanuld meg a technológia hiányosságait!
Eredeti:A hiperlink bejelentkezés látható. Utalás:A hiperlink bejelentkezés látható. |