Download as PDF, PPTX
More Related Content
Similar to Easy logins for JavaScript web applications
Easy logins for JavaScript web applications
- 1. Easy logins forJavaScript web applications François Marier – @fmarier
- 12. problem #1: passwords arehard to secure
- 13. bcrypt / scrypt/ pbkdf2 per-user salt site secret password & lockout policies secure recovery
- 14. bcrypt / scrypt/ pbkdf2 per-user salt site secret password & lockout policies secure recovery
- 15. bcrypt / scrypt/ pbkdf2 per-user salt site secret password & lockout policies secure recovery
- 16. bcrypt / scrypt/ pbkdf2 per-user salt site secret password & lockout policies secure recovery
- 17. bcrypt / scrypt/ pbkdf2 per-user salt site secret password & lockout policies secure recovery
- 18. bcrypt / scrypt/ pbkdf2 3 1 0 2 per-user salt d r o site secret w s s s a & lockoutne p password li policies e id u secure recovery g
- 19. passwords are hardto secure they are a liability
- 20. ALTER TABLE user DROPCOLUMN password;
- 21. problem #2: passwords arehard to remember
- 22. pick an easypassword
- 23. pick an easypassword use it everywhere
- 24. passwords are hardto remember they need to be reset
- 26.
- 28. “People want alittle dating before marriage.” Eric Vishria – Rockmelt
- 30.
- 31.
- 34.
- 35. existing login systems arenot good enough
- 36. ideal web-wide identitysystem
- 37. ideal web-wide identitysystem
- 38. ideal web-wide identitysystem
- 39. ideal web-wide identitysystem
- 40. what if itwere a standard part of the web browser?
- 42. how does itwork?
- 43.
- 44.
- 45. getting a proofof email ownership
- 46.
- 47.
- 48.
- 49. you have asigned statement from your provider that you own your email address
- 51. logging into a3rd party site
- 52.
- 53.
- 54. assertion wikipedia.org Valid for: 2 minutes checkaudience check expiry
- 55. assertion wikipedia.org Valid for: 2 minutes checkaudience check expiry check signature
- 56.
- 57.
- 58.
- 59.
- 60. Persona is alreadya decentralised system
- 61. decentralisation is theanswer, but it's not a product adoption strategy
- 62. we can't waitfor all domains to adopt Persona
- 63. we can't waitfor all domains to adopt Persona solution: a temporary centralised fallback
- 64.
- 65. Persona already works withall email domains
- 66.
- 67.
- 71. Persona supports all modernbrowsers >= 8
- 72. Persona is decentralised, simpleand cross-browser
- 73. it's simple forusers, but is it also simple for developers?
- 75.
- 76. navigator.id.watch({ loggedInEmail: “francois@mozilla.com”, onlogin: function(assertion) { $.post('/login', {assertion: assertion}, function (data) { // do something } ); }, onlogout: function () { window.location = '/logout'; } });
- 77. navigator.id.watch({ loggedInUser: “francois@mozilla.com”, onlogin: function(assertion) { $.post('/login', {assertion: assertion}, function (data) { // do something } ); }, onlogout: function () { window.location = '/logout'; } });
- 78. navigator.id.watch({ loggedInUser: null, onlogin: function(assertion) { $.post('/login', {assertion: assertion}, function (data) { // do something } ); }, onlogout: function () { window.location = '/logout'; } });
- 79. navigator.id.watch({ loggedInUser: null, onlogin: function(assertion) { $.post('/login', {assertion: assertion}, function (data) { // do something } ); }, onlogout: function () { window.location = '/logout'; } });
- 80. navigator.id.watch({ loggedInUser: null, onlogin: function(assertion) { $.post('/login', {assertion: assertion}, function (data) { window.location = '/'; } ); }, onlogout: function () { window.location = '/logout'; } });
- 82.
- 86. navigator.id.watch({ loggedInUser: null, onlogin: function(assertion) { $.post('/login', {assertion: assertion}, function (data) { window.location = '/'; } ); }, onlogout: function () { window.location = '/logout'; } });
- 87.
- 88. navigator.id.watch({ loggedInUser: null, onlogin: function(assertion) { $.post('/login', {assertion: assertion}, function (data) { window.location = '/home'; } ); }, onlogout: function () { window.location = '/logout'; } });
- 89.
- 90. const verify =require('browserid-verify')(); verify(assertion, 'http://123done.org', function(err, email, response) { if (err) { return console.log(err); } if (email) { session.user = response.email; } else { delete session.user; } });
- 91. { status: “okay”, audience: “http://123done.org”, expires:1344849682560, email: “francois@mozilla.com”, } issuer: “login.persona.org”
- 92. const verify =require('browserid-verify')(); verify(assertion, 'http://123done.org', function(err, email, response) { if (err) { return console.log(err); } if (email) { session.user = response.email; } else { delete session.user; } });
- 93. { status: “failed”, } reason: “assertionhas expired”
- 94. const verify =require('browserid-verify')(); verify(assertion, 'http://123done.org', function(err, email, response) { if (err) { return console.log(err); } if (email) { session.user = response.email; } else { delete session.user; } });
- 97.
- 98. navigator.id.watch({ loggedInUser: null, onlogin: function(assertion) { $.post('/login', {assertion: assertion}, function (data) { window.location = '/home'; } ); }, onlogout: function () { window.location = '/logout'; } });
- 100. 1. load javascriptlibrary
- 101. 1. load javascriptlibrary 2. setup login & logout callbacks
- 102. 1. load javascriptlibrary 2. setup login & logout callbacks 3. add login and logout buttons
- 103. 1. load javascriptlibrary 2. setup login & logout callbacks 3. add login and logout buttons 4. verify proof of ownership
- 104. no 1. load javascriptlibrary API key needed 2. setup login & logout callbacks 3. add login and logout buttons 4. verify proof of ownership
- 105. you can addsupport for Persona in four easy steps
- 106.
- 107.
- 109. building a newsite: default to Persona
- 110. working on anexisting site/app: add support for Persona
- 111.
- 112.
- 113.
- 115. ALTER TABLE user DROPCOLUMN password;
- 116. To learn moreabout Persona: https://login.persona.org/ http://identity.mozilla.com/ https://developer.mozilla.org/docs/Persona/Why_Persona https://developer.mozilla.org/docs/Persona/Quick_Setup https://github.com/mozilla/browserid-cookbook https://developer.mozilla.org/docs/Persona/Libraries_and_plugins http://123done.org/ https://wiki.mozilla.org/Identity#Get_Involved @fmarier http://fmarier.org
- 117. identity provider API https://eyedee.me/.well-known/browserid: { "public-key":{ "algorithm":"RS", "n":"8606...", "e":"65537" }, "authentication": "/browserid/sign_in.html", "provisioning": "/browserid/provision.html" }
- 118. identity provider API https://eyedee.me/.well-known/browserid: { "public-key":{ "algorithm":"RS", "n":"8606...", "e":"65537" }, "authentication": "/browserid/sign_in.html", "provisioning": "/browserid/provision.html" }
- 119. identity provider API https://eyedee.me/.well-known/browserid: { "public-key":{ "algorithm":"RS", "n":"8606...", "e":"65537" }, "authentication": "/browserid/sign_in.html", "provisioning": "/browserid/provision.html" }
- 120. identity provider API https://eyedee.me/.well-known/browserid: { "public-key":{ "algorithm":"RS", "n":"8606...", "e":"65537" }, "authentication": "/browserid/sign_in.html", "provisioning": "/browserid/provision.html" }
- 121. identity provider API https://eyedee.me/.well-known/browserid: { "public-key":{ "algorithm":"RS", "n":"8606...", "e":"65537" }, "authentication": "/browserid/sign_in.html", "provisioning": "/browserid/provision.html" }
- 122. identity provider API 1.check for your /.well-known/browserid 2. try the provisioning endpoint 3. show the authentication page 4. call the provisioning endpoint again
- 123. identity provider API 1.check for your /.well-known/browserid 2. try the provisioning endpoint 3. show the authentication page 4. call the provisioning endpoint again
- 124. identity provider API 1.check for your /.well-known/browserid 2. try the provisioning endpoint 3. show the authentication page 4. call the provisioning endpoint again
- 125. identity provider API 1.check for your /.well-known/browserid 2. try the provisioning endpoint 3. show the authentication page 4. call the provisioning endpoint again
- 126. Photo credits: Top 500passwords: http://xato.net/passwords/more-top-worst-passwords/ Parchment: https://secure.flickr.com/photos/27613359@N03/6750396225/ Restaurant dinner: https://secure.flickr.com/photos/yourdon/3977084094/ Stop sign: https://secure.flickr.com/photos/artbystevejohnson/6673406227/ © 2013 François Marier <francois@mozilla.com> This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 New Zealand License.