HTML 앵커 태그로 열린 새 페이지 닫기

문제상황 및 해결방법

웹 페이지에서 HTML 앵커 태그(<a>)를 사용하여 새 창이나 새 탭을 열고 나서, 그 새로 열린 페이지를 프로그래밍적으로 닫으려는 경우가 있다. 대표적인 오류는 Window.close() 함수를 이용할 때 발생하는 Scripts may close only windows that were opened by it 오류다. 이 글에서는 이러한 문제를 해결하는 몇 가지 방법을 살펴볼 것이다.

자바스크립트를 이용한 해결법

이 문제를 해결하는 가장 간단한 방법은 자바스크립트의 window.open()과 window.close() 메서드를 사용하는 것이다. window.open() 메서드로 열린 새 창이나 새 탭은 같은 자바스크립트에서 window.close() 메서드를 사용하여 닫을 수 있다.

// 새 창 열기
let newWindow = window.open('https://www.example.com');

// 새 창 닫기
newWindow.close();

HTML과 자바스크립트 혼용

HTML의 앵커 태그를 사용해야만 하는 경우, JavaScript를 이용하여 태그의 동작을 제어할 수 있다.

<a href="https://www.example.com" id="myLink">새 창 열기</a>

document.getElementById('myLink').onclick = function() {
  let newWindow = window.open(this.href);
  // 새 창을 닫는 로직 추가
  setTimeout(() => { newWindow.close(); }, 5000);
  return false;
};

주의사항

window.close() 함수는 오직 같은 스크립트에서 열린 창만 닫을 수 있다는 점을 명심해야 한다. 이 외의 경우에는 보안 문제로 인해 브라우저에서 이를 허용하지 않는다.

결론

HTML 앵커 태그로 열린 새 페이지를 닫는 것은 보안 문제로 인해 제한되어 있지만, 자바스크립트를 활용하여 이 문제를 우회할 수 있다. 특히 window.open()과 window.close() 메서드를 적절히 사용하면 원하는 동작을 구현할 수 있다.