Question

This is my first question on here so be nice….

I am trying to use html2canvas to ultimately get a screenshot of a remote site (user submitted url).

The problem is the cross domain security features. I cannot read from the canvas as it’s locked by off site assets.

The solution is to use the proxy feature built into the library.

There are some github projects with python and node.js versions, but I’m needing to do it in php.

There are many topics on HOW to implement the feature and how to get it working, but none really explain how to make your own proxy.

My question is two fold, are there any existing solutions in PHP? and if not, I have a few questions on making my own:
1.) What is the output format of the proxy? json object? the rendered image? the base64 encoded data string?
2.) Do these files need to persist on the server or can they just be rendered then disappear (overwritten)?

This is roughly what i’m thinking:

$img_url = urldecode($_GET['url']);
$img_data = base64_encode(file_get_contents($img_url));
//shouldn't need it since it's not cross domain now, but a CORS header could be inserted
header('content-type: application/json; charset=utf-8');
json_encode("{$_GET['callback']}($img_data)");

Answer 1

I’ve found the answers to my question.
The proxy feature accepts a jsonp element with the url to the proxied image.
And they do need to be saved on the server while

This is raw, I will update it later, but here is a working PHP proxy script for html2canvas

session_start();
//parse the url sent by the proxy function
//TODO: scrub the input
$img_url = urldecode($_GET['url']);

//test file type
//TODO: test for other cases that don't have a '.'
$pos = strrpos($img_url, '.', -1);
$ext = substr($img_url, $pos);

//set a dir for this request
function randomNumber()
{
    return substr(sha1(rand()), 0, 15);
}

if (!isset($_COOKIE["img_path"]))
{
    do{
        $random = randomNumber();
    }while (is_dir('images/' . $random));

    setcookie("img_path", $random, time()+3600);

} else {
    $random = $_COOKIE["img_path"];
}

is_dir('images/' . $random) ? '' : mkdir('images/' . $random, 0755);

//TODO:catch cases where a filename isn't the last element
$basename = basename($img_url);

$file = 'images/' . $random . '/' .  $basename;

//save the image
copy($img_url, $file);

//TODO: don't hardcode the url
$test_location = "http://osc.test/html2canvas2/" . $file;

header('Content-Type: application/javascript');

echo  "{$_GET['callback']}(" . json_encode($test_location) . ")";