Client-Side Template Injection

사용자 제어 데이터가 템플릿 엔진의 템플릿으로 사용되어 공격자가 템플릿 컨텍스트에 액세스하고 경우에 따라 브라우저에서 악성 코드를 삽입 및 실행할 수 있습니다.

템플릿 엔진은 동적 데이터를 사용하여 콘텐트를 렌더링하는 데 사용됩니다. 이 컨텍스트 데이터는 일반적으로 사용자에 의해 제어되고 웹 페이지, 전자 메일 등을 생성하는 템플릿을 통해 서식이 지정됩니다. 템플릿 엔진을 사용하면 조건절, 루프 등과 같은 코드 생성과 함께 컨텍스트 데이터를 처리함으로써 템플릿에 강력한 언어 식을 사용하여 동적 컨텐츠를 렌더링할 수 있습니다. 공격자가 렌더링될 템플릿을 제어할 수 있는 경우 컨텍스트 데이터를 노출하는 식을 삽입하거나 브라우저에서 악성 코드를 실행할 수도 있습니다.

예제 1: 다음 예제는 템플릿이 URL에서 검색되고 AngularJS로 정보를 렌더링하는 데 사용되는 방법을 보여줍니다.

function MyController(function($stateParams, $interpolate){
    var ctx = { foo : 'bar' };
    var interpolated = $interpolate($stateParams.expression);
    this.rendered = interpolated(ctx);
    ...
}

이 경우 $stateParams.expression은 잠재적으로 사용자 제어 데이터를 사용하고, 이를 지정된 컨텍스트에서 사용될 템플릿으로 평가합니다. 이로 인해 악의적인 사용자가 브라우저 내에서 원하는 코드를 임의로 실행하여 실행 대상 컨텍스트에 대한 정보를 검색하거나, 응용 프로그램이 생성되는 방법에 대한 추가 정보를 찾거나, 이를 완전한 XSS 공격으로 변환할 수 있습니다.