Java script and web cryptography (cf.objective)

Developer's Guide to
JavaScript and Web
Cryptography
Kevin Hakanson

Kevin Hakanson
@hakanson
+KevinHakanson

Abstract
The increasing capabilities and performance of the web
platform allow for more feature-rich user experiences. How
can JavaScript based applications utilize information security
and cryptography principles? This session will explore the
current state of JavaScript and Web Cryptography. We will
review some basic concepts and definitions, discuss the role
of TLS/SSL, show some working examples that apply
cryptography to real-world use cases and take a peek at the
upcoming W3C WebCryptoAPI. Code samples will use
CryptoJS in the browser and the Node.js Crypto module on
the server. An extended example will secure the popular
TodoMVC project using PBKDF2 for key generation, HMAC
for data integrity and AES for encryption.

(Less) Abstract
The increasing capabilities and performance of the web platformallow for more feature-
rich user experiences. How can JavaScript based applications utilize information security and
cryptography principles? This session will explore the current state of JavaScript and
Web Cryptography. We will review some basic concepts and
definitions, discuss the role of TLS/SSL, show some working examples that apply
cryptography to real-world use cases and take a peek at the upcoming W3C WebCryptoAPI. Code
samples will use CryptoJS in the browserand the Node.js
Crypto module on the server. An extended example will
secure the popular TodoMVCproject using PBKDF2 for key
generation, HMAC for data integrity and AES for encryption.
+ :) & ?s

Technology Logos (NASCAR Style)

Project which offers the same Todo application
implemented using MV* concepts in most of the
popular JavaScript MV* frameworks of today.
http://todomvc.com/
https://github.com/addyosmani/todomvc

Today's Session "todos"
● Review the relevant cryptography concepts.
● Apply these concepts using JavaScript and
Web technologies.

Why? TodoMVC Uses
Chrome keeps in an SQLite file:
OS X:
Windows:

This Is What I Want
● Enter Password before access to "todos"
● Encrypted "at rest" in

Java script and web cryptography (cf.objective)

Acronymphobia?
AES CA CBC CSRF DES
DSA ECC FIPS HMAC
ISO IV MD5 MITM NIST
OCB OWASP PBKDF2
PKCS PII PKI PRNG RC4
RSA SHA1 SSL TLS XSS

Glossary
Glossary of Key Information Security Terms
(Draft)
http://csrc.nist.gov/publications/drafts/ir-7298-
rev2/nistir7298_r2_draft.pdf

Cryptography
The discipline that embodies principles, means,
and methods for providing information security,
including confidentiality, data integrity, non-
repudiation, and authenticity.
SOURCE: SP 800-21

Cipher, Plaintext and Ciphertext
Cipher - Series of transformations that
converts plaintext to ciphertext using the
Cipher Key.
See Also: Inverse Cipher
SOURCE: FIPS 197

Cryptographic Key
A parameter used in conjunction with a cryptographic
algorithm that determines
● the transformation of plaintext data into ciphertext data,
● the transformation of ciphertext data into plaintext data,
● a digital signature computed from data,
● ...
SOURCE: FIPS 140-2

Secure Socket Layer (SSL)
A protocol used for protecting private
information during transmission via the Internet.
By convention, URLs that require an SSL
connection start with https: instead of http:
SOURCE: CNSSI-4009

W3C Web Cryptography API
This specification describes a JavaScript API
for performing basic cryptographic operations in
web applications, such as hashing, signature
generation and verification, and encryption and
decryption.
http://www.w3.org/TR/WebCryptoAPI/

WebCryptoAPI Use Cases
● Multi-factor Authentication
● Protected Document Exchange
● Cloud Storage
● Document Signing
● Data Integrity Protection
● Secure Messaging
● Javascript Object Signing and Encryption
(JOSE)
http://www.w3.org/TR/WebCryptoAPI/#use-cases

Web Cryptography Working Group
Key Dates
○ April 2012: Group Formation
○ March 2014: Last Call Working Draft
Comments are welcome through 20 May 2014.
○ 2015: Expected Recommendation
http://www.w3.org/2012/webcrypto/Overview.html

