使用以下功能生成更好的网页图像截图或将HTML直接转换为图像 GrabzIt的Ruby API。 但是,在开始之前,请记住 url_to_image, html_to_image or file_to_image 方法 save or save_to 必须调用方法来创建图像。
只需一个参数即可截取网页或 转换HTML intoa图片 如以下示例所示。
grabzItClient.url_to_image("https://www.tesla.com") # Then call the save or save_to method
grabzItClient.html_to_image("<html><body><h1>Hello World!</h1></body></html>") # Then call the save or save_to method
grabzItClient.file_to_image("example.html") # Then call the save or save_to method
GrabzIt的Ruby API可以采取几种格式的图像截图,包括JPG,PNG,WEBP,BMP(8位,16位,24位或32位)和TIFF。 图像截图的默认格式为JPG。 但是,在这些情况下,对于某些应用程序而言,JPG图像的质量可能不够好,建议对图像截图使用PNG格式,因为它可以在质量和文件大小之间取得良好的平衡。 以下示例显示了使用PNG格式拍摄的图像截图。
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.format = "png" grabzItClient.url_to_image("https://www.tesla.com", options) # Then call the save or save_to method grabzItClient.save_to("result.png")
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.format = "png" grabzItClient.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options) # Then call the save or save_to method grabzItClient.save_to("result.png")
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.format = "png" grabzItClient.file_to_image("example.html", options) # Then call the save or save_to method grabzItClient.save_to("result.png")
浏览器大小是指在大多数情况下不需要捕获屏幕快照时将使用的浏览器窗口的大小,因为对于所有大多数任务而言,默认浏览器大小就足够了。 要设置浏览器大小,只需将一个值传递给 browserWidth
和 browserHeight
的方法 ImageOptions 类。
更改图像的大小很容易,但要做到不扭曲图像就更难了。 为了简化整个过程,我们建议您使用 简单的图像尺寸计算器.
如果要将图像的宽度和高度增加到大于浏览器的宽度和高度(默认为1366 x 728像素),则浏览器的宽度和高度也必须增加以匹配。
您可以将自定义标识符传递给 图片 方法,如下所示,然后将该值返回给您的GrabzIt Ruby处理程序。 例如,该自定义标识符可以是数据库标识符,从而允许将屏幕截图与特定数据库记录相关联。
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.customId = "123456" grabzItClient.url_to_image("https://www.tesla.com", options) # Then call the save method grabzItClient.save("http://www.example.com/handler/index")
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.customId = "123456" grabzItClient.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options) # Then call the save method grabzItClient.save("http://www.example.com/handler/index")
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.customId = "123456" grabzItClient.file_to_image("example.html", options) # Then call the save method grabzItClient.save("http://www.example.com/handler/index")
GrabzIt允许您截取整个网页的完整屏幕截图,以执行此操作,您需要将-1传递给 browserHeight
方法。 为了确保图片与浏览器大小匹配,请将-1传递给 height
和 width
属性。
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.browserHeight = -1 options.width = -1 options.height = -1 grabzItClient.url_to_image("https://www.tesla.com", options) # Then call the save or save_to method grabzItClient.save_to("result.jpg")
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.browserHeight = -1 options.width = -1 options.height = -1 grabzItClient.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options) # Then call the save or save_to method grabzItClient.save_to("result.jpg")
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.browserHeight = -1 options.width = -1 options.height = -1 grabzItClient.file_to_image("example.html", options) # Then call the save or save_to method grabzItClient.save_to("result.jpg")
您还可以返回未裁剪的缩略图,但是请注意,这会创建较大的图像。 为此,将-1传递给 height
和 width
方法。 通过-1的尺寸将不会被裁剪。
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.width = -1 options.height = -1 grabzItClient.url_to_image("https://www.tesla.com", options) # Then call the save or save_to method grabzItClient.save_to("result.jpg")
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.width = -1 options.height = -1 grabzItClient.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options) # Then call the save or save_to method grabzItClient.save_to("result.jpg")
grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.width = -1 options.height = -1 grabzItClient.file_to_image("example.html", options) # Then call the save or save_to method grabzItClient.save_to("result.jpg")
使用这些特殊值意味着您可以创建一个截图,该截图是整个网页的完整版本!
GrabzIt允许您截取HTML元素的屏幕截图,例如 div
or span
标记并捕获其所有内容。 为此,您必须将要截屏的HTML元素指定为 CSS选择器.
... <div id="features"> <img src="http://www.example.com/rocket.jpg"/><h3>Rocket Launch Next Week</h3> </div> ...
对于下面的示例,我们将选择id为“ features”的div,并将其输出为250 x 250px JPEG图像。
grabzItClient = GrabzIt::Client.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 = GrabzIt::ImageOptions.new() options.width = 250 options.height = 250 options.format = "jpg" options.targetElement = "#features" grabzItClient.url_to_image("http://www.bbc.co.uk/news", options) # Then call the save or save_to method grabzItClient.save_to("result.jpg")
下一个示例获取“功能” div的另一个屏幕截图,但是这次输出的JPEG图像恰好是div的大小。
grabzItClient = GrabzIt::Client.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 = GrabzIt::ImageOptions.new() options.width = 250 options.height = 250 options.format = "jpg" options.targetElement = "#features" options.browserHeight = -1 grabzItClient.url_to_image("http://www.bbc.co.uk/news", options) # Then call the save or save_to method grabzItClient.save_to("result.jpg")