Skip to content

Instantly share code, notes, and snippets.

@Ayms Ayms/gist:027737d92c2245b4f9d4 Secret
Last active Dec 15, 2015

What would you like to do?
WebCrypto API Use Case + start of a TLS/SSL proposal

WebCrypto API Use Case + start of a TLS/SSL proposal.

Example of an implementation of a TLS client or a TLS server inside the browser using WebSockets.

This is exactly what is being used in [1],[2] and [3] which works in reality (based on an adaptation of [4]).

Beside these examples, a rationale could be to establish TLS connections with a server not having valid certificates on top of WebSockets (because you can not establish wss connections with a server that does not have valid certificates).

Or it can be used with a server relaying messages from the tls client to the tls server or vice-versa through WebSockets (WebRTC like)

[1] [2] [3] [4]

interface tlsConnection : EventTarget {
  void handshake();
  void process(ArrayBufferView buffer);
  void prepare(ArrayBufferView buffer);
  void destroy();

  readonly attribute boolean connected;
  readonly attribute ArrayBufferView data;

  [TreatNonCallableasNull] attribute Function? ondestroy;
  [TreatNonCallableAsNull] attribute Function? onerror;
  [TreatNonCallableAsNull] attribute Function? onopen;
  [TreatNonCallableAsNull] attribute Function? onconnect;
  [TreatNonCallableAsNull] attribute Function? ontlsDataReady;
  [TreatNonCallableAsNull] attribute Function? onDataReady;

tlsConnection createTLSConnection(type,cipher_suites,domain,certs,verify) //TODO specify format of parameters

var server,client;
var websocket=new WebSocket('ws:// or my_relay_server');
websocket.onclose=function() {console.log('websocket closed')};
websocket.onmessage=function(evt) {
  var data=new Uint8Array(;
	if (data.type==='tls client message') { //simplification, data.type does not exist
											//but let's say that the message is recognized
											//as a tls client message
		if (!server) {
			//send certificate from certificate Store
			//do not verify client
			//simplification again : data.domain does not exist but let's say
			//that it's known from the messages received
			server=new createTLSConnection('server',my_cipher_suites,data.domain,my_certificate_Store,false); 
			server.onopen=function(evt) {;
			server.onconnect=function(evt) {'Hello client'));
				//prepare tls message
				//fire ontlsDataReady to send it
			server.onDataReady=function(evt) {
				alert('received from TLS client '+ArrayBufferViewToText(;
			server.ontlsDataReady=function(evt) {
		} else {
			server.process(data);	//process handshake
									//fire ontlsDataReady to send messages
									//process data after handshake
									//and fire onDataReady
	} else { //this is a message received from 
var start=function() {
	//verify server certificate with CAStore
	client=new createTLSConnection('client',my_cipher_suites,"",CAStore);
	client.onopen=function(evt) {;
	client.onconnect=function(evt) {'Hello server'));
		//prepare tls message
		//fire ontlsDataReady to send it
	client.ontlsDataReady=function(evt) {
	client.onDataReady=function(evt) {
		alert('received from '+ArrayBufferViewToText(;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.