Require Internet Explorer 11?
● Internet Explorer 11 added support for the
Web Cryptography API
○ Included in Windows 8.1 or as update to Windows 7
or Windows Server 2008
○ However, based on spec before CryptoOperation
changed to support TC39/DOM Promises

Use Case: Netflix
HTML5 Video in IE 11 on Windows 8.1
Wednesday, June 26, 2013
"Microsoft implemented the Web Cryptography
API (WebCrypto) in Internet Explorer, which
allows us to encrypt and decrypt
communication between our JavaScript
application and the Netflix servers."
http://techblog.netflix.com/2013/06/html5-video-in-ie-11-on-windows-81.html

Contribute to Chromium?
● Chromium is the open-source project behind
Google Chrome.
○ Issue 245025: Implement WebCrypto in blink

Chromium Crypto Status
● Runtime Enabled Features
http://www.chromium.org/blink/runtime-enabled-features
chrome://flags/#enable-experimental-web-platform-features

Contribute to Firefox?
● Bug 865789 - (web-crypto) Implement W3C
Web Crypto API

PolyCrypt: A WebCrypto Polyfill
"a pure JavaScript implementation of the
WebCrypto API that people can use to get a
feel for how they can use the API in practice"
http://polycrypt.net/
https://github.com/polycrypt/polycrypt

Google: javascript cryptography

Stanford Javascript Crypto Library
● SJCL is "a secure, powerful, fast, small,
easy-to-use, cross-browser library for
cryptography in Javascript"
● 2009 whitepaper focused on k-weight,
performance and cryptographic randomness
○ "In Internet Explorer 8 our code is 11 times faster than the fastest
current implementation."
http://crypto.stanford.edu/sjcl/

CryptoJS
CryptoJS is a growing collection of standard
and secure cryptographic algorithms
implemented in JavaScript using best practices
and patterns.
● Hashers
● HMAC
● PBKDF2
● Ciphers
● Encoders
https://code.google.com/p/crypto-js/

Node.js Crypto
● Use to access this
module.
● The crypto module requires OpenSSL to be
available on the underlying platform.
● It also offers a set of wrappers for
OpenSSL's hash, hmac, cipher, decipher,
sign and verify methods.
http://nodejs.org/api/crypto.html

OpenSSL
The OpenSSL Project is a collaborative effort to
develop a robust, commercial-grade, full-
featured, and Open Source toolkit
implementing the Secure Sockets Layer (SSL
v2/v3) and Transport Layer Security (TLS v1)
protocols as well as a full-strength general
purpose cryptography library.
http://www.openssl.org/

Javascript Cryptography Considered
Harmful (circa 2010)
● Opinion on browser Javascript cryptography
○ "no reliable way for any piece of Javascript code to
verify its execution environment"
○ "can't outsource random number generation in a
cryptosystem"
○ "practically no value to doing crypto in Javascript
once you add SSL to the mix"
○ "store the key on that server [and] documents there"
http://www.matasano.com/articles/javascript-cryptography/
● Didn't consider the "offline" user experience

Host-Proof Hosting
● In A Blink
○ Sketch: Locked inside data cloud, key at browser.
● Solution
○ Host sensitive data in encrypted form, so that clients
can only access and manipulate it by providing a
pass-phrase which is never transmitted to the
server.
○ All encryption and decryption takes place inside the
browser itself.
http://ajaxpatterns.org/Host-Proof_Hosting (July 2005)

