JSFuck

JavaScript + BrainFuck = JSFuck

난해한 프로그래밍 언어가 아닌, 난해한 프로그래밍 스타일. JavaScript 코드를 JavaScript 문법에서 사용되는 문자 중 단 6가지인 [ ] ( ) ! +만으로 구현할 수 있음에 착안하여 고안된 프로그래밍 스타일이다.

위 6가지 문자 중 단독으로 써서 멀쩡한 건 [] (어레이 리터럴) 뿐인데, 여기에서 모든 것을 시작하게 된다. 예를 들어 알파벳 문자열 "a" 는 다음의 과정에 의해 얻어오게 된다.

이런 식으로 알파벳/숫자를 얻어오고, 각종 내장 오브젝트 등을 이용하여 함수 객체 등에 접근하여 함수를 만들고 또 호출하는 코드를 작성, 최종적으로 자바스크립트 프로그램을 작성하는 것이 가능하다. 실제로 위 홈페이지에 자바스크립트 코드를 입력하면 코드를 위의 6글자로 표현할 수 있도록 치환해서 JSFuck 코드를 작성한다. 간혹 위의 방법만으로는 표현할 수 없는 문자가 등장했을 경우 문자 코드를 이용하는 방법으로 어떻게든 회피하는 것을 볼 수 있다.

다음은 JSFuck 스타일로 작성된 alert(1) 호출 프로그램이다. 아래 텍스트를 복사하여 웹 브라우저의 개발자 도구 콘솔[1] 등에 붙여넣기를 하면 alert 창으로 1이 출력되는 것을 볼 수 있다. 코드 맨 뒤의 ()를 생략하고 개발자 도구 콘솔에 아래 코드를 입력하게 되면 함수가 만들어진 것을 확인할 수 있다.

[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[
]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]][([][(![]+[])[+[]]+([![]]+[][[]
])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+
(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+
!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![
]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]
+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[
+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!!
[]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![
]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[
]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]]((![]+[])[+!+[]]+(![
]+[])[!+[]+!+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]+(!![]+[])[+[]]+(!
[]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])
[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[!+[]+!+[]+[+[]]]+[+!+[]]+(
!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[
])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[!+[]+!+[]+[+[]]])()

무려 1,227글자에 달하는 거대한 코드...인 것 같지만, 사실 잘 뜯어보면 []["filter"]["constructor"]("alert(1)")()로 줄어드는 것을 알 수 있고, 이는 [].filter.constructor("alert(1)")() = Function("alert(1)")()으로 해석되어 최종적으로는 alert(1)이 실행된다. 1227글자 중에 무려 1186글자를 문자열 만드는 데 썼다 ECMA2015(ES6)부터는 filter 대신 fill을 써도 된다.


또 다른 예제

간단한 예제를 통해 살펴보자.

++[[]][+[]]+[+[]]는 의도적으로 사람 햇갈리게 만들려고 작성된 코드이긴 하나, 분석하자면 다음과 같다. 주석으로 관련 링크를 달아놓았으니 정말 그 내부까지 궁금한 사람들은 따라가보길 바란다.

그냥 저런거 필요 없이 "10"을 만들 땐 +!![]+(+[]+[])만 하면 된다. +!![]가 Number 형의 1이고 괄호 안의 +[]+[]는 String 형의 "0"이 되고 문자열과 숫자의 결합은 문자열이 되므로 1+"0"은 결과적으로 String형의 "10"이 된다. [+!![]]+[+[]]도 가능하다. []+[] = ""을 생각해 보아라. 접근방법이 무궁무진(?)하다

IE에서는 문자열 추출 파트에서 어긋나기 때문에 오류가 발생한다.부분적으로 실행해보면 'constructor', 'alert(1)'이 되어야 할 것이 'ninstruntir', 'alertr1('와 같이 나타난다. 이는 위의 JSFuck 변환기에서 c, o 등의 문자열을 []['filter']+[] = [].filter.toString()에서 추출하기 때문인데[10], 이 결과가 파이어폭스 등 타 브라우저에서는

"function filter() {
    [native code]
}"

인 데 반해, IE에서는

"
function filter() {
    [native code]
}
"

로 출력되기 때문이다. 잘 보면 앞뒤에 개행 문자가 붙어 있어 글자가 하나씩 밀리는 것을 볼 수 있다. 엣지에서는 이런 문제가 나타나지 않는다.

이론적으로는 []['filter']+[]가 등장하는 부분을 ([]['filter']+[])['trim']() = [].filter.toString().trim()으로 고쳐서 파이어폭스와 인터넷 익스플로러 모두 지원하는 코드를 만들 수는 있으나, JSFuck에서 'm'을 만들려면 Number.toString()을 거쳐야 하고, 이때 위의 문제가 또 발생하므로 이는 (0)["constructor"].toString() 같은 방식으로 해결해야 한다.

[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[
]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]][([][(![]+[])[+[]]+([![]]+[][[]
])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+
(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[
]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]
+(!![]+[])[+!+[]]])[[+!+[]]+[+!+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+
[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]
+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+
!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]
+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![
]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[[+!+[]]+[+!+[]]]+(!![]+[])[+!+[]]]((
![]+[])[+!+[]]+(![]+[])[!+[]+!+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]
+(!![]+[])[+[]]+(![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+
[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[[!+[]+!+
[]]+[+!+[]]]+[+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+
[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[[!
+[]+!+[]]+[+!+[]]])()

1,253자로 더 늘어난 것은 문제가 발생한, 문자열을 추출하는 숫자에 해당하는 부분을 고쳤기 때문이다.

XSS 공격 벡터로 활용될 수 있다. 입력값이 필터링 되는 경우, 특히 알파벳 자체가 필터링 되는 경우에는 특수 문자만을 이용해서 XSS 코드를 삽입해야 하는데, 앞에서도 설명했듯이 자바스크립트는 오직 특수 문자만을 이용해서 코드를 실행시키는 것이 가능하기에 이를 활용하여 공격할 수 있다.

하지만 JSFuck 자체를 이용해 공격하기에는 다소 무리가 있는데 코드가 너무 길어지기 때문이다. 그래서 활용 가능한 특수 문자들[11]을 이용해 직접 코드를 만들어 공격하는 게 일반적이다. JSFuck 자체를 이용한다기보다는 이러한 자바스크립트 성질들을 이용한다고 보면 된다.

워게임이나 CTF에서 간혹 이러한 방식을 이용한 XSS 공격 문제가 출제되고는 한다.

아래의 표에서 볼 수 있듯이 자바스크립트 내부적으로 바로 만들 수 없는 특수문자[12], 특히 한글에 대해서 취약하다.

JSFuck이 6가지 문자로만 표현되는 것에 착안해 코드 한 글자당 $\mathrm{lo}{\mathrm{g}}_{2}6$비트의 공간을 차지한다고 치고 (UTF-8 기준으로) 원문과 JSFuck 치환 결과의 크기를 비교하면 다음과 같다. 위 홈페이지에서 원하는 문장을 치고 Eval Source(코드로 취급) 체크를 해제하면 실제로 몇 글자로 치환되는지 확인할 수 있다.

또한 재미있는 사실로 63을 표현하는 데는 48자[13]가 필요하고, 48을 표현하는 데에는 63자[14]가 필요하다.

이름이 왠지 자바스크립트에게 좆까(...)를 시전하기 위한 듯 하다.