html2canvas-php-proxy 1.0.0
+html2canvas-php-proxy
PHP Proxy html2canvas
This script allows you to use html2canvas.js with different servers, ports and protocols (http, https),
preventing to occur “tainted” when exporting the <canvas>
for image.
Setup
Set false for disable SSL checking or true for enable (require config PHP.INI with curl.cainfo=/path/to/cacert.pem
). You can set path manualy like this: define('H2CP_SSL_VERIFY_PEER', '/path/to/cacert.pem');
-define('H2CP_ALLOWED_DOMAINS', array( '*' ));
-*
allow all domains, for subdomains use like this *.site.com
, for fixed domains use array( 'site.com', 'www.site.com' )
+define('H2CP_ALLOWED_DOMAINS', '*');
+*
allow all domains, for subdomains use like this *.site.com
, for fixed domains use , 'site.com,www.site.com'
(string
separed by commas)
-define('H2CP_ALLOWED_PORTS', array( 80, 443 ));
-Config allowed ports
+define('H2CP_ALLOWED_PORTS', '80,443');
+Config allowed ports (string
separed by commas)
@@ -1201,12 +1201,12 @@ Usage
Using Web Console
If you have any problems with the script recommend to analyze the log use the Web Console from your browser:
- Firefox: https://developer.mozilla.org/en-US/docs/Tools/Browser_Console
- Chrome: https://developers.google.com/chrome-developer-tools/docs/console
+* Firefox: https://developer.mozilla.org/en-US/docs/Tools/Browser_Console
+* Chrome: https://developers.google.com/chrome-developer-tools/docs/console
* InternetExplorer: http://msdn.microsoft.com/en-us/library/gg589530%28v=vs.85%29.aspx
Get NetWork results:
- Firefox: https://hacks.mozilla.org/2013/05/firefox-developer-tool-features-for-firefox-23/
- Chrome: https://developers.google.com/chrome-developer-tools/docs/network
+* Firefox: https://hacks.mozilla.org/2013/05/firefox-developer-tool-features-for-firefox-23/
+* Chrome: https://developers.google.com/chrome-developer-tools/docs/network
* InternetExplorer: http://msdn.microsoft.com/en-us/library/gg130952%28v=vs.85%29.aspx
An alternative is to diagnose problems accessing the link directly:
http://[DOMAIN]/[PATH]/html2canvasproxy.php?url=http%3A%2F%2Fmaps.googleapis.com%2Fmaps%2Fapi%2Fstaticmap%3Fcenter%3D40.714728%2C-73.998672%26zoom%3D12%26size%3D800x600%26maptype%3Droadmap%26sensor%3Dfalse%261&callback=html2canvas_0
diff --git a/README.md b/README.md
index c6e87be..7b68138 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-## html2canvas-php-proxy 1.0.0
+## html2canvas-php-proxy
## PHP Proxy html2canvas
diff --git a/examples/google-maps-static.html b/examples/google-maps-static.html
index 13b40ec..a1d3fb4 100644
--- a/examples/google-maps-static.html
+++ b/examples/google-maps-static.html
@@ -1,72 +1,101 @@
-
-
- Google Maps static and html2canvas
-
+
+
-
-
-
- Google Maps static and html2canvas
- Tested on Chrome and Firefox
-
- REQUIRES API KEY,
- obtain in: https://developers.google.com/maps/documentation/javascript/get-api-key
-
+ };
+
+
+
+ Google Maps static and html2canvas
-
- Maps example:
-
-
-
-
-
-
-
-
+ Tested on Chrome and Firefox
+
+
+ Note: for use this example you needs replace YOUR_API_KEY
in <img>
by your "api key" from "google dev", for obtain a "api key" access: https://developers.google.com/maps/documentation/javascript/get-api-key
+
-
- Output results:
+
+ Maps example:
+
+
-
+
+
+
+
+
+
+
+ Output results:
+
+
diff --git a/examples/google-maps.html b/examples/google-maps.html
index 753f6ae..05f2d53 100644
--- a/examples/google-maps.html
+++ b/examples/google-maps.html
@@ -3,12 +3,32 @@
Google Maps and html2canvas
+
+
@@ -48,12 +68,23 @@
"proxy": "../html2canvasproxy.php",
"logging": true, //Enable log (use Web Console for get Errors and Warnings)
"onrendered": function(canvas) {
- var img = new Image();
- img.onload = function () {
- img.onload = null;
- document.getElementById("output").appendChild(img);
- };
- img.src = canvas.toDataURL("image/png");
+ var img = new Image;
+
+ img.onload = function () {
+ img.onload = null;
+ document.getElementById("output").appendChild(img);
+ };
+
+ img.onerror = function() {
+ img.onerror = null;
+ if(window.console.log) {
+ window.console.log("Not loaded image from canvas.toDataURL");
+ } else {
+ alert("Not loaded image from canvas.toDataURL");
+ }
+ };
+
+ img.src = canvas.toDataURL("image/png");
}
});
}
@@ -68,25 +99,26 @@
};
-
- Google Maps with html2canvas
- Tested on Chrome and Firefox
-
- REQUIRES API KEY,
- obtain in: https://developers.google.com/maps/documentation/javascript/get-api-key
-
-
-
- Maps example:
-
-
-
-
-
-
+
+ Google Maps with html2canvas
-
- Output results:
+ Tested on Chrome and Firefox
+
+
+ Note: for use this example you needs replace YOUR_API_KEY
in <img>
by your "api key" from "google dev", for obtain a "api key" access: https://developers.google.com/maps/documentation/javascript/get-api-key
+
+
+
+ Maps example:
+
+
+
+
-
+
+
+
+ Output results:
+
+
diff --git a/examples/html2canvas-0.4.1.html b/examples/html2canvas-0.4.1.html
index f65adbe..d31df2e 100644
--- a/examples/html2canvas-0.4.1.html
+++ b/examples/html2canvas-0.4.1.html
@@ -1,47 +1,48 @@
-
-
- html2canvas 0.4.1 with PHP proxy
-
+
-
-
- html2canvas 0.4.1 with PHP proxy
+ };
+
+ img.src = canvas.toDataURL("image/png");
+ }
+ });
+ };
+
+
+
+ html2canvas 0.4.1 with PHP proxy
-
- From githubusercontent.com:
-
-
-
- From facebook.com (with http redirect):
-
-
-
+
+ From githubusercontent.com:
+
+
+
+ From facebook.com (with http redirect):
+
+
+
curl.cainfo=/path/to/cacert.pem
). You can set path manualy like this: define('H2CP_SSL_VERIFY_PEER', '/path/to/cacert.pem');
define('H2CP_ALLOWED_DOMAINS', array( '*' ));
*
allow all domains, for subdomains use like this *.site.com
, for fixed domains use array( 'site.com', 'www.site.com' )
define('H2CP_ALLOWED_DOMAINS', '*');
*
allow all domains, for subdomains use like this *.site.com
, for fixed domains use , 'site.com,www.site.com'
(string
separed by commas)define('H2CP_ALLOWED_PORTS', array( 80, 443 ));
define('H2CP_ALLOWED_PORTS', '80,443');
string
separed by commas)Using Web Console
If you have any problems with the script recommend to analyze the log use the Web Console from your browser: - Firefox: https://developer.mozilla.org/en-US/docs/Tools/Browser_Console - Chrome: https://developers.google.com/chrome-developer-tools/docs/console +* Firefox: https://developer.mozilla.org/en-US/docs/Tools/Browser_Console +* Chrome: https://developers.google.com/chrome-developer-tools/docs/console * InternetExplorer: http://msdn.microsoft.com/en-us/library/gg589530%28v=vs.85%29.aspx
Get NetWork results: - Firefox: https://hacks.mozilla.org/2013/05/firefox-developer-tool-features-for-firefox-23/ - Chrome: https://developers.google.com/chrome-developer-tools/docs/network +* Firefox: https://hacks.mozilla.org/2013/05/firefox-developer-tool-features-for-firefox-23/ +* Chrome: https://developers.google.com/chrome-developer-tools/docs/network * InternetExplorer: http://msdn.microsoft.com/en-us/library/gg130952%28v=vs.85%29.aspx
An alternative is to diagnose problems accessing the link directly:
http://[DOMAIN]/[PATH]/html2canvasproxy.php?url=http%3A%2F%2Fmaps.googleapis.com%2Fmaps%2Fapi%2Fstaticmap%3Fcenter%3D40.714728%2C-73.998672%26zoom%3D12%26size%3D800x600%26maptype%3Droadmap%26sensor%3Dfalse%261&callback=html2canvas_0
Google Maps static and html2canvas
-Tested on Chrome and Firefox
-- REQUIRES API KEY, - obtain in: https://developers.google.com/maps/documentation/javascript/get-api-key -
+ }; + + + +Google Maps static and html2canvas
-Maps example:
-Tested on Chrome and Firefox
+ +
+ Note: for use this example you needs replace YOUR_API_KEY
in <img>
by your "api key" from "google dev", for obtain a "api key" access: https://developers.google.com/maps/documentation/javascript/get-api-key
+
Output results:
+Maps example:
+Output results:
+Google Maps with html2canvas
-Tested on Chrome and Firefox
-- REQUIRES API KEY, - obtain in: https://developers.google.com/maps/documentation/javascript/get-api-key -
- -Maps example:
- -Google Maps with html2canvas
-Output results:
+Tested on Chrome and Firefox
+ +
+ Note: for use this example you needs replace YOUR_API_KEY
in <img>
by your "api key" from "google dev", for obtain a "api key" access: https://developers.google.com/maps/documentation/javascript/get-api-key
+
Maps example:
+ +Output results:
+html2canvas 0.4.1 with PHP proxy
+ }; + + img.src = canvas.toDataURL("image/png"); + } + }); + }; + + + +html2canvas 0.4.1 with PHP proxy
-
- From githubusercontent.com:
-
-
- From facebook.com (with http redirect):
-
-
+ From githubusercontent.com:
+
+
+ From facebook.com (with http redirect):
+
+