Web-browser encryption of personal health information [http://www.biomedcentral.com/1472-6947/11/70]
Encryption data flow. A diagram laying out how the encrypted data and the user-supplied passcode are used to decrypt the data.
Morse et al. BMC Medical Informatics and Decision Making 2011 11:70 doi:10.1186/1472-6947-11-70

Host-Proof Hosting "Requirements"
● Secure transport mechanism (HTTPS).
● Trust provider that hosts web application and
serves HTML and JavaScript resources.
● Defend against and accept risk of script
injection (XSS) threat.
○ However, unauthorized access by hackers only
attacks users who access the application while
infected, and not the entire persisted data store.

Kevin’s "Requirement"
● Avoid proving "Schneier's Law"
○ Anyone can invent a security system that he himself
cannot break.
http://www.schneier.com/blog/archives/2011/04/schneiers_law.html

OWASP Top 10 2013
● A1-Injection
● A2-Broken Authentication and Session Management
● A3-Cross-Site Scripting (XSS)
● A4-Insecure Direct Object References
● A5-Security Misconfiguration
● A6-Sensitive Data Exposure
● A7-Missing Function Level Action Control
● A8-Cross-Site Request Forgery (CSRF)
● A9-Using Components with Known Vulnerabilities
● A10-Unvalidated Redirects and Forwards
https://www.owasp.org/index.php/Top_10_2013

OWASP Top 10 Change From 2010
2013-A6: Sensitive Data Exposure
● Merged 2010-A7 – Insecure Cryptographic Storage &
2010-A9 - Insufficient Transport Layer Protection.
● Covers sensitive data protection from the moment
sensitive data is provided by the user, sent to and
stored within the application, and then sent back to the
browser again.
https://www.owasp.org/index.php/Top_10_2013-Release_Notes

A6-Sensitive Data Exposure
Am I Vulnerable To 'Sensitive Data Exposure'?
1. Is any of this data stored in clear text long term,
including backups of this data?
2. …
3. …
4. …
5. …
https://www.owasp.org/index.php/Top_10_2013-A6

Cryptographic Hash Function
A function that maps a bit string of arbitrary
length to a fixed length bit string.
Approved hash functions satisfy the following
properties:
● One-way
● Collision resistant
SOURCE: SP 800-21

SHA-1 Definition
SHA-1 uses a sequence of logical functions, f0
, f1
,…, f79
.
Each function ft
, where 0 ≤ t < 79, operates on three 32-bit
words, x, y, and z, and produces a 32-bit word as output.
The function f(x, y, z) is defined as follows:
SOURCE: FIPS 180-4

Hash-based Message Authentication
Code (HMAC)
A message authentication code that uses a
cryptographic key in conjunction with a hash
function.
SOURCE: FIPS 201; CNSSI-4009

Symmetric Key
A cryptographic key that is used to perform
both the cryptographic operation and its
inverse, for example to encrypt and decrypt, or
create a message authentication code and to
verify the code.
SOURCE: SP 800-63; CNSSI-4009

Digital Signature
The result of a cryptographic transformation of
data which, when properly implemented,
provides the services of:
1. origin authentication,
2. data integrity, and
3. signer non-repudiation.
SOURCE: FIPS 140-2

require('cookie-signature')
● Node module used by , which is
used by
● Signs the value of a cookie
exports.sign = function(val, secret){
if ('string' != typeof val) throw new TypeError('cookie required');
if ('string' != typeof secret) throw new TypeError('secret required');
return val + '.' + crypto
.createHmac('sha256', secret)
.update(val)
.digest('base64')
.replace(/=+$/, '');
};
https://github.com/visionmedia/node-cookie-signature

This express code
creates this signed cookie

This express code
which matches our CryptoJS test

This express code
which matches our CryptoJS test
and OpenSSL command line.

Password-Based Key Derivation
Functions (PBKDF)
● The randomness of cryptographic keys is
essential for the security of cryptographic
applications.
SOURCE: SP 800-132

Functions (PBKDF)
applications.
● Most user-chosen passwords have low
entropy and weak randomness properties.
○ shall not be used directly as cryptographic keys
SOURCE: SP 800-132

Functions (PBKDF)
applications.
● Most user-chosen passwords have low
entropy and weak randomness properties.
○ shall not be used directly as cryptographic keys
● KDFs are deterministic algorithms that are
used to derive cryptographic keying material
from a secret value, such as a password.
SOURCE: SP 800-132

PBKDF Specification
Input:
P Password
S Salt
C Iteration count
kLen Length of MK in bits; at most (232
-1) x hLen
Parameter:
PRF HMAC with an approved hash function
hlen Digest size of the hash function
Output:
mk Master key
http://csrc.nist.gov/publications/nistpubs/800-132/nist-sp800-132.pdf

Salt
A non-secret value that is used in a
cryptographic process, usually to ensure that
the results of computations for one instance
cannot be reused by an Attacker.
SOURCE: SP 800-63; CNSSI-4009

TypedArray
ECMAScript [ECMA-262] has traditionally been used in
contexts where there is no access to binary data.
Where binary data has needed to be manipulated, it is
often stored as a String and accessed using charCodeAt(),
or stored as an Array with conversion to and from base64
for transmission.
https://www.khronos.org/registry/typedarray/specs/latest/

Binary Data Structures
● JavaScript
○ "binary" String
● Node.js
○ Buffer
● "HTML5"
○ TypedArray
● CryptoJS
○ CryptoJS.lib.WordArray
● SJCL
○ sjcl.bitArray

Pseudorandom number generator
(PRNG)
An algorithm that produces a sequence of bits
that are uniquely determined from an initial
value called a seed. The output of the PRNG
“appears” to be random.
A cryptographic PRNG has the additional
property that the output is unpredictable, given
that the seed is not known.
SOURCE: CNSSI-4009

Random Data Functions
● JavaScript
○ Math.random()
● Node.js
○ crypto.randomBytes(n)
● WebCryptoAPI
○ window.crypto.getRandomValues(array)
● CryptoJS
○ CryptoJS.lib.WordArray.random(n)
● SJCL
○ sjcl.random.randomWords(n, paranoia)

Node.js crypto.randomBytes()
● Generates cryptographically strong pseudo-
random data.
http://nodejs.org/api/crypto.html

window.crypto.getRandomValues()
If you provide an integer-based ,
the function is going fill the array with
cryptographically random numbers.
https://developer.mozilla.org/en-US/docs/DOM/window.crypto.getRandomValues
http://msdn.microsoft.com/en-us/library/ie/dn302324(v=vs.85).aspx

CryptoJS.lib.WordArray.random(n)
Creates a word array filled with random bytes.

AES
The Advanced Encryption Standard specifies a U.S.
government approved cryptographic algorithm that can be
used to protect electronic data.
The AES algorithm is a symmetric block cipher that can
encrypt (encipher) and decrypt (decipher) information.
This standard specifies the Rijndael algorithm, a symmetric
block cipher that can process data blocks of 128 bits, using
cipher keys with lengths of 128, 192, and 256 bits.
SOURCE: FIPS 197

(CC BY 3.0) http://www.moserware.com/2009/09/stick-figure-guide-to-advanced.html

Initialization Vector (IV)
A vector used in defining the starting point of an
encryption process within a cryptographic
algorithm.
SOURCE: FIPS 140-2

OpenSSL Encryption Format
Since OpenSSL 0.9.5 (early 2000),
produces output in the following format :
● "Salted__" magic string
● 8 bytes of salt
● encrypted data
To decrypt a file encrypted with 0.9.4 (or
earlier) or other crypto software, use the
command line option.
http://www.mail-archive.com/openssl-users@openssl.org/msg35646.html

OpenSSL EVP_BytesToKey()
Derives a key and IV from a password and salt.
Not compatible with PBKDF2.
http://www.openssl.org/docs/crypto/EVP_BytesToKey.html

OpenSSL Encryption
OpenSSL command line encryption with key
and IV instead of password and salt.

Node.js Crypto Password and NoSalt

Data Flow and Storage
● Salt = initial random
● IV = initial random
● HMAC = SHA256( Salt, Key )
● Ciphertext = AES( todos, Key, IV )

Set and Confirm Password
On first use, password must be established.

Enter and Validate Password
On subsequent uses, password must be
entered to unlock todos.
An invalid password will shake the password
input field and outline in red.

Decrypt todos and Check Integrity

Java script and web cryptography (cf.objective)

More Related Content

What's hot (20)

Similar to Java script and web cryptography (cf.objective) (20)

More from ColdFusionConference (20)

Recently uploaded (20)

Java script and web cryptography (cf.objective)