How to save a JavaScript Screenshot?

It is possible to save a JavaScript screenshot, but you will need to use one of our server side API's such as the PHP GetResult method to implement a small web service to save the image on the server side. An example PHP web service to save the screenshot, is shown below.

include("lib/GrabzItClient.php");

$id = $_GET["id"];

// Custom id can be used to store user ids or whatever is needed for the later processing of the
// resulting screenshot

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

if (!$result)
{
   return;
}

//assuming jpg screenshots
file_put_contents("results" . DIRECTORY_SEPARATOR . $id + ".jpg", $result);

To integrate the PHP web service with the JavaScript API you will need to use the OnFinish Event. This can then be used to make an AJAX call to the server side web service, which will contain the ID of the completed screenshot. The web service can then use this information to save the image on the web server. Note that the below example uses jQuery.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script type="text/javascript">
GrabzIt("Sign in to view your Application Key").ConvertURL("http://www.spacex.com", 
	{"onfinish": function (id){
		$.ajax("http://www.example.com/mywebservice.php?id="+id);
	}}).Create();
</script>

Export a capture to a storage solution

Captures can be exported straight to Amazon S3, DropBox, FTP and WebDav once it has been generated by setting the export parameter. To do this you need to create an export URL and pass it to the JavaScript API.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script type="text/javascript">
GrabzIt("Sign in to view your Application Key").ConvertURL("http://www.spacex.com", 
    {"export": "dropbox://",
     "onfinish": function (id){
		$.ajax("http://www.example.com/mywebservice.php?id="+id);
    }}).Create();
</script>

Where export URL's specify a username and password it is recommended that you create a user just for this task, so it will be easy to revoke access if required. Also as this is in JavaScript please ensure you choose the Secure Export URL option as this will stop people stealing the username and password of your storage solution.

The onfinish method in the example is not required but allows you to store the id of the capture with the appropriate user or action etc.

Use the Data URI method instead

An alternative method is to use the DataURI method in the JavaScript Library to get the data URI of the capture this value can then be posted to your server were you can then save the image.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script type="text/javascript">
GrabzIt("Sign in to view your Application Key").ConvertURL("http://www.spacex.com").DataURI(callback);

function callback(dataUri)
{
    $.post("http://www.example.com/mywebservice.php", {data: dataUri});
}
</script>