Az oldalsebesség szempontjából komoly előnyökkel jár a publikus CDN szolgáltatások használata, de egyben komoly biztonsági kockázatokat jelenthet. Ezeket a kockázatokat azonban szinte teljesen kiiktathatjuk a Subresource Integrity alkalmazásával. Sok webfejlesztő ennek ellenére még 2024-ben sem használja az SRI lehetőségét.
A publikus CDN használatának legnagyobb előnye, hogy a nagy méretű JavaScript, CSS és egyéb fájlok a böngészők gyorsítótárában tárolódhatnak. Így a böngészőknek nem kell ugyanazokat a fájlokat minden egyes weboldal betöltésekor újra és újra letölteniük. A népszerű JavaScript könyvtárak, mint például jQuery aktuális verziója valószínűleg most is ott várakozik a böngésződ gyorsítótárában.
Felmerülhet azonban biztonsági kockázatok lehetősége. Egy tőlünk független CDN esetén régebben lehetőségünk sem volt ellenőrizni azt, hogy a látogató böngészője által letöltött fájl biztosan egyezik-e az általunk ellenőrzött verzióval. Egy illetéktelenek által módosított fájl akár kompromittálhatta is az oldalunkat. Sokan épp emiatt nem használták ki a CDN szolgáltatások vitathatatlan előnyeit.
Nos, ez 2015-ig valóban így volt, azonban a problémának azóta létezik egy W3C által ajánlott megoldása. Ez a címben is említett Subresource Integrity, vagy rövidebb nevén az SRI. Mára minden valamirevaló böngészőben támogatott, így kockázatok nélkül részesülhetnek a lapok a publikus CDN-ek előnyeiből.

Miért jó nekünk a Subresource Integrity?
A dolog végtelenül egyszerű, a harmadik fél szerverein tárolt tartalmakhoz a link és a script tageknél megadhatunk egy hasht, amellyel a böngésző ellenőrzi a letöltött fájlt. Ha a megadott algoritmussal generált hash nem egyezik az általunk megadottal, akkor a böngésző nem használhatja fel a tartalmat. Egyszerű és mégis nagyszerű.
Az SRI legfőbb előnyei:
- Az SRI használata nélkül 2024-ben a CDN-t használó weblap nem felel meg egy komolyabb biztonság audit követelményeinek.
- A CDN szolgáltatások előnyeit az oldalunk biztonsági szintjének csökkentése nélkül használhatjuk ki.
- A Man-in-the-Middle típusú (MitM) támadások egy része ellen is védetté tehetjük a lapjainkat.
- Biztosak lehetünk benne, hogy a föld túloldalán is pontosan ugyanazt az általunk ellenőrzött fájlt töltik le a látogatóink.
Az SRI azon ritka lehetőségek közé tartozik, amelynek hirtelen egyetlen hátrányát sem tudnám megemlíteni.
Hogy néz ki a Subresource Integrity a gyakorlatban?
Az alábbi példa egy jQuery Slim könyvtárat tölt be, az integrity attribútum tartalmazza az SHA384 algoritmussal létrehozott hasht. A hash létrehozható SHA256, SHA384 és SHA512 algoritmussal is, az SHA384 itt az arany középút.
<script src="https://code.jquery.com/jquery-3.7.1.slim.min.js" integrity="sha384-5AkRS45j4ukf+JbWAfHL8P4onPA9p0KwwP7pUdjSQA3ss9edbJUJc/XcYAiheSSz" crossorigin="anonymous"></script>
A crossorigin CORS attribútum is lényeges. A crossorigin=”anonymous” biztosítja, hogy a kérésben nincs felhasználói adatcsere, pl. sütik vagy HTTP auth adatok nem kerülnek átadásra. Csak az anonim kérések esetén működik a gyorsítótárazott fájl lapok közötti felhasználása, ami a CDN használatának legnagyobb előnyét adja.
Hogyan állítható elő egy SHA384 hash?
A SRI Hash Generator oldalon gyakorlatilag bármilyen URL-hez létrehozhatsz egy hasht, a feladatod ezzel egy CTRL+C / CTRL+V billentyűzetkombináció leütésére redukálódik. Természetesen Linux parancssorból is könnyedén előállítható a szükséges SHA384 hash, pl. az alábbi parancs használatával.
# curl -s https://code.jquery.com/jquery-3.7.1.slim.min.js | openssl dgst -sha384 -binary | openssl base64 -A
5AkRS45j4ukf+JbWAfHL8P4onPA9p0KwwP7pUdjSQA3ss9edbJUJc/XcYAiheSSz
Záró gondolat
A Subresource Integrity (SRI) alkalmazása pofonegyszerű feladat, de jelentősen növeli a weboldalad biztonsági szintjét. Ha eddig nem tetted volna, akkor mostantól mindenképp add meg a hash értékeket azoknál a tageknél, amelyek külső forrást töltenek be!
Első a biztonság!
További információ: