🤖 웹매크로 — 화면 매크로는 웹페이지에서 반복하는 일을 클릭·입력·키·스크롤·대기 단계로 만들어 자동으로 실행하는 크롬 확장 프로그램입니다.
단계를 직접 쌓아도 되고, 「녹화」를 켜고 한 번 해 보이면 그대로 단계가 기록됩니다.
만든 매크로는 횟수를 정해 반복 실행하고, JSON으로 백업하거나 Playwright 코드로 내보내 브라우저 밖에서도 돌릴 수 있습니다.
웹매크로 — 화면 매크로
단계 편집 · 🎯 요소 선택 · 녹화 · 반복 실행 · 💾 매크로 보관함 · ⚡ 자동 업데이트 · Playwright 코드 내보내기
v0.5.0Chrome · Edge 114+약 34KB사이드 패널서버 미경유
이번 버전: 새 버전 알림·⚡ 자동 업데이트(다운로드 폴더 web-macro 덮어쓰기)·↻ 다시 불러오기
위 다운로드 버튼을 눌러 web-macro.zip을 받고 압축을 풉니다.web-macro 폴더가 생기는데, 다운로드 폴더 안에 그대로 두세요. 중요 폴더를 열었을 때 manifest.json 파일이 바로 보여야 합니다. 이 자리를 지켜야 뒤의 ⚡ 자동 업데이트가 됩니다.
2
크롬 주소창에 chrome://extensions 를 입력해 이동합니다. (엣지는 edge://extensions)
3
오른쪽 위 「개발자 모드」 스위치를 켭니다.
4
「압축해제된 확장 프로그램을 로드합니다」를 클릭하고, 1단계에서 압축을 푼 폴더를 선택합니다. (manifest.json이 든 그 폴더)
5
목록에 「웹매크로 — 화면 매크로」가 추가되면 완료입니다. 🎉 툴바 퍼즐 아이콘(🧩)에서 📌 핀을 눌러 고정하고, 아이콘을 누르면 브라우저 오른쪽에 사이드 패널이 열립니다.
사이드 패널은 크롬·엣지 114 이상(2023년 5월 이후 버전)에서 지원됩니다.
⚡ 업데이트는 거의 자동입니다. 새 버전이 나오면 확장 아이콘에 NEW 배지가 붙고 패널 맨 위에 안내가 뜹니다.
「⚡ 자동 업데이트」를 누르면 확장이 새 파일을 다운로드 폴더의 web-macro 폴더에 덮어쓰고 스스로 다시 불러옵니다(패널이 잠깐 닫히니 다시 여세요). 보관함과 단계는 그대로 남습니다.
조건은 1단계대로 다운로드 폴더의 web-macro 폴더를 로드했을 것 하나입니다. 다른 곳에 설치했다면 다시 불러온 뒤 "적용되지 않았어" 안내가 뜨는데, 그때는 「⬇ ZIP 받기」→ 설치 폴더에 덮어쓰기 → 「↻ 다시 불러오기」(패널 버튼)로 하면 됩니다.
설치된 버전은 패널 제목 옆 v숫자, 이 페이지의 최신 버전은 v0.5.0입니다.
크롬이 압축해제(개발자 모드) 확장은 스스로 갱신해 주지 않아 이렇게 만들었습니다. 웹 스토어처럼 아무 것도 누르지 않아도 갱신되게 하려면 크롬 웹 스토어 등록(미등록 공개)이 필요합니다.
🤖 사용 방법
자동화할 페이지를 연 다음 툴바의 웹매크로 아이콘을 누르면 사이드 패널이 열립니다.
패널 맨 위의 「대상 탭」이 지금 조작할 페이지입니다. 사이드 패널이 아닌 가장 최근에 쓴 일반 웹 탭이 대상이 됩니다.
➕
1. 단계 만들기
종류를 고르고 「+ 단계」를 누르면 한 줄이 생깁니다. 칸을 채우는 즉시 자동 저장되고, ↑ ↓로 순서를 바꾸거나 복제·삭제할 수 있습니다. 선택자 칸 옆 「🎯 선택」을 누르고 페이지에서 요소를 클릭하면 선택자가 자동으로 채워집니다. 종류는 아래 표의 8가지입니다.
⏺️
2. 녹화로 만들기
「● 녹화」를 켜고 대상 탭에서 평소처럼 클릭·입력·Enter를 하면 그 동작이 단계로 기록됩니다. 페이지가 넘어가도 이어서 녹화되고, 비밀번호 칸은 기록하지 않습니다. 끝나면 「■ 녹화 중지」.
▶️
3. 실행
반복 횟수와 속도(0.5·1·2배)를 정하고 「▶ 실행」. 지금 도는 단계는 파란 테두리로 표시되고 아래 로그 창에 진행과 오류가 남습니다. 언제든 「■ 정지」.
📤
4. 저장·불러오기·백업
패널 위 「💾 저장」(또는 Ctrl+S)으로 이름을 붙여 보관함에 넣고, 목록에서 고르면 불러옵니다. 저장 안 한 변경이 있으면 먼저 묻고, 상태줄에 「변경됨/저장됨」이 보입니다. 아래 「⬇ 파일로 내보내기 / ⬆ 파일 가져오기」로 보관함 전체를 JSON 파일로 PC에 백업하거나 다른 사람과 나눕니다. 「Playwright 코드」는 같은 단계를 Node.js 스크립트로 내보냅니다.
단계
넣는 값
하는 일
주소 이동
주소
대상 탭을 그 주소로 옮기고 다 읽힐 때까지 기다립니다. https://를 빼고 적어도 자동으로 붙습니다.
요소 클릭
선택자 · 버튼(왼쪽/오른쪽/더블)
선택자로 찾은 요소를 화면에 보이게 스크롤한 뒤 클릭합니다. 못 찾으면 5초까지 기다립니다.
좌표 클릭
x · y · 버튼
화면의 그 좌표에 있는 요소를 클릭합니다. 선택자를 잡기 어려운 캔버스·지도에 씁니다.
글자 입력
선택자 · 내용 · 간격(ms)
입력칸을 비우고 한 글자씩 넣습니다. 선택자를 비우면 지금 커서가 있는 칸에 넣습니다.
키 누르기
키 (Enter, Escape, Tab …)
지금 포커스된 요소에 키를 보냅니다. 입력칸에서 Enter 면 폼을 제출합니다.
스크롤
세로(px)
페이지를 그만큼 내립니다(음수면 올림).
대기
시간(ms)
그 시간만큼 멈춥니다. 속도 배율의 영향을 받습니다.
요소 대기
선택자 · 최대(ms)
그 요소가 나타날 때까지 기다립니다. 검색 결과·로딩 후 화면을 기다릴 때 씁니다.
🎯 선택자는 직접 적지 않아도 됩니다. 요소 클릭·글자 입력·요소 대기 단계의 선택자 칸 옆 「🎯 선택」을 누르면 대상 탭에서
마우스를 따라 파란 상자와 선택자가 표시되고, 요소를 클릭하면 그 선택자가 칸에 들어갑니다(사이트에는 클릭이 전달되지 않음, ESC 취소).
버튼·링크처럼 짧은 글자가 있으면 로그에 text=로그인 같은 글자 선택자 대안도 함께 알려 줍니다.
좌표 클릭 단계는 「🎯 좌표 선택」으로 누른 지점의 x·y가 들어갑니다.
직접 적을 때는 CSS 선택자(#login-btn, input[name="q"])나
text=로그인처럼 화면에 보이는 글자를 씁니다. (F12 → 요소 우클릭 → Copy selector)
✅ 예: 로그인 자동화 = 주소 이동 → 글자 입력(아이디) → 글자 입력(비밀번호) → 키 누르기 Enter → 요소 대기(로그인 후 화면).
비밀번호는 녹화되지 않으니 「글자 입력」 단계를 직접 추가합니다.
💡 알아두면 좋은 점
크롬 안의 웹페이지만 조작합니다. 바탕화면·엑셀 같은 다른 프로그램은 건드리지 못합니다. (운영체제 매크로가 아닙니다)
단계와 보관함은 브라우저 안에 저장됩니다. 서버로 보내지 않으며, 확장을 지우면 함께 사라지니 중요한 매크로는 「⬇ 파일로 내보내기」로 PC에 백업해 두세요. 가져오기는 내보낸 파일, 매크로 한 개, 「JSON 보기」로 꺼낸 단계 배열을 모두 받고 같은 이름은 덮어씁니다.
스크립트가 만든 클릭을 무시하는 사이트가 있습니다. 그런 곳은 「요소 클릭」이 먹지 않을 수 있습니다. 좌표 클릭·키 누르기로 바꿔 보거나 Playwright 코드로 내보내 돌리세요.
자동 업데이트는 파일 10개를 다운로드 폴더의 web-macro 폴더에 덮어씁니다. 크롬이 .js 파일을 위험 파일로 막는 환경(일부 회사 PC)에서는 중단되고 ZIP 수동 절차를 안내합니다. 확인은 6시간마다 version.json 한 번이라 다른 통신은 없습니다.
「🎯 선택」이 만든 선택자는 id → data-testid·name·aria-label·placeholder → 경로 순으로 고릅니다. 경로형(div:nth-of-type(3) > a)은 화면 구조가 바뀌면 깨질 수 있으니, 로그에 뜬 text= 대안이 있으면 그쪽이 더 오래갑니다.
최상위 문서만 제어합니다. iframe 안의 요소, 보안 키패드, 파일 선택 창은 조작할 수 없습니다.
chrome:// 설정 페이지·웹 스토어 같은 제한 페이지에서는 동작하지 않습니다.
「페이지와 연결하지 못했어 / 확장이 들어갈 수 없어」가 뜨면 메시지에 함께 나오는 지금 탭 주소를 보세요. ① 주소 오타·접속 불가(크롬 오류 페이지) ② 확장이 못 들어가는 페이지(chrome://·웹 스토어·새 탭·PDF 뷰어) ③ 확장을 새로고침(↻)한 뒤 열려 있던 탭 — 셋째는 v0.3.0부터 스크립트를 자동으로 다시 넣어 주고, 주소 이동에 https://가 빠진 경우도 자동 보완합니다.
자동 로그인·반복 클릭은 해당 사이트의 이용약관과 조직의 규정을 먼저 확인하고, 본인 계정·본인 업무에만 쓰세요. 짧은 간격의 대량 반복은 사이트가 차단할 수 있습니다.
소스를 고쳤다면 chrome://extensions에서 이 확장의 새로고침(↻)을 누르고 대상 페이지도 새로고침해야 반영됩니다.
화면을 그림으로 저장하려면 픽셀샷 — 영역 캡처, 글자를 뽑으려면텍스트그랩을 함께 쓰세요. 설치 방법은 모두 같습니다.
⚠️ 설치 후 크롬을 켤 때마다 「개발자 모드 확장 프로그램을 사용 중지하세요」 안내가 뜰 수 있습니다.
개발자 모드로 직접 설치한 확장에 크롬이 항상 보여주는 정상 안내이며, 「확장 프로그램 유지」를 누르면 계속 사용할 수 있습니다.