naverblog-api v1.0.1-beta2
naverblog-api
네이버 블로그 정보를 가져오기 위한 모듈입니다.
custom-naverblog 프로젝트를 위해 만들어졌습니다.
NOTE:
CORS
문제로 인해 웹 사이트 내의 자바스크립트 코드에서는 사용이 불가능합니다. 이 문제를 회피하기 위해선 사용할 API 서버를 준비한 후, 서버에서 이 모듈을 사용하도록 한 뒤, 알맞은 API를 준비하고CORS
헤더를 추가하여 문제를 해결 하고 나서, 원래 이 모듈을 사용하려 했던 웹 사이트의 코드를 해당 API 서버를 통해 요청하도록 변경해야 합니다.
위 NOTE 에서 말한 API 서버와 웹 사이트의 예시는 각각 custom-naverblog-server 와 custom-naverblog-front 를 참고해 주시기 바랍니다
Install
yarn:
yarn add naverblog-api
Example
apply
를 사용하지 않을 경우의 예시
import {
getBlogInfo,
getCategoryList,
getPost,
} from 'naverblog-api';
getBlogInfo('okms00909')
.then((blogInfo) => {
console.log(blogInfo);
});
getCategoryList('okms00909')
.then((categoryList) => {
console.log(categoryList);
});
getPost('okms00909', 221338769113)
.then((postData) => {
console.log(postData);
});
apply
를 사용할 경우의 예시
import { apply } from 'naverblog-api';
apply('okms00909')
.then((blog) => {
console.log(blog.blogInfo);
console.log(blog.categoryList);
blog.getPost(221338769113)
.then((postData) => {
console.log(postData);
});
});
NOTE: 위 예시의
okms00909
는 블로그 아이디 (블로그 주인의 네이버 아이디, 이하 blogId) 이며,221338769113
는 블로그 글의 번호입니다(이하 postId). 따라서getPost('okms00909', 221338769113)
은 https://blog.naver.com/okms00909/221338769113 의 글을 가져오는 함수를 의미합니다.
API
API의 종류는 다음과 같습니다. (apply
하지 않았을 경우 기준)
getBlogInfo
getCategoryList
getPostList
getPost
getComments
getResourceFilePath
(Resource 용)
apply
할 경우 해당 블로그에 대한 getBlogInfo
와 getCategoryList
의 결과는
위 apply 를 사용할 경우의 예시와 같이 Promise 로 전달받은 인자의 blogInfo
와
categoryList
프로퍼티로 들어가게 되며, 나머지 getPostList
, getPost
, getComments
함수는 첫번째 blogId 인자가 자동으로 바인딩 됩니다.
getBlogInfo
(blogInfo
)
블로그 정보를 가져오는 함수입니다.
apply
하지 않았을 경우:
import { getBlogInfo } from 'naverblog-api';
getBlogInfo('okms00909')
.then((blogInfo) => {
console.log(blogInfo);
});
apply
했을 경우:
import { apply } from 'naverblog-api';
apply('okms00909')
.then((blog) => {
console.log(blog.blogInfo);
});
결과:
{
"blogId": "okms00909",
"blogNo": "{blogNo}",
"blogName": "프로메타의 서식지",
"nickName": "PROMETA",
"titleImage": "{imageUrl}",
"profileImage": "{imageUrl}",
"subscriberCnt": 63,
"visitorCnt": {
"today": 0,
"total": 11938
}
}
getCategoryList
(categoryList
)
블로그의 카테고리 목록을 가져오는 함수입니다.
apply
하지 않았을 경우:
import { getCategoryList } from 'naverblog-api';
getCategoryList('okms00909')
.then((categoryList) => {
console.log(categoryList);
});
apply
했을 경우:
import { apply } from 'naverblog-api';
apply('okms00909')
.then((blog) => {
console.log(blog.categoryList);
});
결과:
{
"categoryList": [{
"name": "전체보기",
"id": 0,
"postCnt": 65,
"childs": []
}, {
"name": "개발 현황",
"id": 43,
"postCnt": 28,
"childs": []
}, {
"name": "잡담",
"id": 44,
"postCnt": 20,
"childs": [{
"name": "기타",
"id": 47,
"postCnt": 10,
"childs": []
}]
}, "..."],
"memoCategoryList": [],
"postCnt": 65,
"memoCnt": 0
}
getPostList
블로그의 글 목록을 가져오는 함수입니다.
인자는 blogId
, categoryNo
, pageNo
이며, 각각 블로그 아이디,
카테고리 아이디(getCategoryList
의 결과를 참고),
글 목록의 페이지 번호(아래 결과를 참고) 입니다.
apply
하지 않았을 경우:
import { getPostList } from 'naverblog-api';
// categoryNo: 0 (`전체보기`)
// pageNo: 1 (첫 페이지)
getPostList('okms00909', 0, 1)
.then((postList) => {
console.log(postList);
});
apply
했을 경우:
import { apply } from 'naverblog-api';
apply('okms00909')
.then((blog) => {
blog.getPostList(0, 1)
.then((postList) => {
console.log(postList);
});
});
NOTE:
pageNo
는 0 이 아닌 1 부터 시작합니다. 또한,categoryNo
는 블로그의 카테고리마다 다르지만,0
은 언제나전체보기
입니다.
결과: (길이상 텍스트는 {text}
와 같이 생략하였습니다)
{
"postList": [{
"title": "{title}",
"id": "{postId}",
"category": {
"id": 43,
"name": "개발 현황"
},
"thumbnail": {
"type": "image",
"image": "{imageUrl}"
},
"addDate": "2018-08-14T07:23:27.114Z",
"commentCnt": 1,
"brief": "{brief}"
}, "..."],
"currentPage": 1,
"totalPage": 7,
"totalCnt": 65
}
thumbnail
의 type
값은 image
와 video
가 있지만,
thumbnail
은 type
에 관계없이 이미지입니다.
(video
일 경우 영상 자체가 thumbnail
로 들어가는 것이 아니라
영상의 미리보기 이미지가 thumbnail
값으로 들어가게 됩니다.)
getPost
블로그의 글을 가져오는 함수입니다.
apply
하지 않았을 경우:
import { getPost } from 'naverblog-api';
getPost('okms00909', 221338769113)
.then((postData) => {
console.log(postData);
});
apply
했을 경우:
import { apply } from 'naverblog-api';
apply('okms00909')
.then((blog) => {
blog.getPost(221338769113)
.then((postData) => {
console.log(postData);
});
});
결과: (길이상 텍스트는 {text}
와 같이 생략하였습니다)
{
"title": "{title}",
"contentHTML": "{html}",
"addDate": "2018-08-14T07:23:00.000Z",
"relatedPost": { // 연관 포스트
"posts": [{
"title": "{title}",
"id": "{postId}",
"addDate": "2018-08-13T15:00:00.000Z",
"commentCnt": 1,
"thumbnail": {
"type": "image",
"image": "{imageUrl}"
}
}, "..."],
"prevPostInfo": {
"title": "{title}",
"id": "{postId}",
"addDate": "2018-08-05T15:00:00.000Z",
"commentCnt": 0,
"thumbnail": {
"type": "image",
"image": "{imageUrl}"
}
},
"nextPostInfo": null
}
}
NOTE:
contentHTML
을 위한 CSS 는 하단의Resource:resource/post-style.css
를 참고 바랍니다.
getComments
블로그 글의 댓글을 가져오는 함수입니다.
apply
하지 않았을 경우:
getComments
를 따로 사용:
import { getComments } from 'naverblog-api';
getComments('okms00909', null, 221338769113)
.then((comments) => {
console.log(comments);
});
NOTE: 두번째 인자는
null
입니다!
getPost
에 이어서 사용:
import { getPost } from 'naverblog-api';
getPost('okms00909', 221338769113)
.then(postData => postData.getComments())
.then((comments) => {
console.log(comments);
});
apply
했을 경우:
getComments
를 따로 사용:
import { apply } from 'naverblog-api';
apply('okms00909')
.then((blog) => {
blog.getComments(221338769113)
.then((comments) => {
console.log(comments);
});
});
getPost
에 이어서 사용:
import { apply } from 'naverblog-api';
apply('okms00909')
.then((blog) => {
blog.getPost(221338769113)
.then(post => post.getComments())
.then((comments) => {
console.log(comments);
});
});
결과:
[{
"isSecret": true,
"author": {
"id": "{id}"
},
"addDate": "{date}",
"childs": [{
"isSecret": true,
"author": {
"id": "{id}"
},
"addDate": "{date}",
"childs": []
}]
}, {
"isSecret": false,
"author": {
"id": "{id}",
"name": "{name}",
"profile": "{imageUrl}"
},
"addDate": "{date}",
"childs": [{
"isSecret": false,
"author": {
"id": "{id}",
"name": "{name}",
"profile": "{imageUrl}"
},
"addDate": "{date}",
"childs": [],
"contents": "{text}"
}],
"contents": "{text}"
}, {
"isSecret": false,
"author": {
"id": "{id}",
"name": "{name}",
"profile": "{imageUrl}"
},
"addDate": "{date}",
"childs": [{
"isSecret": false,
"author": {
"id": "{id}",
"name": "{name}",
"profile": "{imageUrl}"
},
"addDate": "{date}",
"childs": [],
"contents": "{text}",
"sticker": {
"id": "line_characters_in_love-15",
"image": "{imageUrl}"
}
}],
"contents": "{text}"
}
]
isSecret
이 true
인 댓글은 비밀 댓글 을 나타냅니다.
댓글에 스티커가 있을 경우 sticker
프로퍼티가 생성되며,
스티커 이미지는 sticker.image
에 들어갑니다.
NOTE:
contents
내의 줄바꿈은<br>
을 이용합니다. (ex:asd<br>asd
)
getResouceFilePath
하단의 Resource
단락과 관련있는 함수입니다.
resource
폴더 내의 파일을 가져오는 기능을 가지고 있으며, 파일 목록은 Resource
단락을 참고 바랍니다.
사용 예시 (post-style.css
)
import { getResourceFilePath } from 'naverblog-api';
// 결과 : {resource 폴더 내 post-style.css 파일의 절대경로}
getResourceFilePath('post-style.css');
NOTE:
resource
폴더 내에 없는 파일을 불러오려 할 경우,null
이 반환됩니다.
Resource
resource/post-style.css
getPost
의 결과 중 contentHTML
을 그대로 사용하면 CSS가 적용되지 않기에 기존의 네이버
블로그에서 사용하는 CSS를 적용해야 하는데, 이 파일의 내용은 잘 변경되지 않는 반면, 파일의
위치가 수시로 변경(네이버측의 블로그 업데이트로 인해) 됩니다.
따라서 resource/post-style.css
에 해당 CSS 파일(블로그 글 내용 HTML의 CSS)을 넣어놓았으니,
이 파일을 이용하시기 바랍니다.
(코드 내에서 사용하려는 경우, API
단락의 getResouceFilePath
를 참고 바랍니다)
만약 해당 파일의 업데이트가 필요할 경우(네이버블로그가 업데이트되었을 경우), issue 를 등록해 주시거나 PR 을 넣어주세요
License
MIT
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago