[Javascript] 카카오링크 사용하기 (공유하기)

[카카오링크]

https://developers.kakao.com/docs/js/getting-started

iOS / Android처럼 앱 단에서 동작하는 것이 아니라 웹에서 앱을 호출하는 경우에 사용한다.

[예제]

과정은 간단하다. 개발자사이트에서 앱을 만들고, 링크나 이미지 URL에 들어가는 도메인 주소를 웹에 등록해두면 된다.

<script src="//developers.kakao.com/sdk/js/kakao.min.js">

스크립트 부분에는 해당 js 파일을 import하고, 하나의 예제 함수를 만든다.

	function goTalk(title, url){
		// JavaScript 키
		Kakao.init('여기에 자바스크립트 키 입력');
		// 카카오링크 버튼을 생성
		Kakao.Link.createDefaultButton({
			container: '#kakao-link-btn',
			objectType: 'feed',
      			content: {
        			title: '딸기 치즈 케익',
        			imageUrl: 'http://mud-kage.kakao.co.kr/dn/Q2iNx/btqgeRgV54P/VLdBs9cvyn8BJXB3o7N8UK/kakaolink40_original.png',
				// 이미지 클릭시 링크
        			link: {
          				mobileWebUrl: 'http://g-y-e-o-m.tistory.com/',
          				webUrl: 'http://g-y-e-o-m.tistory.com//'
        			}
      			},
			// 버튼 클릭시 링크
      			buttons: [
			{
          			title: '웹으로 보기',
          			link: {
            				mobileWebUrl: 'https://developers.kakao.com',
            				webUrl: 'https://developers.kakao.com'
          			}
        		},
        		{
          			title: '앱으로 보기',
          			link: {
            				mobileWebUrl: 'https://developers.kakao.com',
            				webUrl: 'https://developers.kakao.com'
          			}
        		}
      			]
    		});
	}

이것을 바탕으로 버튼같은 것에 onClick이벤트로 걸어주면 끝이다.

꾸미기는 API레퍼런스를 참고하면 되고, 이 페이지를 모바일로 접속해서 버튼을 클릭하면 아래와 같은 결과를 얻을 수 있다.