'Drag'에 해당되는 글 1건

  1. 2013.02.07 [Javascript] Drag, Select & Copy 방지와 해법

[Javascript] Drag, Select & Copy 방지와 해법

웹은 모든 사람들과의 정보 공유를 위해 존재합니다.

그런데 언제부터인가 불펌이 횡행하면서 

자신들의 컨텐츠에 복사 방지 코드를 삽입하는 사람들이 늘어나고 있습니다.


물론 남의 컨텐츠를 함부로 도용하는 것은 문제가 있지만,

이런 방지장치가 정말 짜증이 나는 경우가 있습니다.

그것은 바로 소스코드를 복사해야 할 때입니다.


시스템 설정이나 스크립트 코드, 프로그램 소스코드 등

직접 보고 치기에는 실수할 확률도 높고 그 양이 많은 경우에

복사해서 바로 실행하거나 컴파일하면 더 편한 것은 두말하면 입이 아픕니다.

그게 아니라면, 별도의 완성된 파일을 다운로드 받도록 제공하는 것도 한 방법이죠.

그러나 대부분 그렇지 않습니다.


일반적으로 소스코드 복사 방지는 다음과 같은 자바스크립트로 동작합니다.

// contextmenu(마우스 우측키)를 방지합니다.
document.oncontextmenu = function { return false; }
// 선택을 방지합니다.
document.onselectstart = function { return false; }
// 드래그를 방지합니다.
document.ondragstart = function { return false; }

그렇다면 이를 무력화 시키려면 정확히 반대로 해주면 됩니다.

document.oncontextmenu = null;
document.onselectstart = null;
document.ondragstart = null;

요즘 브라우저에는 대부분 디버그툴(or 개발자도구)이 있고,

그 안에는 자바스크립트 콘솔 역시 포함되어 있습니다.

자바스크립트 콘솔을 열어 위의 세 줄을 차례로 실행시키면 

대부분의 경우 선택 및 복사가 가능해 집니다.