Adam
Adam

Reputation: 464

HTML5 Canvas to Facebook

I've made a basic HTML5/JS comic creation tool that uses the canvas element.

I want users to be able to upload their comics via the Facebook API.

I don't believe Facebook allows posting images in the form of base64 strings from the canvas.toDataURI() method, and don't want to use my own server to convert these images & temporarily store them.

What's the best way to go about this? Possibilities I've wondered about: Convert canvas to blob? Store blob via web service (if so, suggestions?) Upload blob directly to Facebook? (Is that possible?)

Upvotes: 1

Views: 1093

Answers (2)

C3roe
C3roe

Reputation: 96353

I don’t see why this should not be possible doing a „normal” upload. You can create a new photo for a user by posting to PROFILE_ID/photos, with a source parameter of type multipart/form-data.

So first thing I’d try is getting the picture info from the canvas object into a „normal” form (writing it into a input element in the right format(?)), and sending that to Facebook. If this step succeeds, I’d see if jQuery or some other lib’s form.serialize method can build requests of type multipart/form-data. If that’s also possible, then there should be no further problem in taking the data in that format and posting it using FB.api (although you might want to tell your users to be patient, because that might take a while).

Can’t tell for sure if this’ll work, but I’d give it a try.

Upvotes: 1

Phil
Phil

Reputation: 1308

Facebook partners with Heroku for free app hosting, you can use it as the temporary server.

Upvotes: 0

Related Questions