php 使用 jquery 生成网站截图

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4550947/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-25 13:25:38  来源:igfitidea点击:

generating a screenshot of a website using jquery

phpjquerythumbnailsscreenshot

提问by Tyler

I would like to generate a screenshot thumbnail of any given url using strictly javascript. If this can't be done can anyone point me in the right direction to do this with my own api?

我想严格使用 javascript 生成任何给定 url 的屏幕截图缩略图。如果这不能做到,有人能指出我正确的方向,用我自己的 api 做到这一点吗?

edit I just decided to cheat and use frames because it was for something I was doing for fun anyway, but thanks for all the great answers khtmltox is probably the best choice if you want to do something like this... they also have php bindings aswell.

编辑我只是决定作弊并使用框架,因为无论如何我都是为了好玩而做的事情,但是感谢所有出色的答案如果你想做这样的事情,khtmltox可能是最好的选择......他们也有php绑定还有。

采纳答案by Christian

If you look at wkhtmltox, there's native lib/app for converting a webpage to an image.

如果您查看wkhtmltox,就会发现用于将网页转换为图像的本机 lib/app。

<?php // file: img.php
    $img=render_image($_GET['url']);
?>


<!-- Your Website -->

<img alt='ldr'/>

<script type="text/javascript">
    $(document).ready(function(){
        var url='http://google.com/';
        $('#img').attr('src','img.php?url='+encodeURIComponent(url));
    });
</script>

In case the comment wasn't clear enough, you need PHP somewhere which could run a native program.

如果注释不够清楚,您需要在可以运行本机程序的地方使用 PHP。

回答by napster

There is no way to do this in Javascript.

在 Javascript 中没有办法做到这一点。

I believe this can be done via server-side using third-party software.
Have a look at this tutorialfor more info.

我相信这可以通过服务器端使用第三方软件来完成。
查看本教程了解更多信息。

回答by Jonathan de M.

Bit old, but I faced the same problem and found http://html2canvas.hertzen.com/

有点旧,但我遇到了同样的问题,发现http://html2canvas.hertzen.com/

回答by jAndy

There is absolutely zerochance to do that with Javascript.

使用 Javascript 做到这一点的机会绝对为零

Actually, there isn't a chance at all to accomplish that with any "web"'ish technique. There might be a funky flash-app, I don't know (if that exists, one more reason to hate flash :p).

实际上,根本没有机会使用任何“网络”式技术来实现这一目标。可能有一个时髦的 flash 应用程序,我不知道(如果存在,另一个讨厌 flash 的理由:p)。

回答by sethvargo

Not gonna happen. The ONLY way you MIGHT be able to do this with JS is if the site is hosted on YOUR server and you have JS trigger to some shell script that renders the users page on your local server and saves it as an image.

不会发生。您可能能够使用 JS 执行此操作的唯一方法是,如果站点托管在您的服务器上,并且您有 JS 触发器到一些 shell 脚本,该脚本在您的本地服务器上呈现用户页面并将其保存为图像。

You want a subscription to browser shots

您想要订阅浏览器截图

回答by Sturt Edwin

Need to get screenshot website see checkout this is one phpwdn.com

需要获取屏幕截图网站查看结帐这是一个 phpwdn.com

回答by T.J. Crowder

You can't do this just with JavaScript. You have to use a service like SnapCasaor similar (which basically comes down to an imgtag in the right format, so it's all client-side from your perspective).

你不能只用 JavaScript 来做到这一点。您必须使用像SnapCasa或类似的服务(基本上归结为img正确格式的标签,因此从您的角度来看,这都是客户端)。

回答by nfo

In pure js it is not possible at moment.

在纯 js 中,目前是不可能的。

I installed cutycapon my server which is responsible for generating the pictures and with some js ajax magic you can easily create your own screen shoot - thumbnail service

我在我的服务器上安装了cutycap,它负责生成图片,并且使用一些 js ajax 魔法,您可以轻松创建自己的屏幕截图 - 缩略图服务

回答by Aman Virk

I recently created a REST API anyone can use to generate screenshots of websites. It is for free ( ofcourse ) and might can help you aswell.

我最近创建了一个任何人都可以用来生成网站截图的 REST API。它是免费的(当然),可能也可以帮助您。

Below are the links to some of my experiments.

下面是我的一些实验的链接。

Mashable ScreenShot http://storage.damnovae.com/issac/ba3d01a1ddeeb068fd365eb8468c4cd35150d143.png

Mashable ScreenShot http://storage.damnovae.com/issac/ba3d01a1ddeeb068fd365eb8468c4cd35150d143.png

Pinterest http://storage.damnovae.com/issac/f3419f73e840f2684fa15cb14154d507484b7318.png

Pinterest http://storage.damnovae.com/issac/f3419f73e840f2684fa15cb14154d507484b7318.png

Envato Screenshot with mobile portview http://storage.damnovae.com/issac/81c875e6622ca105db4135b19cde6b83d148b21f.png

带有移动端口视图的 Envato 屏幕截图 http://storage.damnovae.com/issac/81c875e6622ca105db4135b19cde6b83d148b21f.png

How does it work

它是如何工作的

Get your pastiche account api key , and make post request to the api url to generate screenshots. You can read more here http://damnovae.com/pastiche

获取您的模拟帐户 api key ,并向 api url 发出 post 请求以生成屏幕截图。你可以在这里阅读更多http://damnovae.com/pastiche