Web Crypto API - Lightning Talk @Troopers

This is a short Lightning Talk about W3C's Web Crypto API

Transcript

1. Web Cryptography API Lightning Talk, Troopers 2015 18th march, Heidelberg
2. Browser Cryptography > Browser Plugins
3. Browser Cryptography > Browser Plugins > JavaScript only implementations
4. Browser Cryptography > Browser Plugins > JavaScript only implementations > Web Crypto API (W3C recommendation)
5. Why is Crypto in JS bad? > Random Number Generator
6. Why is Crypto in JS bad? > Random Number Generator > Key protection
7. Why is Crypto in JS bad? > Random Number Generator > Key protection > (BigInteger Handling)
8. Spec Usecases > Data Integrity / Protection
9. Spec Usecases > Data Integrity / Protection > Document Signing / Protection
10. Spec Usecases > Data Integrity / Protection > Document Signing / Protection > JavaScript Object Signing Encryption (JOSE)
11. Spec Usecases > Data Integrity / Protection > Document Signing / Protection > JavaScript Object Signing Encryption (JOSE) > Messaging
12. Spec Usecases > Data Integrity / Protection > Document Signing / Protection > JavaScript Object Signing Encryption (JOSE) > Messaging > Authentication
13. What does it not solve “[..] security [..] in Javascript. (Unforunately, this is not as great as in desktop applications because it is not feasible to completely protect against code injection, malicious servers and side-channel attacks.” Stanford Javascript Crypto Library Homepage, not even using web crypto api 03/2015
14. W3C Specification Process Editors Draft
15. W3C Specification Process Editors Draft Working Draft Candidate Recommendation Proposed Recommendation
16. W3C Specification Process Editors Draft Working Draft Candidate Recommendation Proposed Recommendation W3C Recommendation
17. W3C Specification Process Editors Draft Working Draft Candidate Recommendation Proposed Recommendation W3C Recommendation You are here at least until 03/2015
18. Can I use? Source: caniuse.com - 03/2015
19. This means: Date: 03/2015 Chrome Firefox IE API
 Coverage ✓ ✓ ✓ Algorithms some some some (little less)
20. Firefox supported algorithms • AES-CTR • AES-CBC • AES-GCM • RSA-OAEP • AES-KW • HMAC • RSASSA-PKCS1-v1_5 • ECDSA • AES-CFB • RSA-PSS • AES-CMAC • CONCAT • HKDF-CTR • ECDH • DH • PBKDF2 • SHA-1 • SHA-256 • SHA-384 • SHA-512 Source: caniuse.com - 02/2015
21. Chrome supported algorithms • RSASSA-PKCS1-V1_5 • RSA_PSS * • RSA-OAEP • ECDSA * • ECDH * • AES-CTR * • AES-CBC • AES-CMAC • AES-CFB • DH • CONCAT • (HKDF) • (PBKDF) • AES-GCM • AES-KW • HMAC • SHA-1 • SHA-256 • SHA-384 • SHA-512 Source: chromium.org/blink/webcrypto - 02/2015, Version 41 * right now, BoringSSL only = Mac OS X, Windows and Android
22. IE supported algorithms • RSASSA-PKCS1-V1_5 • RSAES-PKCS1-V1_5 • RSA-OAEP • AES-CBC • AES-GCM • AES-KW • AES-CMAC • AES-CFB • DH • CONCAT • HKDF • PBKDF • AES-CTR • ECDH • ECDSA • RSA_PSS • HMAC • SHA-1 • SHA-256 • SHA-384 • SHA-512 Source: http://goo.gl/s0QSLk - 02/2015, Internet Explorer Version 11
23. Webcrypto Interface window.crypto || window.msCrypto
24. Webcrypto Interface window.crypto || window.msCrypto .getRandomValue
25. Webcrypto Interface window.crypto || window.msCrypto .subtle .getRandomValue • encrypt/decrypt • sign/verify • digest • generateKey • deriveKey • deriveBits • importKey/exportKey • wrapKey/unwrapKey
26. Webcrypto Interface > Data is usually supplied as ArrayBuffer
 (generic raw binary data buffer)
27. Webcrypto Interface > Data is usually supplied as ArrayBuffer
 (generic raw binary data buffer) > Results are JS Promises (beware IE)
28. Example Hash var  encoder  =  new  TextEncoder("utf-­‐8");   var  cryptoSubtle  =  window.crypto.subtle;   var  algorithm  =  {name:  'SHA-­‐1'};   var  toHash  =  “this  is  a  text  to  hash";   data  =  encoder.encode(toHash);                                                                                                                                                                  
29. Example Hash                   var  encoder  =  new  TextEncoder("utf-­‐8");   var  cryptoSubtle  =  window.crypto.subtle;   var  algorithm  =  {name:  'SHA-­‐1'};   var  toHash  =  “this  is  a  text  to  hash";   data  =  encoder.encode(toHash);   cryptoSubtle.digest(algorithm,  data)   .then(function(hash)  {      console.log("string",toHash,"hashed  with",  algorithm.name,":",  ab2hex(hash));   });
30. Example Hash function  ab2hex(arrayBuffer)  {      var  byteArray  =  new  Uint8Array(arrayBuffer);      var  hex  =  "";      for  (var  i=0;  i<byteArray.byteLength;  i++)  {          hex  +=  byteArray[i].toString(16);      }      return  hex;   }   var  encoder  =  new  TextEncoder("utf-­‐8");   var  cryptoSubtle  =  window.crypto.subtle;   var  algorithm  =  {name:  'SHA-­‐1'};   var  toHash  =  “this  is  a  text  to  hash";   data  =  encoder.encode(toHash);   cryptoSubtle.digest(algorithm,  data)   .then(function(hash)  {      console.log("string",toHash,"hashed  with",  algorithm.name,":",  ab2hex(hash));   });
31. Example Keyhandling //[..]   var  hashAlgorithm  =  {name:  'SHA-­‐1'};   var  algorithm  =  {name:  'ECDSA',  namedCurve:  'P-­‐256',  hash:  hashAlgorithm};   var  extractable  =  true;   var  usages  =  ["sign",  "verify"];   window.crypto.subtle.generateKey(algorithm,  extractable,  usages)   .then(function(keypair)  {      console.log("Keypair  generated:  ",  keypair);                     //[..]
32. Example Keyhandling //[..]   var  hashAlgorithm  =  {name:  'SHA-­‐1'};   var  algorithm  =  {name:  'ECDSA',  namedCurve:  'P-­‐256',  hash:  hashAlgorithm};   var  extractable  =  true;   var  usages  =  ["sign",  "verify"];   window.crypto.subtle.generateKey(algorithm,  extractable,  usages)   .then(function(keypair)  {      console.log("Keypair  generated:  ",  keypair);      window.crypto.subtle.exportKey('jwk',  keypair.publicKey)      .then(function(exportedKey)  {          console.log("Public  key  exported  as  JWK:",  exportedKey);      });   //[..]
33. Example Signature //[..]   var  toSign  =  "This  is  a  text  to  sign.";   var  data  =  encoder.encode(toSign);   cryptoSubtle.sign(algorithm,  keypair.privateKey,  data)   .then(function(signature)  {                                                                                                                                                                       });   //[..]
34. Example Signature //[..]   var  toSign  =  "This  is  a  text  to  sign.";   var  data  =  encoder.encode(toSign);   cryptoSubtle.sign(algorithm,  keypair.privateKey,  data)   .then(function(signature)  {      cryptoSubtle.verify(algorithm,  keypair.publicKey,  signature,  data)      .then(function(result)  {          console.log("Signature  is  valid:",  result);                });   });   //[..]
35. Example Encryption //[..]   var  text  =  "Encrypt  me!";   cryptoSubtle.encrypt(algorithm,  key,  encoder.encode(text))   .then(function(encryptedText)  {                                                                                                                                                         });   //[..]
36. Example Encryption //[..]   var  text  =  "Encrypt  me!";   cryptoSubtle.encrypt(algorithm,  key,  encoder.encode(text))   .then(function(encryptedText)  {      cryptoSubtle.decrypt(algorithm,  key,  encryptedText)      .then(function(decrypted){          var  dataView  =  new  DataView(decrypted);          console.log("Decrypted  string:  ",  decoder.decode(dataView));      });   });   //[..]
37. More Code Samples https://github.com/innoq/webcrypto-api Others, more Spec oriented: 
 https://github.com/diafygi/webcrypto-examples
38. Cross Browser Compatibility > use text-encode polyfill for working with ArrayBuffers
39. Cross Browser Compatibility > use text-encode polyfill for working with ArrayBuffers > use a polyfill for working with Promises
40. Cross Browser Compatibility > use text-encode polyfill for working with ArrayBuffers > use a polyfill for working with Promises > check algorithm and operation availability
41. Outlook > Web Crypto Key Discovery API (w-draft)
42. Outlook > Web Crypto Key Discovery API (w-draft) > (High-Level API)
43. Outlook > Web Crypto Key Discovery API (w-draft) > (High-Level API) > Stream Integration
44. Outlook > Web Crypto Key Discovery API (w-draft) > (High-Level API) > Stream Integration > Certificate Management / Usage
45. Outlook > Web Crypto Key Discovery API (w-draft) > (High-Level API) > Stream Integration > Certificate Management / Usage > Using Hardware Tokens
46. Outlook > Web Crypto Key Discovery API (w-draft) > (High-Level API) > Stream Integration > Certificate Management / Usage > Using Hardware Tokens > Web RTC integration
47. Outlook > Web Crypto Key Discovery API (w-draft) > (High-Level API) > Stream Integration > Certificate Management / Usage > Using Hardware Tokens > Web RTC integration > Web Payment integration
48. Implementation Tracking > Chrome: https://code.google.com/p/chromium/issues/detail? id=245025 (now labled as ‘cr-blink-webcrypto') > Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=865789 > WebKit: https://bugs.webkit.org/show_bug.cgi?id=122679 > IE: https://msdn.microsoft.com/library/ie/dn302338.aspx
49. Simon Kölsch | @simkoelsch simon.koelsch@innoq.com innoQ Deutschland GmbH Krischerstr. 100 40789 Monheim am Rhein Germany Phone: +49 2173 3366-0 innoQ Schweiz GmbH Gewerbestr. 11 CH-6330 Cham Switzerland Phone: +41 41 743 0116 www.innoq.com Ohlauer Straße 43 10999 Berlin Germany Phone: +49 2173 3366-0 Robert-Bosch-Straße 7 64293 Darmstadt Germany Phone: +49 2173 3366-0 Radlkoferstraße 2 D-81373 München Germany Telefon +49 (0) 89 741185-270 Thank you! Questions?
    Comments?