이번에는 jQuery를 이용 한 bit.ly API 코딩 실전으로 들어가겠습니다.

기본적으로 jQuery(JavaScript)를 이용한 외부 서버 접속은 보안상의 이슈로 처리 되지 않습니다만, JSON의 경우는 JavaScript로도 보안상의 문제 없이 외부 서버의 JSON을 처리 할 수 있습니다. bit.ly의 API는 JSON을 지원하기때문에 우리는 jQuery AJAX의 JSON을 이용하여 동적으로 Shorten URL을 서비스 할 수 있습니다.

jQuery로 Shorten메소드 호출

앞서 3장에서 다룬 내용대로 “http://www.blueiblog.com/ko/archives/1976″을 줄일때 우리는 “http://api.bit.ly/shorten?version=2.0.1&longUrl=http://www.blueiblog.com/ko/archives/1976&login=xxxx&apiKey=xxxxxxxxxxxx”와 같이 Shorten URL을 요청했습니다.

그럼 3장과 같은 내용의 함수를 jQuery로 바꾸어보도록 하겠습니다.

/**
 * License by Blueⓘ
 *
 * @param String longURL 짧게 변경할 긴 문자열의 URL
 * @return String 짧게 변환된 URL
 */
function getShortURL(longURL) {
	var ret;
	$.getJSON(
		"http://api.bit.ly/shorten?version=2.0.1&longUrl="+longURL+"&login=xxxx&apiKey=xxxxxxxxxxxx",
		function(data) {
			ret = data.results[url].shortUrl;
		}
	);
	return ret;
} 
 
$(function() {
	alert(getShortURL("http://test.com"));
});
// OUTPUT : http://bit.ly/9ICmwA

이렇게 바뀔 수 있겠네요.. 위 코드는 테스트 없이 그냥 즉석에서 소스를 jQuery용으로 변경 한 것입니다. 테스트 없이 코드를 올려서 죄송합니다 ㅠ.ㅠ 혹 문제가 없을거라고 믿으나 있다면 댓글로 노티 부탁드리겠습니다.