2012-04-13 28 views
2

私のWebアプリケーションでは、ユーザーは自分のデータベースに保存されているHTML/CSSマークアップを作成できます。私はそのマークアップのための「サムネイル」を、たとえば概要表示で提供したいと思います。レンダリングされたDOMのスクリーンショットをサーバー側で取得できますか?

サムネイルは約200x200pxで、元のマークアップは約900x900pxで表示されるようになっているため、そのマークアップをスケールする方法を見つける必要があります。マークアップを900pxでレンダリングし、200pxにスケールダウンしました。

JavaScriptまたはPHPを使用してこれが可能かどうかは誰にも分かりますか?それとも別のサーバー側の言語ですか?私はActiveXのようなサードパーティアプレットの使用を避けたいと思います。

編集:クライアント側でスクリーンショットが撮られ、サーバーに送信されるマッシュアップのようなものもあります。

答えて

5

WKHTMLTOPDFを使用できます。また、WKHTMLTOIMAGEというイメージを保存する機能もあります(別のディストリビューションだと思いますが、同じリンクからダウンロードできます)。システムコールとしてPHPのexec()で実行できます。 xvfbのような仮想バッファを使用すると、サーバー上でWKHTMLTOIMAGEヘッドレスを実行できます。これは、生成された結果は本当に良いですので...

あなたはこれらの投稿の実施例に記載のような標準的なPHPの機能を有する得られた画像を拡大縮小することができますベースのWebKitです:

あなたはこの質問HTML2PDF in PHP - convert utilities & scripts - examples & demosに私の答えをチェックしたいと思うかもしれません、多分それはあなたにも役立ちます。

1

あなたの最善の策は、ジョブを2つの部分に分割することです。スクリーンショットを作成し、200x200に縮小します。最初の部分では、HTMLを直接ビットマップファイル(おそらくPNG)にレンダリングできるコマンドラインツールまたはライブラリが必要です。私は一瞬の気づきは知らないが、もしあなたが本当に決まっていれば、あなたが何をやっているのか分かっていれば、Webkitとlibpngの周りに小さなラッパーを張って、本当に難しいはずはない。スケーリングのために、ほとんどのPHP設定で設定されたgdまたはImageMagick(より強力なもの)のいずれかを使用できます。一度これらの2つを持っていれば、それらをまとめるために適切な接着剤を書くことだけです。

0

要するに、これを行うには簡単な方法はありません。ユーザーがあなたが必ずしもいくつかのクライアント側の技術を使用する必要があります見るもののスクリーンショットを撮りたい場合は

しかし、これはWebsite screenshots using PHP

0

の単なる複製です。私はあなたがフラッシュでこれを行うことができるはずだと思います。

この答えはおそらくあなたを助ける必要があります。 Using HTML5/Canvas/JavaScript to take screenshots

そうしないと、あなたは、例えば、WKHTMLTOPDF(ミハルが示すように)使用して、サーバー側で同様の見解を「再作成」を試してみてください。

0

はい、これは可能ですし、サービス入口点としてphpフロントエンドを使用したソリューションも実装しました。実際の作業は、ページがレンダリングされるPhantomJS/Xvfbによって処理され、JavaScriptが実行されます(Web上のすべての動的に生成されるコンテンツで非常に重要です)。http://code.google.com/p/phantomjs/を、私はこのためにhttp://www.websupergoo.com/からABCpdfを使用している

0

ここhttp://skookum.com/blog/dynamic-screenshots-on-the-server-with-phantomjs/

乾杯は、かなり動作しているようです:

基本的には、PhantomJSと、この非常に簡単な作業作らXvfbのフレームバッファを使用して、より多くのここをチェックまあ、それは無料試用期間が付属していますが、商用製品です。私はこの会社に所属していません。

関連する問題