jquery 미투데이 플러그인
프로그래밍/웹 쪽2009. 12. 11. 13:52
첨부파일은 안올라가서 집에가서 올려야징
이번에는 간단히 미투데이 오픈 API를 이용하여
자신의 글 목록 및 댓글 목록을 가져오고,
글을 작성 하는 방법을 알아 보도록 하겠습니다.
※ 미투데이(http://me2day.net/)란? 트위터와 같은 국산 마이크로 블로그(150자 제한)
미투데이 인증 방식은 두 가지 방식이 있습니다.(바뀔수도 있어요)
1. 비밀키 조합을 통한 인증 방식(파라미터를 통한 인증 방식)
2. HTTP Basic Authentication(플리커에서 이 방식을 통해 인증하고 사진을 올릴 수 있습니다 - 업로드시만 적용)
이 중에서 비밀키 조합을 통한 인증 방식을 사용해서 미투데이에 게시글을 등록해 보도록 하겠습니다.
※ 미투데이 API(http://codian.springnote.com/pages/86001)
비밀키(ukey) 생성 방법
- nonce + md5(nonce + user_key)
여기서 nonce는 8자리 임시 알파벳을 지정 하면 됩니다.
이를 md5인코딩을 위와 같은 방법으로 해서 ukey를 생성합니다.
플러그인에는 고정 값으로 nonce를 생성하도록 되어있고, md5 인코딩은 http://pajhome.org.uk/crypt/md5/ 에서 하였습니다. md5인코딩을 플러그인 내에서 하고 싶으면 라이브러리를 추가하여 플러그인 내에서 md5인코딩을 수행 하시면 됩니다.
user_key는 me2API 사용자 키 입니다. 미투데이 회원 가입 하시면 자동으로 발급이 됩니다.
이를 조합하여 ukey를 생성합니다.
me2API 애플리케이션 키(akey)는 미투데이 회원 가입 후 발급 요청을 하면 발급 받을 수 있습니다.
이렇게 ukey와 akey를 생성 후 이를 파라미터로 날려주면 인증이 필요한 API 메서드를 사용 할 수 있습니다.
※ 테스트 URL : http://me2day.net/api/noop?uid=codian&ukey=XXXXXXXXXXXXXXXX&akey=XXXXXXXXXXXXXXXX
이제 미투데이에서 제공 하는 API에 대해서 알아 보겠습니다.
- create_post : 지정한 회원의 미투데이 페이지에 글을 작성합니다.
- get_latests : 지정한 회원의 최근글을 가져옵니다.
- get_posts: 지정한 회원의 글을 가져옵니다.
- create_comment : 지정한 글에 댓글을 작성합니다.
- delete_comment: 지정한 댓글을 삭제합니다.
- get_comments : 지정한 글의 댓글을 가져옵니다.
- track_comments: 회원이 최근 작성한, 회원의 미투페이지에 최근 작성된 댓글을 가져옵니다.
- get_person : 지정한 회원 정보를 가져옵니다.
- get_friends : 지정한 회원의 친구목록을 가져옵니다.
- get_settings : 개인 설정 사항을 가져옵니다.
- get_tags: 태그와 태그를 포함하는 글 수를 가져옵니다.
- noop : 사용자인증 테스트를 하거나 서버 동작상태를 검사합니다.
- get_friendship_requests : 지정한 회원에게 요청된 친구신청 내역을 가져옵니다.
- accept_friendship_request : 지정한 회원에게 요청된 친구신청을 수락 합니다.
다른 메서드들은 플러그인에 직접 추가하여 구현 할 수 있습니다.
사실 플러그인 이긴 하지만 워낙에 간단 하기 때문에, 소스 설명이 그다지 없습니다.
기본적인 user-key, ukey, akey 설정을 하는 변수가 있고,
var defaults = {
apiKey : '',
userKey : '',
authKey : '',
userID : ''
};
메서드를 표한 하는 url
var urls = {
baseUrl : 'http://me2day.net/api/',
getPosts : 'get_posts/',
getPerson : 'get_person/',
getComments : 'get_comments/',
createPost : 'create_post/'
};
여기에다가 메서드를 추가하여 확장 할 수 있습니다.
그리고 자신의 글 목록 및 댓글을 가져오는 ajax 요청과, 글을 등록하는 ajax 요청이 있습니다
function createPosts() {
$.ajax({
url : urls.baseUrl + urls.createPost + defaults.userID + '.json',
method : 'post',
data : { 'post[body]' : contents.val(), 'uid' : 'reperion', 'ukey': defaults.authKey, 'akey' : defaults.apiKey},
dataType : 'jsonp',
jsonp : 'callback',
error : function( error) {
// error has code, message, description
},
success : function( data) {
articleList.prepend( getArticleDiv( data));
contents.val( '');
},
complete : function() {
}
});
}
이런 형식으로 REST 방식으로 URL을 호출 하게되면 응답 결과를 XML, JSON으로 리턴해줍니다.
이번에도 역시 JSON이 편하기 때문에 JSON 형식으로 리턴 받아서 사용하게 했습니다.
이 JSON 을 파싱해서 사용 하면 됩니다.
※ get_posts API : http://codian.springnote.com/pages/386176
실행 결과
사용 방법은 플러그인을 사용할 DIV를 생성후 .meToday()를 호출 하면 됩니다.
<script type="text/javascript">
$(function() {
$( '#target').meToday();
});
</script>
</head>
<body>
<div id="target">
<div class="inputArea">
<textarea id="contents"></textarea>
<button id="btnAddArticle">등록</button>
</div>
<div class="articleList">
</div>
</div>
</body>
</html>
$(function() {
$( '#target').meToday();
});
</script>
</head>
<body>
<div id="target">
<div class="inputArea">
<textarea id="contents"></textarea>
<button id="btnAddArticle">등록</button>
</div>
<div class="articleList">
</div>
</div>
</body>
</html>
