CodePark/ questions / Frontend security
START PRACTICINGPRACTICE
Frontend question · Browser & web performance › Frontend security

What does the integrity attribute do here?

<script src="https://cdn.example.com/lib.min.js"
  integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC"
  crossorigin="anonymous"></script>
It makes the browser refuse to run the file if its hash doesn't match

Subresource Integrity (SRI) makes the browser hash the downloaded file and compare it with the integrity value. If they don't match, the browser blocks the file. This protects you if the CDN is hacked or the file is changed. Cross-origin files also need the crossorigin attribute, so the browser can check them.

"It encrypts the script during download" is the tempting wrong answer. HTTPS does the encryption. SRI only checks that the content is the file you expected. "It makes the CDN verify the user" is wrong, because the check happens in the browser, not on the CDN. "It caches the script permanently" is wrong, because the hash has no effect on caching.