[javascript] 모바일SMS 문자 보내기

 

[javascript] 모바일SMS 문자 보내기

 

해당 기능은 문자를 보내는 방법이라기보다는 사용자가 내가 지정한 번호와 문구로 문자를 보낼 수 있도록 
문자 화면으로 이동시켜주는 기능에 가깝습니다.

단순하게 공유하기 기능으로 작업하면 되겠다고 생각하고 작업을 했었는데,
세상의 모든 핸드폰은 안드로이드와 아이폰으로 나뉘어있다는 사실을 잠시 망각했었죠. (...)
내 폰(안드로이드)에서는 잘만 되는데 아이폰에서는 왜 그렇게 안 되던지.

보내는 기능에 앞서, 접속해오는 유저가 아이폰 유저인지 안드로이드 유저인지 확인부터 하는 작업을 거쳐야 합니다.

 

function checkMobile(){
	var varUA = navigator.userAgent.toLowerCase(); //userAgent 값 얻기
	if ( varUA.indexOf('android') > -1) {
		//안드로이드
		return "android";
	} else if ( varUA.indexOf("iphone") > -1||varUA.indexOf("ipad") > -1||varUA.indexOf("ipod") > -1 ) {
		//IOS
		return "ios";
	} else {
		//아이폰, 안드로이드 외
		return "other";
	}
}

 

해당 스크립트로 유저를 구분 짓는 것까지 완료되었다면 문자 보내는 기능부터 만들어야겠죠.
html 안에 class명이 btn이란 버튼이 있다 가정하고 아래 스크립트를 추가해줍니다.

 

const btn = document.querySelector('.btn');
btn.addEventListener('click', function() {
	checkM(checkMobile());
});

function checkM(m){
	location.href = 'sms:' +'전화번호'+(m == 'ios' ? '&' : '?') + 'body='+ encodeURIComponent("보낼 내용");
}

 

해당 스크립트를 적어주면 안드로이드에서도 아이폰에서도 사용되는 기능이 적용됩니다.

안드로이드와 아이폰이 location.href에서 각각 어떻게 다른지는 아래 내용에서 참고 부탁드립니다.

 

// 안드로이드
location.href = sms:받을번호?body=보낼메세지;

// 아이폰
location.href = sms:받을번호&body=보낼메세지;

 

* 참고 사이트 : https://justbobby.tistory.com/20 , https://justbobby.tistory.com/21