Webをキャプチャして変換するツール

Webサイトのスクリーンショットをキャプチャする、またはHTMLを画像に変換する

Perl API

ウェブサイトの完璧な画像スクリーンショットを作成するか、次の機能を使用してHTMLを直接画像に変換します GrabzItのPerl API。 ただし、開始する前に、 URLToImage, HTMLToImage or FileToImage メソッド Save or SaveTo メソッドを呼び出して画像を作成する必要があります。

基本オプション

Webページのスクリーンショットを撮るために必要なパラメーターは1つだけです HTMLを変換 int画像を 次の例に示すように、

$grabzIt->URLToImage("https://www.tesla.com");
# Then call the Save or SaveTo method
$grabzIt->HTMLToImage("<html><body><h1>Hello World!</h1></body></html>");
# Then call the Save or SaveTo method
$grabzIt->FileToImage("example.html");
# Then call the Save or SaveTo method

画像フォーマット

GrabzItのPerl APIは、JPG、PNG、WEBP、BMP(8ビット、16ビット、24ビットまたは32ビット)およびTIFFを含むいくつかの形式で画像を作成できます。 画像のスクリーンショットのデフォルト形式はJPGです。 ただし、これらの状況の一部のアプリケーションではJPG画像の品質が十分ではない場合があります。画像のスクリーンショットには、品質とファイルサイズのバランスがとれるため、PNG形式が推奨されます。 以下の例は、PNG形式を使用して撮影された画像のスクリーンショットを示しています。

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->format("png");

$grabzIt->URLToImage("https://www.tesla.com", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.png");
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->format("png");

$grabzIt->HTMLToImage("<html><body><h1>Hello World!</h1></body></html>", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.png");
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->format("png");

$grabzIt->FileToImage("example.html", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.png");

ブラウザサイズ

ブラウザーサイズは、ほとんどすべてのタスクでデフォルトのブラウザーサイズで十分なので、ほとんどの場合、スクリーンショットをキャプチャするときに使用されるブラウザーウィンドウのサイズを指します。 デフォルトのブラウザサイズを使用するには、単に渡す 0 browserWidth & browserHeight の方法 GrabzItImageOptions とに提供されます。

画像サイズを変更する

画像のサイズを変更するのは簡単です。画像を歪めずに変更するのは少し難しいです。 プロセス全体を簡単にするために、これを使用することをお勧めします シンプルな画像寸法計算機.

画像の幅と高さをブラウザーの幅と高さ(デフォルトでは1366 x 728ピクセル)よりも大きくする場合、ブラウザーの幅と高さも一致するように増やす必要があります。

カスタム識別子

にカスタム識別子を渡すことができます 画像 メソッドを以下に示すように、この値はGrabzIt Perlハンドラーに返されます。 たとえば、このカスタム識別子はデータベース識別子であり、スクリーンショットを特定のデータベースレコードに関連付けることができます。

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->customId("123456");

$grabzIt->URLToImage("https://www.tesla.com", $options);
# Then call the Save method
$grabzIt->Save("http://www.example.com/handler.pl");
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->customId("123456");

$grabzIt->HTMLToImage("<html><body><h1>Hello World!</h1></body></html>", $options);
# Then call the Save method
$grabzIt->Save("http://www.example.com/handler.pl");
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->customId("123456");

$grabzIt->FileToImage("example.html", $options);
# Then call the Save method
$grabzIt->Save("http://www.example.com/handler.pl");

全長スクリーンショット

GrabzItを使用すると、Webページ全体のフルスクリーンのスクリーンショットを撮ることができます。これを行うには、-1を渡す必要があります browserHeight 方法。 画像がブラウザのサイズと一致するようにするには、-1を height & width 方法。

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->browserHeight(-1);
$options->width(-1);
$options->height(-1);

$grabzIt->URLToImage("https://www.tesla.com", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.jpg");
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->browserHeight(-1);
$options->width(-1);
$options->height(-1);

$grabzIt->HTMLToImage("<html><body><h1>Hello World!</h1></body></html>", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.jpg");
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->browserHeight(-1);
$options->width(-1);
$options->height(-1);

$grabzIt->FileToImage("example.html", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.jpg");

トリミングされていないサムネイルを返すこともできますが、大きな画像が作成される可能性があることに注意してください。 これを行うには、-1を渡します height および width メソッド。 -1が渡されたディメンションはトリミングされません。

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->width(-1);
$options->height(-1);

$grabzIt->URLToImage("https://www.tesla.com", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.jpg");
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->width(-1);
$options->height(-1);

$grabzIt->HTMLToImage("<html><body><h1>Hello World!</h1></body></html>", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.jpg");
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->width(-1);
$options->height(-1);

$grabzIt->FileToImage("example.html", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.jpg");
ブラウザの幅が完全ではないことに注意してください!

ブラウザの高さ、幅、出力の高さのメソッドでこれらの特別な値を使用すると、必要に応じてWebページ全体の正確なサイズのスクリーンショットを作成できます。

ページ要素のスクリーンショットを撮る

GrabzItでは、次のようなHTML要素のスクリーンショットを撮ることができます。 div or span タグを付け、そのすべてのコンテンツをキャプチャします。 これを行うには、スクリーンショットを撮るHTML要素を CSSセレクター.

...
<div id="features">
	<img src="http://www.example.com/boy.jpg"/><h3>Boy Found</h3>
</div>
...

以下のコードスニペットでは、IDが「features」であるdivのスクリーンショットを作成し、250 x 250px JPEGイメージとして返します。

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

# The 250 parameters indicates that image should be sized to 250 x 250 px
$options = GrabzItImageOptions->new();
$options->width(250);
$options->height(250);
$options->format("jpg");
$options->targetElement("#features");

$grabzIt->URLToImage("http://www.bbc.co.uk/news", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.jpg");

次の例では、「機能」divの別のスクリーンショットを作成しますが、今回はブラウザーのdivの正確なサイズのJPEG画像を出力します。

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

# The -1 indicates that image should not be cropped
$options = GrabzItImageOptions->new();
$options->width(250);
$options->height(250);
$options->browserHeight(-1);
$options->format("jpg");
$options->targetElement("#features");

$grabzIt->URLToImage("http://www.bbc.co.uk/news", $options);
# Then call the Save or SaveTo method
$grabzIt->SaveTo("result.jpg");