모바일 블로그 수정 (2015-05-03)

1.
연휴를 맞이하여 모바일 블로그를 조금 수정하였습니다.

처음 모바일 블로그를 만들던 2달 전 무렵
직접 작성하는 컨텐츠가 너무 적어
스크랩 하는 기사 등의 링크라도 연결을 할까 했었는데 이를 구현한 것이지요.
http://achor.net/board/diary/1602



2.
이미 웹사이트를 보며 관심 있는 컨텐츠는
http://twitter.com/achorNews 를 통해 저장해 놓고 있었고,
이는 다시 facebook과 계정 연동돼 있어
http://facebook.com/achorNews 에 자동으로 옮겨지고 있었습니다.

처음에는 아무래도 Graph API를 통해
https://graph.facebook.com/1086374671379811
위와 같은 류의 json 파일을 바로 리턴하는 facebook를 사용할 계획이었습니다만

twitter는 API 승인이 쉽게 난 것과 달리
facebook은 어찌나 꼬치꼬치 캐묻던 지 2번이나 재검증을 요구하더군요.


API 승인도 문제였긴 했지만
링크 컨텐츠의 URL만으로는 Open Graph의 게시물 ID를 알아낼 방법도 묘연하긴 했습니다.

https://developers.facebook.com/tools/debug/og/echo?q=URL 류를 사용하는 방법도 있을 듯 했지만
별다른 메리트는 없겠더군요.


twitter를 통해 링크된 컨텐츠의 URL을 확인하고,
각 게시물의 og 내용을 스크랩 했습니다.

https://github.com/scottmac/opengraph
찾아보니 og를 발라낼 수 있는 오픈소스도 있더군요.
자동으로 신규 스크랩된 내용은 내부 DB에 og 데이터를 저장하도록 처리했습니다.


og 메타 데이터만 저장하다 보니
네이버 블로그의 가변적 URL은 문제가 되더군요, 일괄적으로 제거해 버리고.

아, 한글문제로도 고전했습니다.

문서의 charset 설정이 먼저 와야 하는데
많은 웹문서들이 title을 먼저 쓰고 있어서 한글이 종종 깨진 채로 스크랩 되더군요.

$doc->loadHTML('<?xml encoding="UTF-8">' . $HTML);
로딩 시에 강제로 인코딩 설정을 추가하는 방법으로 해결했습니다.


그렇게 정제된 링크 컨텐츠의 og 데이터와 기존 제 다이어리의 데이터를 Union 처리하여
드디어 완성!



3.
프로세스 자체는 간단했지만
한글 깨지는 문제 등 예상치 못한 난관들은 꽤 나오더군요.

ajax를 근간으로 하다 보니
google plus나 카카오스토리 공유 버튼들을 쓰는 것이나
이미지의 자동 resizing 처리, lazyload 등도 좀 번거롭긴 했고요.


아무튼 완료!

나만의 모바일 facbook이다, 라고 생각하고 있습니다.
(나만의 소셜, 이라는 게 매우 모순 같긴 합니다만, 뭐 아무튼. -__-;)



4.
http://achor.net/blog

- achor

본문 내용은 3,517일 전의 글로 현재의 관점과 다를 수 있습니다.

Post: https://achor.net/board/diary/1617
Trackback: https://achor.net/tb/diary/1617
RSS: https://achor.net/rss/diary

Share
Facebook에서 보기 
Twitter에서 보기