이미지에 자바스크립트 코드 삽입하기

BMP 이미지에 자바스크립트 코드를 삽입하는 과정이다.

1. 테스트로 사용할 이미지를 구한다. (sample.bmp)
2. BMP 포맷의 특징을 활용해서 자바스크립트 코드를 삽입한다.
3. HTML에서 이미지와 자바스크립트의 소스로 변경된 이미지를 가져온다.

구현된 파이썬 코드를 통해서 알아보자.

# 구글 이미지 검색에서 찾은 BMP 이미지 파일을 sample.bmp로 명명하였다.
original_file = "sample.bmp"
cracked_file = "cracked.bmp"

# 삽입될 바이너리 형태의 코드로 알림 창을 띄우는 예제를 만들었다.
script_text = 'alert("{0} is cracked.")'.format(original_file).encode('ascii')

def script_into_bmp(script_text, original_file, cracked_file):
    """
    bmp 이미지에 script 코드를 삽입하기
    :param script_text: 삽입할 자바스크립트 코드
    :param original_file: 원본 bmp 이미지 파일 이름
    :param cracked_file: 생성될 bmp 이미지 파일 이름
    :return: 성공
    """

    # 1번째 과정 : 주석 영역에 문제를 일으킬수 있는 */ 문자를 제거한다.
    with open(original_file, "r+b") as f:
        buff = f.read()
        buff.replace(b'\x2A\x2F', b'\x00\x00')  # */ 공백 치환

    # 2번째 과정 : 비트맵의 헤더 2 바이트 이후에 주석 시작 코드(/*)를 삽입한다.
    with open(cracked_file, "w+b") as f:
        f.write(buff)
        f.seek(2, 0)
        f.write(b'\x2F\x2A')  # /*

    # 3번째 과정 : 파일의 끝에 주석 끝 코드(*/)와 함께,
    # 비트맵의 헤더 BM=1;과 같이 처리하기 위해서 다음 코드(=1;)를 추가한다.
    # 테스트를 위해서 알림창을 띄우는 자바스크립트 코드를 추가한다.
    with open(cracked_file, "a+b") as f:
        f.write(b'\x2A\x2F\x3D\x31\x3B')  # */=1;
        f.write(script_text)

    return True

HTML에서 이미지를 보여주는 것과 동시에 숨겨진 자바스크립트 코드를 실행한다.
<img src=“cracked.bmp”/>
<script src=“cracked.bmp”/>

실행 화면