페이지 게재 중 광고 차단과 관련된 동작의 존재를 감지하는 자바스크립트입니다.
JavaScript(adblockDetector.js)는 다음 웹 브라우저에서 광고 차단과 관련된 동작을 감지하도록 테스트되었습니다.
스크립트는 브라우저 기반 광고 차단 도구에 의해 숨겨질 가능성이 있는 DIV 세트를 생성하여 이를 수행합니다.
이 스크립트에 아직 포함되지 않은 추가 전술은 다음과 같습니다.
원하는 탐지 스크립트를 다운로드하여 웹사이트에 추가하세요. JavaScript를 HTML에 포함시키는 몇 가지 방법이 있습니다.
스크립트 이름 | 설명 |
---|---|
adblockDetector.js | Google Analytics 모듈이 없는 광고 차단기 탐지 스크립트 |
adblockDetectorWithGA.js | Google Analytics 모듈을 사용한 광고 차단기 탐지 스크립트 |
AdBlockDetectionWithGA.js를 사용하면 82행의 스크립트에 GA 추적 ID를 언급하라는 메시지가 표시됩니다. 이 스크립트를 참조하면 사용자 브라우저에서 AdBlock과 관련된 특정 이벤트를 추적합니다. Google Analytics 대시보드에서 세부정보를 확인할 수 있습니다. 사용자가 광고 차단을 사용하고 있는지 확인하는 방법은 다음과 같습니다.
첫째, 페이지 조회수를 방해하지 않도록 다른 GA 추적 ID를 만드는 것이 좋습니다. Adblock 사용 시 GA에 대한 아래 단계를 따르세요.
불행하게도 우리는 그것을 대시보드에 넣는 방법을 아직 알아내지 못했습니다. 따라서 다음에 GA로 이동할 때 사용자 탐색기로 이동하여 새 세그먼트 추가를 클릭하면 됩니다. 그리고 이전에 생성한 세그먼트(예: 광고 차단 감지 사용자용 세그먼트와 광고 차단 NotDetected 사용자용 세그먼트)를 찾을 수 있습니다. 이를 선택하고 적용을 클릭하면 보고된 데이터를 볼 수 있습니다.
아래 이미지와 같아야 합니다.
이는 권장되는 포함 방법입니다. 선택한 탐지 스크립트에 포함된 기능은 상위 프레임의 HTML에 직접 포함되어야 합니다.
제공된 HTML의 스크립트 태그에 선택한 코드의 콘텐츠를 래핑하면 됩니다.
선택한 코드를 웹 서버에 독립된 파일로 호스팅하고 제공된 HTML에서 이 파일을 참조할 수 있습니다.
외부 스크립트 파일을 사용하는 경우 광고 차단기에 의해 차단될 수 있습니다. 파일에 다른 이름을 사용하면 일반 필터에 의해 차단될 가능성이 줄어듭니다.
선택한 코드의 기능을 외부 스크립트 파일로 호스팅되는 기존 스크립트 라이브러리에 통합할 수 있습니다. 이렇게 하면 광고 차단기가 전체 외부 스크립트 파일을 차단하는 경우 감지를 피하려는 광고 차단기를 사용하는 방문자의 사이트 기능이 저하될 수 있습니다.
@prop 플래그
옵션 | 유형 | 설명 |
---|---|---|
디버그 | 부울 | 추가 디버그 출력을 콘솔에 인쇄해야 함을 나타냅니다. |
설립하다 | 문자열(@함수) | 광고 차단이 감지되면 실행되는 기능 |
찾을 수 없음 | 문자열(@함수) | 광고 차단이 감지되지 않으면 실행되는 기능입니다. 이는 광고 차단이 감지되지 않을 때마다 실행되며 "완료"가 감지된 후에만 수행되는 작업에 대한 입력을 제공해야 합니다. |
완벽한 | 문자열(@함수) | 테스트가 완료되면 실행되는 함수입니다. |
테스트 결과(부울)는 콜백 예시에 대한 매개변수로 포함됩니다.
window . adblockDetector . init (
{
found : function ( ) { ... } ,
notFound : function ( ) { ... }
}
) ;
HTML 페이지에 아래 코드를 추가하세요.
< script src = "./adblockDetector.js" > < / script >
< script >
// Configure the adblock detector
( function ( ) {
var enabledEl = document . getElementById ( 'adb-enabled' ) ;
var disabledEl = document . getElementById ( 'adb-not-enabled' ) ;
function adBlockDetected ( ) {
enabledEl . style . display = 'block' ;
disabledEl . style . display = 'none' ;
}
function adBlockNotDetected ( ) {
disabledEl . style . display = 'block' ;
enabledEl . style . display = 'none' ;
}
if ( typeof window . adblockDetector === 'undefined' ) {
adBlockDetected ( ) ;
} else {
window . adblockDetector . init (
{
debug : true ,
found : function ( ) {
adBlockDetected ( ) ;
} ,
notFound : function ( ) {
adBlockNotDetected ( ) ;
}
}
) ;
}
} ( ) ) ;
< / script >
HTML 페이지 본문에 아래 코드를 추가하세요.
< div class =" center " >
< h5 class =" bg-success " id =" adb-not-enabled " style =" display: none; " > AdBlock is disabled </ h5 >
< h5 class =" bg-danger " id =" adb-enabled " style =" display: none; " > AdBlock is enabled </ h5 >
</ div >
포크해! 기능 브랜치 생성: git checkout -b my-new-feature 변경 사항 커밋: git commit -am 'Add some feature' 브랜치로 푸시: git push Origin my-new-feature 풀 요청 제출