JS & TS

[JS] Navigator 객체의 vibrate() 메서드와 hoax 계열의 광고

Razelo 2021. 2. 19. 10:55

Navigator 객체를 살펴보던 중 재밌는 메서드를 발견했다. 

vibrate() 메서드인데, 단말기를 진동시키는 메서드이다. 

웹 브라우저에서 직접 디바이스를 컨트롤할줄은 몰랐는데, 진동을 시킬 수 있다는 게 신기했다. 

 

그리고 검색해보니 이 메서드가 hoax 계열의 광고에서 자주 사용한다는 것을 알게 되었다. 

 

가끔 웹서핑을 하다가 이상한 사이트에 접속하거나 하게 되면, 갑자기 배터리가 부족? 하다거나 바이러스에 감염되었다거나 디바이스에 치명적인 손상이 있다는 둥 갑자기 번쩍거리는 이펙트와 함께 진동이 울리면서 창들이 막 뜨게 되는 경우가 있다. 

 

그런데 이 허위 광고에 속는 사람들도 꽤 많아서 아직까지 많이 쓰이고 있다고 한다. 

 

그리고 여기서 바로 진동 이펙트를 주기 위해서 vibrate() 메서드를 사용한다고 한다. 

 

<!DOCTYPE html>
<head>
<meta charset="UTF-8" >
<title> 진동 테스트 </title>
<body>
<script type="text/javascript" >
navigator.vibrate = navigator.vibrate | | navigator.webkitVibrate | | navigator.mozVibrate | | navigator.msVibrate; // 작동되는 진동 메소드가 다르므로 통합
function vibrate() {
if (navigator.vibrate) {
navigator.vibrate(20000); // 진동을 울리게 한다. 1000ms = 1s 이다.
} else {
alert("진동을 지원하지 않는 기종 입니다.");
}
}
 
function vibratearray() {
if (navigator.vibrate) {
navigator.vibrate([100,30,100,30,100,200,200,30,200,30,200,200,100,30,100,30,100]); // 배열로도 가능하다. 진동은 SOS 모스부호
} else {
alert("진동을 지원하지 않는 기종 입니다.");
}
}
function stop() {
navigator.vibrate(0); // (0) 대신에 ([]) 을 넣어도 동일하다.
}
</script>
<button type="button" onclick="vibrate()" > 진동 시작 </button> <br />
<button type="button" onclick="vibratearray()" > SOS 진동 시작 </button> <br />
<button type="button" onclick="stop()" > 진동 중지 </button>
</body>
</html>

 

코드 출처: blog.supersu.kr/computer/js/webpage-vibrate-javascript 

 

관련 블로그: blog.supersu.kr/computer/js/webpage-vibrate-javascript 

반응형