如何使用 Javascript / Jquery / HTML5 功能将 HTML 页面捕获为图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12261423/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to capture HTML page as an image using Javascript / Jquery / HTML5 function
提问by Ankit
I would like to have a button on my website which can capture current image of my webpage. I have seen Google's "send feedback" function and want to implement tat in my web page. I also read about html2canvas and found below problems while implementing.
我想在我的网站上有一个按钮，可以捕获我网页的当前图像。我看过谷歌的“发送反馈”功能，想在我的网页中实现tat。我还阅读了 html2canvas 并在实施时发现了以下问题。
- Html2canvas won't save any swf object of the page.
- implementation of html2canvas is not document enough to understand how to use tat.
- customization on html2canvas is not easy (might be only for me its not easy).
- i want to save capture image after highlight / black out in my local drive or my web server
- Html2canvas 不会保存页面的任何 swf 对象。
- html2canvas 的实现文档不足以理解如何使用 tat。
- html2canvas 上的定制并不容易（可能只对我来说并不容易）。
- 我想在我的本地驱动器或我的网络服务器中高亮/黑屏后保存捕获的图像
guys i don't bother about security issue or other things since i want to use this feature for prototype only in fact if its work in local then also its fine.
伙计们，我不关心安全问题或其他事情，因为我只想将此功能用于原型，事实上，如果它在本地工作，那么它也很好。
I can use local host to run this page in browser and can capture the image and save in local.
我可以使用本地主机在浏览器中运行此页面，并可以捕获图像并保存在本地。
I'm also open for other solution apart from html2canvas. I just want to capture a webpage as an image if i can get highlighting and black out then it will be icing on a cake :).
除了 html2canvas 之外，我也对其他解决方案持开放态度。我只想将网页捕获为图像，如果我可以突出显示和变黑，那么它将锦上添花:)。
Thank you :)
谢谢 ：）
回答by Mansoor Jafar
try http://html2canvas.hertzen.com/it will be useful for you i think .
试试http://html2canvas.hertzen.com/我认为它对你有用。
回答by Jojo
I just had a test with http://www.bitpixels.com/registerRegistration is done via google account and the service is free up to several thousands of thumbnails per month.
我刚刚在http://www.bitpixels.com/register 上进行了测试 注册是通过 google 帐户完成的，该服务每月免费提供多达数千张缩略图。
Just use curl:
只需使用卷曲：
curl --get "http://img.bitpixels.com/getthumbnail?code=SOME-CODE-YOU-GET-BY-REGISTRATION&url=http://www.example.com"
Your favorite programming-language should have support for that.
你最喜欢的编程语言应该支持这一点。
Consider this php-example:
考虑这个 php 示例：
<?php
$ch = curl_init('http://img.bitpixels.com/getthumbnail?code=SOME-CODE-YOU-GET-BY-REGISTRATION&url=http://www.example.com');
curl_setopt_array($ch, array(
CURLOPT_BINARYTRANSFER => true,
CURLOPT_RETURNTRANSFER => true
));
$imageBinary = curl_exec($ch);
file_put_contents('test.png', $imageBinary);
Please refer for further information regarding php-curl to: http://php.net/manual/de/book.curl.php
有关 php-curl 的更多信息，请参阅：http: //php.net/manual/de/book.curl.php
and for image-handling with php to: http://php.net/manual/en/ref.image.php
并使用 php 进行图像处理：http: //php.net/manual/en/ref.image.php
