회사 홈페이지가 외부 CDN에서 불러오는 스크립트가 몰래 바뀌면 어떻게 막을 수 있을까요?

하위 리소스 무결성(SRI)은 브라우저가 CDN 같은 외부에서 받은 스크립트와 스타일시트가 예상한 내용 그대로인지 해시로 확인하게 하는 보안 기능입니다. 해시가 맞지 않으면 브라우저는 그 파일을 불러오지 않습니다. 회사 홈페이지에서 적용 대상을 고르고 점검하는 순서를 정리했습니다.

탱탱소프트2026.11.10

하위 리소스 무결성(Subresource Integrity, SRI)은 브라우저가 CDN 같은 외부에서 받은 스크립트와 스타일시트가 예상한 내용 그대로인지 해시로 확인하게 하는 보안 기능입니다. 회사 홈페이지는 화면 효과 라이브러리, 글꼴 스타일시트, 상담 채팅 창, 방문 분석 도구처럼 다른 회사 서버에 있는 파일을 불러와 쓰기도 합니다. 그 파일이 우리 모르게 바뀌면 우리 홈페이지에서도 바뀐 코드가 실행될 수 있습니다.

외부 파일을 쓰는 만큼 생기는 위험

MDN의 Subresource Integrity 문서는 웹사이트가 모든 자원을 직접 올려 두지 않고 CDN 같은 제3자에 일부 자원을 맡기기도 한다고 설명합니다. 이때 공격자가 그 제3자 서버를 장악하면 파일에 악성 내용을 넣거나 파일을 통째로 바꿀 수 있고, 이를 공급망 공격이라고 부릅니다. SRI는 웹 애플리케이션이 받아 오는 파일이 기대한 내용과 정확히 같은지 확인해 이런 공격을 막는 장치라고 소개합니다.

W3C의 Subresource Integrity 문서(2026년 3월 20일 작업 초안)는 목표를 이렇게 적습니다.

제3자 서비스가 침해되었다고 해서 그 스크립트를 넣은 모든 사이트가 자동으로 침해되어서는 안 됩니다.
작성자는 불러오는 콘텐츠에 대한 기대를 지정해, 특정 주소에 우연히 올라와 있는 아무 스크립트가 아니라 특정 스크립트를 불러올 수 있어야 합니다.

같은 문서의 사용 예에는 CDN에서 받는 스타일시트와 제3자 분석 서비스 스크립트에 무결성 정보를 붙이는 경우가 나옵니다. 이 문서는 작업 초안이므로 확정된 표준이 아니라 진행 중인 문서로 읽어야 합니다.

푸른빛 점과 선이 그물처럼 이어진 천장 아래 넓고 밝은 사무실에서 한 사람이 빈 화면의 모니터가 놓인 흰 책상에 앉아 있다

AI로 생성한 개념 이미지. 실제 회사 사진이 아닙니다.

integrity 속성은 이렇게 동작합니다

MDN 문서의 설명을 정리하면 다음과 같습니다.

적용 대상: script 요소와, rel 값이 stylesheet·preload·modulepreload인 link 요소에 쓸 수 있습니다.
값의 형식: integrity 속성에 해시 알고리즘 이름(sha256, sha384, sha512)과 붙임표, base64로 바꾼 해시값을 넣습니다. 여러 값을 공백으로 나눠 적을 수 있습니다.
브라우저의 처리: 스크립트를 실행하거나 스타일시트를 적용하기 전에 받은 파일의 해시를 계산해 적힌 값과 비교합니다. 여러 알고리즘이 섞여 있으면 가장 강한 알고리즘의 값만 쓰고, 그중 하나라도 맞으면 불러오며, 맞지 않으면 불러오지 않고 네트워크 오류로 처리합니다.
다른 출처의 파일: SRI를 쓰는 다른 출처 요청은 CORS를 따라야 합니다. 파일을 내주는 서버가 Access-Control-Allow-Origin 응답 헤더로 허용해야 하고, 페이지 쪽에는 crossorigin="anonymous" 같은 crossorigin 속성을 함께 적어야 합니다. crossorigin 속성 없이 integrity만 적은 다른 출처 요청은 항상 실패한다고 설명합니다.

MDN은 또 Integrity-Policy와 Integrity-Policy-Report-Only 응답 헤더를 소개합니다. 앞의 것은 integrity 속성이 없는 스크립트·스타일시트 요청을 막고, 뒤의 것은 막지 않고 위반만 보고하므로 처음 도입할 때 보고 전용부터 쓰는 흐름을 설명합니다.

푸른빛 점과 선이 그물처럼 이어진 천장 아래 사람이 없는 긴 흰 회의 탁자에 노트북 여러 대가 놓여 있다

AI로 생성한 개념 이미지. 실제 회사 사진이 아닙니다.

회사 홈페이지에서 점검하는 순서

탱탱소프트의 운영 권장은 외부 파일 목록부터 만드는 것입니다.

브라우저 개발자 도구의 네트워크 탭에서 홈페이지가 다른 도메인에서 받아 오는 스크립트와 스타일시트를 모두 적습니다.
각 파일 주소에 버전이 고정되어 있는지, 늘 최신판을 내려 주는 주소인지 구분합니다. 해시는 파일 내용에 묶이므로 내용이 자주 바뀌는 주소에 integrity를 붙이면 바뀔 때마다 브라우저가 파일을 불러오지 않게 됩니다. 이런 파일은 제공 업체가 버전 고정 주소를 주는지 먼저 확인합니다.
버전이 고정된 파일에는 integrity 값과 crossorigin 속성이 함께 들어 있는지 확인합니다.
라이브러리 버전을 올릴 때는 주소와 integrity 값을 같은 배포에서 함께 바꾸는 순서를 정해 둡니다.
적용 뒤에는 주요 페이지를 열어 개발자 도구 콘솔에 무결성 관련 오류가 없는지, 상담 창·지도·분석 도구가 그대로 동작하는지 확인합니다.
빠진 파일을 찾고 싶다면 Integrity-Policy-Report-Only 같은 보고 전용 방식이 우리 사이트와 방문자 브라우저에서 쓸 수 있는지 제작사와 검토합니다.

이 글은 청주·충북 지역 기업을 포함한 일반적인 회사 홈페이지 점검 방법을 MDN·W3C 문서에 따라 정리한 것이며 특정 홈페이지를 진단한 결과가 아닙니다.