프리랜서 웹디자이너 웹퍼블리셔RELATION

RELATION 로고

홈페이지 소스

[HTML] a 태그로 sms 문자 전송하기

2022.05.25
북마크 작성자 정보
a 태그로 SMS 문자 전송하기
휴대폰에서 a 태그로 문자 보내기를 누르면 설정된 번호와 텍스트가 자동으로 전송화면으로 이동한다.
- 입력 번호가 없으면 전송할 전화번호을 입력후 입력된 텍스트와 함께 자동으로 전송화면으로 이동한다.
- 주의)  문자에 홈페이지 주소를 넣는 경우가 있는데. 특수문자중 파아미터 연결 해주는 '&' 또는 '&amp' 는 발송 에러의 원인이 된다. 


안드로이드
//안드로이드 
<a href="sms:010-1234-5678?body=문자전송">문자 전송</a>


//아이폰 
<a href="sms:010-1234-5678&body=문자전송">문자 전송</a>


문자 발송 텍스트를 미리 설정하고 전송 대상을 나중에 핸드폰에서 찾아 전송 하는 소스
https://www.relation.co.kr/images_board/board_system_publishing/287/
 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>RELATION.CO.KR?PER_NO=5&NO=286</title>
	
	<script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript" ></script>
	<script src="//developers.kakao.com/sdk/js/kakao.min.js"></script>
	<script>
		//카카오톡 공유하기 //운영하는 도메인과 맞아야함.
		 function fn_kakaoShare()
		 {
				Kakao.init('xxxxxxxxxxxxxxxxxxxxxxxxxxxx');		//카카오 API-Key
			  //var linkUrl = "https://www.relation.co.kr/html_board/board_view.php?par_no=6&code=&page=1&no=78";
			 	var linkUrl = "https://www.relation.co.kr";
				var imageUrl = "https://www.relation.co.kr/images/common/sns.png";

				Kakao.Link.sendDefault({
						objectType: 'feed',
								content: {
								title: '안녕하세요. RELATION.CO.KR입니다.~~!!',
								description: '"카카오 공유하기" "a 태그 문자보내기 " 테스트',
								imageUrl: imageUrl,
								link: {
										mobileWebUrl: linkUrl,
										webUrl: linkUrl
								}
						}
				});
		 }


		//SMS 공유하기 
		//"&, &amp" URL parameter 사용금지
		function fn_smsShare()
		{
				var sBody = "[RELATION.CO.KR~~!! ]n"
				+ "안녕하세요. n"
				+ "RELATION.CO.KR입니다.~n"
				+ "SMS 테스트 페이지 입니다.n"
				+ "사이트 : https://www.relation.co.kr"
				+ "n"
				+ "감사합니다.";
			
				sBody = sBody.replace(/(n|rn)/g,"%0a");
				location.href = "sms:?body=" + sBody;
		}
	</script>	
	
	<style>
		.wrap	{	display:flex; flex-direcion:row; flex-wrap:wrap; justify-content:center; align-items: center; width:100vw; height:100vh; }
		.btn_wrap { display:flex; flex-direction:row; justify-content:space-between;	width:310px; height:30px;}
		.btn_wrap a {	width:150px; height:40px; border:1px solid #000; text-align:center; line-height:40px; text-decoration:none; }
	</style>	
	
</head>

<body>
	<div class="wrap">
		<div class="btn_wrap">
			<a href="javascript:fn_smsShare();">SMS 공유하기</a>
			<a href="javascript:fn_kakaoShare();">카카오 공유하기</a>
		</div>	
	</div>	
</body>
</html>





 

이 포스트 공유하기

전체목록