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