맨날 눈팅만 하다가 처음 글써봄.

요즘 base64가 민심안좋대서 재미나이랑 간단하게 하나 만들어봐서 공유함.

★ 3분만 투자하면 개딸깍 디코더 완성

★ 작성자는 프로그래머가 아니고 재미나이한테 물어봐서 대충만든거라 문제발생 시 해결법을 알려주기가 매우 어려운 점 양해 바람.

1. 템퍼몽키(Tampermonkey)설치

구글 확장프로그램인 템퍼몽키를 사용할거라 설치먼저ㄱㄱ

https://chromewebstore.google.com/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo?hl=ko

Tampermonkey - Chrome 웹 스토어

Change the web at will with userscripts

2. 코드 입력하기

설치를 완료했다면 우측 상단 퍼즐조각모양 클릭하면 템퍼몽키가 있을텐데, 클릭해서 켜줌.

1

이후 나오는 창에서 “새 스크립트 만들기”를 클릭

1

클릭하면 이런 머리아픈창이 나올거임

1

다 필요없고 아래 내용 그대로 복사해서 원래거 싹 지운뒤 박아넣고 ctrl + s

지금 코드 써둔게 여기 글쓰면서 멋대로 줄이 바껴서, 파일로 올려두겠음.

아래 스픾끼 사진 저장해서 반디집으로 연결해서 있는 파일로ㄱㄱ

사진으로 하려니 여기선 형식이 바뀌네…

키오스크 링크 걸어둠. ㄱㄹ 1달

aHR0cHM6Ly9raW8uYWMvYy9kZlF1S3RTOHBHTnQ5MVZsOUlONThi

// UserScript

// @name Base64 Quick Decoder

// @namespace http://tampermonkey.net/

// @version 1.1

// @description 드래그한 Base64 텍스트를 즉시 복호화하여 툴팁으로 보여줍니다.

// @author You

// @match :///*

// @grant none

// /UserScript

(function() {

'use strict';

// 툴팁 엘리먼트 생성

const tooltip = document.createElement('div');

Object.assign(tooltip.style, {

position: 'fixed',

display: 'none',

zIndex: '2147483647', // 최상단에 뜨도록 zIndex 최대치 설정

backgroundColor: '#1e1e2e',

color: '#cdd6f4',

padding: '8px 12px',

borderRadius: '6px',

boxShadow: '0 4px 12px rgba(0,0,0,0.4)',

fontSize: '13px',

fontFamily: 'sans-serif',

maxWidth: '400px',

wordBreak: 'break-all',

border: '1px solid #45475a',

pointerEvents: 'auto'

});

document.body.appendChild(tooltip);

// UTF-8 지원 Base64 복호화 함수

function decodeBase64(str) {

try {

// 공백/줄바꿈 제거 및 URL-Safe Base64 대응(- _ 변환)

let cleanStr = str.replace(/\s+/g, '').replace(/-/g, '+').replace(/_/g, '/');

// 패딩(=) 부족 시 자동 채움

while (cleanStr.length % 4 !== 0) {

cleanStr += '=';

}

const text = atob(cleanStr);

const length = text.length;

const bytes = new Uint8Array(length);

for (let i = 0; i < length; i++) {

bytes[i] = text.charCodeAt(i);

}

const decoder = new TextDecoder('utf-8');

const result = decoder.decode(bytes);

// 읽을 수 없는 깨진 문자(제어문자 등)가 너무 많으면 실패로 처리

if (/[\x00-\x08\x0B\x0C\x0E-\x1F]/.test(result)) return null;

return result;

} catch (e) {

return null;

}

}

// 마우스 뗐을 때 이벤트 handling

document.addEventListener('mouseup', (e) => {

if (tooltip.contains(e.target)) return;

// 약간의 지연을 두어 selection 객체가 정확히 반영되도록 함

setTimeout(() => {

const selectedText = window.getSelection().toString().trim();

// 최소 4자 이상인 경우 시도

if (selectedText.length >= 4) {

const decoded = decodeBase64(selectedText);

if (decoded && decoded.trim() !== '' && decoded !== selectedText) {

tooltip.innerHTML = <b style="color: #89b4fa;">🔓 Base64 복호화:</b><br>${escapeHtml(decoded)};

// 화면 밖으로 나가지 않게 위치 조절

let posX = e.clientX + 10;

let posY = e.clientY + 15;

if (posX + 300 > window.innerWidth) posX = window.innerWidth - 320;

if (posY + 100 > window.innerHeight) posY = e.clientY - 60;

tooltip.style.left = ${Math.max(10, posX)}px;

tooltip.style.top = ${Math.max(10, posY)}px;

tooltip.style.display = 'block';

return;

}

}

tooltip.style.display = 'none';

}, 10);

});

document.addEventListener('mousedown', (e) => {

if (!tooltip.contains(e.target)) {

tooltip.style.display = 'none';

}

});

function escapeHtml(text) {

const div = document.createElement('div');

div.innerText = text;

return div.innerHTML;

}

})();

3. 저장 후 할일

저장하고 몇가지 확인해둘것들임. 한번씩 체크하자.

저장하고 “설치된 유저 스크립트”로 가면 방금 만든 base64 Quick Decoder라는게 만들어져있을거임.

활성화 되있는지 체크.

1

다음은 방금 쓴 코드가 제대로 크롬에서 작동하게 해주도록 해주는거인데, 나도 이거 체크 안해서 안돌아갔었음.

먼저, 아래 사진처럼 “확장 프로그램 관리”를 찾아서 클릭함.

1

그러고 나오는 창에서 색칠한거 켜주면 모든 준비는 끝남.

1

다시 말하는데, 이거 안키면 안돌아감. 꺼진경우 자주있음.

4. 사용하기

사용법도 별거없음. 암호화된 코드 드래그하면 옆에 띡하고 복호화된거 나옴.

1

(사진은 아무글이나 대충 퍼온거라 좀 가림)

여기까지고, 필자는 프로그래머가 아니며, 재미나이한테 물어보고 만든지라

질문해도 어지간한건 답하기 어려울 수 있단점 다시한번 이해해주길 바람.

글 자체 문제 시 댓글달아주샘 빠른 시일내에 삭제하겠음.

ts) 가끔 드래그한거 암호화된거 아니어도 복호화할려고 들 수도 있음. 근데 자주그러진 않더라

끝으로, 업로드하여 주시는 귀인 여러분들께 왕감사인사 올림.