안전한 웹 페이지의 정확한 사본을 벡터 그래픽 형식으로 저장


9

웹 페이지의 정확한 복제본을 벡터 그래픽 형식으로 저장하고 싶습니다. 그래서 이미지를 래스터 그래픽 형식으로 저장하기 때문에 스크린 샷 기술을 사용할 수 없습니다.

Safari, Chrome 및 Firefox를 통해 'pdf로 인쇄'및 'pdf로 저장'을 시도했습니다. 이것은 대부분의 시간에 작동합니다. 그러나 저장된 pdf가 모든 웹 페이지의 정확한 복제본은 아닙니다. 예를 들어,이 웹 페이지를 pdf로 저장하고 upvote / downvote 아이콘이 저장된 pdf에 포함되지 않은 방법에 유의하십시오.

또한 Safari를 사용하여 WebArchive로 저장을 시도했습니다. 여기서 문제는 결과 파일을 자르고 WebArchive를 자르는 방법을 알 수 없다는 것입니다. 미리보기에서 열 수 없으므로 Safari에서 다시 사각형으로 열립니다.

또한 웹 페이지를 pdf (벡터 그래픽 형식)로 저장하는 원 클릭 솔루션을 제공하는 웹 브라우저 플러그인을 시도했습니다. 이 방법은 더 잘 작동하고 (정확한 페이지가 저장 됨) 페이지 URL을 클라우드 기반 프로그램으로 보내 페이지를 쿼리 한 다음 저장하여 이러한 프로그램이 작동한다는 점을 제외하고는 거의 문제를 해결합니다. 즉,이 기술은 로그인하기 위해 자격 증명이 필요한 https 사이트에서는 작동하지 않습니다.

그래서 나는 모퉁이에있다. 로그인 자격 증명이 필요한 웹 페이지의 정확한 벡터 그래픽 복제본을 저장하려고합니다. 어떻게해야합니까?


1
혼란 스럽다고 생각합니다. PDF는 벡터 형식이 아닙니다.
— Kevin Panko

혼란스럽지 않은; 단지 PDF, 벡터 그래픽 물건을 저장할 수있는 컨테이너입니다 세부 사항에 대해 너무 많이 걱정하지 나는 문제의 요점이 전달되는 생각 때문에
— 클레이튼 스탠리

귀하의 질문은 "웹 페이지를 화면에 표시되는 것과 똑같이 PDF 파일로 저장하는 방법은 무엇입니까? 그리고 로그온하기 위해 암호가 필요한 페이지와 작동합니까?"
— Kevin Panko

pdf 일 필요는 없습니다. 그것은 텍스트가 벡터 그래픽 형식 인 웹 페이지를 저장하는 유일한 경로입니다. 나는 그 형식에 헌신 할 필요가 없다. 그래도 두 번째 메모의 제목에 보안을 추가하여 더 잘 강조하겠습니다.
— Clayton Stanley

답변:


6

화면에서 페이지를 볼 때 표시되는 것과 다른 결과를 페이지를 PDF로 인쇄합니다.

이것은 웹 페이지에 인쇄 될 때 페이지를 변경하는 CSS 스타일 시트가 포함되어 있기 때문에 발생합니다.

이 질문은 이러한 문제를 피하는 데 도움이 됩니다. 화면 스타일 시트로 어떻게 인쇄합니까?

화면의 스타일 시트로 페이지를 인쇄하려면 지시 사항을 따르십시오.

그런 다음 PDF로 인쇄하여 화면에 표시되는 것과 동일한 결과를 얻을 수 있어야합니다.


1
전체 문서화를 위해 Chrome 웹 개발자 플러그인을 사용 하고이 플러그인을 통해 CSS를 편집했습니다. Chrome의 기본 제공 개발자 도구를 사용하여 CSS를 편집 한 후 인쇄 페이지를 업데이트 할 수 없지만 해당 도구에 익숙하지 않기 때문일 수 있습니다.
— Clayton Stanley

4

약간의 스크립팅을 두려워하지 않으면 http://phantomjs.org/ 에서 OSX 용 phantomjs 애플리케이션을 사용해보십시오 .

그런 다음 rasterize.js 스크립트를 사용하여 다음과 같은 명령으로 포함 된 바이너리를 실행하면됩니다.

phantomjs.exe rasterize.js http://www.example.com/sitepage 8.5in*11in outfile.pdf

몇 가지 메모 :

  • 'rasterize.js'라고하지만 텍스트 자체는 실제 텍스트로 PDF에 저장됩니다.

  • 페이지 객체를 초기화 한 후 rasterize.js 스크립트에 몇 줄을 추가하여 Windows 인증을 사용하여 보안 사이트에 대한 인증을 수행 할 수 있습니다.

var page = require ( 'webpage'). create (),
    시스템 = require ( 'system'),
    주소, 출력, 크기;
    page.settings.userName = "serviceUserName"; // 나는 이것을 추가했다
    page.settings.password = "servicePassword"; // 여기에 2 줄

if (system.args.length 5) {

phantomjs 바위!
— Matthew Lock
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.