본문 바로가기

카테고리 없음

phantomjs를 사용한 url(html) 캡처

지난번 글에서 php에서 url(html)을 이미지나 pdf로 변환하는 방법을 찾아 봤습니다.

먼저 wkhtmltopdf를 이용해서 url(html)을 pdf로 변환한 후에 image로 바꾸는 방법입니다.

이방법을 사용하려면 wkhtmltopdf를 먼저 설치를 해야 합니다.


오늘은 wkhtmltopdf 가 아닌 phantomjs( http://phantomjs.org )를 사용한

화면 캡처를 소개하려고 합니다.









결론부터 말씀드리면 지난번에 소개했던 https://www.url2png.com/ 의 결과물이 가장 좋습니다.



먼저, PhantomJS( http://phantomjs.org )에서 서버 환경에 맞는 버전을 다운 받습니다.





저는 가장 최근 버전을 다운로드 받아

압축을 해제하고 파일을 upload 했습니다.




Phantomjs에는 다른 기능도 있지만

저는 화면 캡처만 필요하기 때문에 그 부분만 확인했습니다.


http://phantomjs.org/screen-capture.html






examples 디렉토리에 있는 rasterize.js를 이용하면 간단하게 화면캡처를 받을 수 있습니다.

필요할 경우 인수를 추가하여 캡처 이미지의 크기나 확장자 등도 지정할 수 있습니다.


rasterize.js를 확인하면 다음과 같습니다.




설치과정도 단순합니다.

upload 외의 별도 설치과정이 필요 없습니다.

bin 디렉토리 밑에도 phantomjs 파일 하나 뿐입니다.

실행 가능하도록 변경하고 바로 네이버 메인을 캡처해 봤습니다.




각자의 서버 환경에 따라 다르겠지만

제가 사용하는 서버에서는 phantomjs에 꼭 필요한 파일이 없습니다.

다운로드 하는 곳을 다시한번 자세히 살펴보니 요구 사항이 있습니다.












서버 차이 때문이라면 하위버전을 설치하면 되지 않을까 생각되어

이전 버전의 phantomjs를 찾아 봤습니다.

이전 버전은 Google Code Project Hosting에서 제공하고 있습니다.




이전 버전중 가장 높은 1.9.2 버전을 다운받아

다시 서버에 upload 하고 테스트 해봤습니다.


javascript 관련하여 뭔가 제대로 실행되지 않은거 같습니다.

그래도 전과 같이 에러와 함께 멈추지는 않았습니다.


이미지 파일도 생성됐습니다.



어떻게 캡처 됐을까요?

확인해 보면 한글이 표시되지 않고,

javascript나 css도 제대로 처리되지 않았습니다.




서버에 한글 폰트를 설치하지 않아 발생한거 같습니다.

yum을 이용하여 서버에 한글 폰트를 다음과 같이 설치하고 다시한번 실행했습니다.





한글폰트를 설치하면 다음과 같이 한글은 제대로 표시 됩니다.




하지만

다른 값들은 제대로 처리되지 않아

네이버 메인과는 상당히 다른 것을 알 수 있습니다.



다음 메인은 어떨까요?


phantomjs로 다음 메인 캡처할 때는 에러도 없었습니다.

보시면 네이버보다는 글씨 폰트를 포함하여 깔끔하게 나왔습니다.

하지만 일부 이미지가 제대로 표시되지 않은 것을 알 수 있습니다.

아마도 이미지가 완전히 로딩되기 전에 캡처를 해서 그런게 아닐까 생각됩니다.

이런부분은 어떤 설정에서 처리할 수 있지 않을까 생각됩니다.










Phantomjs를 이용한 다양한 웹사이트 화면캡처 프로그램도 소개하고 있습니다.



그리고 아래 화면은 리눅스에 나눔폰트를 설치하는 과정입니다.