I have HTML canvas which i export into data uri image. Now i want to share this image as easy as possible (without creating FB apps and authentication tokens) on Facebook time line by clicking on custom link on my page.

I have tried something like this:

Image generation:

var dataUrl = context.canvas.toDataURL("image/jpeg");

Sharing link (onClick):

window.open('.php?u='+encodeURIComponent(dataUrl)+'&t='+encodeURIComponent('Some text'),'sharer','toolbar=0,status=0,width=626,height=436');

When i click the link in Safari I got Safari cannot open page ... (NSPOSIXErrorDomain:100)

How can I easily share data uri image via Facebook sharer URL (or some other way)?

Thanks for answers!

I have HTML canvas which i export into data uri image. Now i want to share this image as easy as possible (without creating FB apps and authentication tokens) on Facebook time line by clicking on custom link on my page.

I have tried something like this:

Image generation:

var dataUrl = context.canvas.toDataURL("image/jpeg");

Sharing link (onClick):

window.open('http://www.facebook./sharer.php?u='+encodeURIComponent(dataUrl)+'&t='+encodeURIComponent('Some text'),'sharer','toolbar=0,status=0,width=626,height=436');

When i click the link in Safari I got Safari cannot open page ... (NSPOSIXErrorDomain:100)

How can I easily share data uri image via Facebook sharer URL (or some other way)?

Thanks for answers!

• javascript
• facebook
• canvas
• share
• data-uri

• There is no way to share a data url. Either share a real url or upload the image to the users photos – WizKid Commented Feb 18, 2015 at 16:23

1 Answer 1

You can decode the DataURI to a share-able URL using this nifty service:

http://aminariana.github.io/data-uri-to-img-url/

This service takes a Base64 encoded DataURI via a POST request, and responds with a URL representing the decoded image. It will wrap your image in a page with opengraph META tags in real time.