스크립트 NGM의 Web API를 이용해서 탭 추가 및 탭 이동하는 방법.
페이지 정보
본문
안녕하세요. 엔지엠소프트웨어입니다. 웹 관련 매크로를 제작하는 고객분의 질문에 답해주다보니, 일반인이 이해하기 어려운 내용들이 많다는 생각이 들었습니다. 그래서, 웹 API를 이용해서 웹브라우저를 제어하는 방법에 대해 깊이있게 알아보는 시간을 가졌으면 좋겠네요^^; 이 내용을 테스트하려면 웹드라이버가 필요하고, 첨부되어 있는 스크립트를 실행해야 합니다. 크롬 웹드라이버는 아래 링크에서 다운로드 받으세요.
[ 크롬 웹드라이버 다운로드 ]
이 글을 작성하는 시점으로 87.0.4280.20이 최신 버전입니다. 제 컴퓨터에 설치된 크롬 브라우저의 버전은 86이라서 저는 86.0.4240.22를 다운로드 받았습니다. 웹드라이브를 다운로드 받았으면 바탕화면에 저장해두세요. 그리고, 아래 그림처럼 스크립트를 생성하고 웹 API의 연결을 추가하세요.
- 외부 API 클릭
- 웹 API 탭의 연결 더블 클릭 (스크립트에 추가)
- 스크립트에 추가된 연결 액션 선택
- 속성 클릭
연결 액션은 웹브라우저와 1:1로 매핑되는 논리적인 객체입니다. 그렇기에, 이 액션에는 반드시 아이디를 할당해야합니다. 이 아이디로 다른 액션들이 웹브라우저를 제어하게 됩니다. 아래 그림을 참고해서 각각 속성을 채워 넣으세요!
- 아이디에 TEST 입력
- 웹드라이브 선택에서 바탕화면(또는 다른 위치)에 다운로드 받은 크롬 웹드라이브 선택
- 웹브라우저는 크롬(Chrome) 선택
- 웹사이트 주소에 이동할 주소를 입력 (https://google.com)
웹브라우저에 탭을 추가하기 위해 자바스크립트를 사용해야 합니다.
- 외부 API 클릭
- 웹 API 탭에 자바스크립트 실행 액션 더블 클릭
- 스크립트에 추가된 자바스크립트 실행 액션 선택
- 속성 클릭
자바스크립트 실행 액션은 선택한 브라우저(연결 액션에 매핑된...)에서 자바스크립트를 실행해주는 강력한 방식을 제공합니다. 자바스크립트에 대한 이해가 있다면 추가적인 여러가지 액션을 수행할 수 있습니다.
- 제어할 웹브라우저 선택 (TEST)
- 선택한 웹브라우저에서 실행할 자바스크립트 내용 입력 (window.open())
자바스크립트로 웹브라우저에서 새로운 탭을 생성했습니다. 이제 생성된 탭을 선택해야합니다.
- 외부 API 클릭
- 웹 API 탭에 브라우저 컨트롤 액션 더블 클릭
- 스크립트에 추가된 브라우저 컨트롤 액션 선택
- 속성 클릭
브라우저 컨트롤 액션은 사용자가 선택한 웹브라우저를 제어할 수 있는 다양한 방법을 제공합니다.
- 네비게이션은 SwitchTo 선택
- 윈도우 선택 옵션은 Last 선택 (웹브라우저의 마지막 탭으로 이동)
- 웹브라우저 이름은 TEST 선택
새탭에서 네이버로 이동해볼까요? 다른 사이트로 이동하는것도 브라우저 컨트롤 액션에서 수행할 수 있습니다.
- 외부 API 클릭
- 웹 API 탭에 브라우저 컨트롤 액션 더블 클릭
- 스크립트에 추가된 브라우저 컨트롤 액션 선택
- 속성 클릭
아래 그림을 참고해서 이동할 사이트(네이버)를 설정합니다.
- 네비게이션은 GoToURL 선택
- 네비게이션 값에 이동할 사이트 주소 입력 (https://naver.com)
- 웹브라우저 이름은 TEST 선택
웹브라우저에서 탭을 첫번째로 이동하기 위해 첫번째 ①브라우저 컨트롤을 선택하고 Control+C를 눌러서 복사하세요.
복사한 브라우저 컨트롤을 마지막에 붙여넣기 하기 위해 ①브라우저 컨트롤을 선택하고, Control+V를 눌러 붙여넣기 하세요. ②마지막에 복사한 브라우저 컨트롤이 추가됩니다.
①마지막 브라우저 컨트롤을 선택하고, 속성창에서 ②윈도우 선택 옵션을 First로 변경하세요.
여기까지 작업이 완료되면, 연결에서 웹브라우저를 실행하고, 입력한 사이트(https://google.com)로 이동됩니다. 그리고, 자바스크립트로 새탭을 만들고, 브라우저 컨트롤에서 마지막 탭으로 이동합니다. 마지막 탭이 선택되면, 네이버로 이동하고 다시 첫번째 탭으로 돌아오게 됩니다. 스크립트가 마무리되면 창이 바로 종료되므로 마지막에 지연 액션을 하나 추가하고 실행 해보세요. 잘 동작이 되나요? 혹시 궁금한 사항이 있으면 댓글로 남겨주세요^^
개발자에게 후원하기
추천, 구독, 홍보 꼭~ 부탁드립니다.
여러분의 후원이 빠른 귀농을 가능하게 해줍니다~ 답답한 도시를 벗어나 귀농하고 싶은 개발자~
감사합니다~
첨부파일
-
웹API 테스트.zip (2.2K)
0회 다운로드 | DATE : 2020-11-17 13:16:59
- 이전글웹 API를 이용하여 네이버 검색어 입력하기. 20.11.19
- 다음글쉽게 스크롤바 움직이는 방법. (An easy way to move the scrollbar.) 20.11.19
댓글목록
등록된 댓글이 없습니다.