Skip to content

Instantly share code, notes, and snippets.

@jsmrcaga
Last active March 7, 2019 08:42
Show Gist options
  • Save jsmrcaga/a58dca72e4cc1a3fa8babc9d21e8ff16 to your computer and use it in GitHub Desktop.
Save jsmrcaga/a58dca72e4cc1a3fa8babc9d21e8ff16 to your computer and use it in GitHub Desktop.
WebAuthn API compilation

WebAuthn Protocol

Utility

ArrayBuffer.from = (string) => Uint8Array.from(string.split('').map(e => e.charCodeAt(0))).buffer;

let challenge = ArrayBuffer.from('super hard challenge created in server');
let id = ArrayBuffer.from('id created in server')

create

Options

(string if not specified)

W3 SPEC MDN

Public Key

{
	publicKey: {
		rp: {
			name: 
			[icon]:,
			[id] 
		},
		user: {
			id: BUFFER, // ususally generated in server
			displayName:,
			name:
		},
		challenge: BUFFER // randomly generated in server,
		pubKeyCredParams: [{
			type: "public-key", // always
			alg: INTEGER // COSEA identifier (-7, -257..)
		}, ...],
		timeout: INTEGER // in ms before challenge expires,
		attestation: "none" | "direct" | "indirect"
	}
}

Password

Password: https://www.w3.org/TR/credential-management-1/#create-passwordcredential

{
	password: {
		id: ???
		origin: '',
		password: 'plep',
		[name]: ,
		[iconURL]
	}
}

Working test

navigator.credentials.create({
	publicKey: {
		rp: {
			name: 'jocolina.com'
		},
		user: {
			name: 'Jo',
			id: buffer('super-id'),
			 displayName: 'Jo Colina'
		},
		challenge: buffer('my-challenge'),
		pubKeyCredParams: [{type: 'public-key', alg: -7}]
	}}).then(res => console.log(res))

navigator.credentials.create({
	password: {
		id: 'password1',
		origin: 'https://jocolina.com',
		password: '[poulet]'
	}
}).then(cred => console.log(cred))

store

From my understanding:

// await is only for the example, right now there
// is some performance loss because the call
// is wrapped in another promise/function resulting
// in 3 ticks instead of 1... ECMAScript was updated
// 5 days ago to mitigate this
let creds = await navigator.credentials.create();
let stored = await navigator.credentials.store(creds);
stored === ???

The demo at webauthn.org does not call the store method. I believe it's called internally

get

Options

{
	mediation: "silent", "optional", "required", // https://www.w3.org/TR/credential-management-1/#enumdef-credentialmediationrequirement
	signal: ???,
	[password]: true // this is their only example, what other fields are there? The mystery continues in the next episode!
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment