O'Reilly logo

HTML5 Data and Services Cookbook by Mite Mitreski, Gorgi Kosev

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Encoding binary data or text into base64

HTML5 support for binary data is through an ArrayBuffer object, the related type arrays. When it comes to transmitting that data, usually the way to do this is via base64. This is used mostly for dealing with textual data but with the rise of the usage of Data URI, base64 becomes more and more relevant. In this recipe, will see how to encode data using this scheme.

How to do it...

We will create an HTML file where we will use a canvas element, which will generate some data that will get encoded into base64:

  1. In order to have binary data, we will create an image using canvas, so we add a canvas element:
    <!doctype html> <html> <head> <meta charset="utf-8"> <title>Binary data to Base64</title> </head> <body> <canvas ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required