Persona: in your browsers, killing your passwords

1,008 views

Published on

Introduction to Persona, a new cross-browser login system for the web that's built entirely in Javascript. Powered by node.js on the backend, it pushes most of the crypto to the browser in order to create a secure and privacy-sensitive experience.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,008
On SlideShare
0
From Embeds
0
Number of Embeds
28
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Persona: in your browsers, killing your passwords

  1. 1. Persona: in your browsers, killing your passwordsFrançois Marier – @fmarier
  2. 2. XUsername:francoisPassword:**************** Sign in
  3. 3. security
  4. 4. bcrypt
  5. 5. bcryptper-user salt
  6. 6. bcryptper-user saltsite secret
  7. 7. bcryptper-user saltsite secretpassword & lockout policies
  8. 8. bcryptper-user saltsite secretpassword & lockout policiessecure recovery
  9. 9. bcrypt 0 1 2 2per-user salt o rdsite secret s s w s p a & lockoutne li policiespassword id e g usecure recovery
  10. 10. conversion rate
  11. 11. # hits signup
  12. 12. # hits signup signup_complete
  13. 13. # hits lost cust- omers signup signup_complete
  14. 14. existing solutions
  15. 15. client certificates
  16. 16. centralized authorities
  17. 17. so... storing passwords is hard
  18. 18. so... storing passwords is hard no suitable alternatives
  19. 19. decentralized
  20. 20. decentralized privacy-sensitive
  21. 21. decentralized privacy-sensitive simple
  22. 22. decentralized privacy-sensitive simple open source
  23. 23. in your browser
  24. 24. how does it work?
  25. 25. francois@mozilla.com
  26. 26. getting a proof of email ownership
  27. 27. authenticate?
  28. 28. authenticate? public key
  29. 29. authenticate? public keysigned public key
  30. 30. you have a signed statement from yourprovider that you own your email address
  31. 31. logging into a 3rd party site
  32. 32. assertion wikipedia.orgValid for: 2 minutes
  33. 33. assertion wikipedia.orgValid for: 2 minutescheck audience
  34. 34. assertion wikipedia.orgValid for: 2 minutescheck audiencecheck expiry
  35. 35. assertion wikipedia.orgValid for: 2 minutescheck audiencecheck expirycheck signature
  36. 36. assertion public key wikipedia.org Valid for: 2 minutes
  37. 37. assertion wikipedia.org Valid for: 2 minutes
  38. 38. assertionsession cookie
  39. 39. achievingthat vision
  40. 40. email providersbrowser vendors
  41. 41. email providers
  42. 42. fmarier@gmail.com
  43. 43. fmarier@gmail.com
  44. 44. fallback identity provider: login.persona.org
  45. 45. persona.org account
  46. 46. connect & express uglify bcrypt ejs underscorecomputer-cluster nodemailer jwcryto client-sessions convict winston vows
  47. 47. “A Node.JS Holiday Season”https://hacks.mozilla.org/
  48. 48. proxy identity provider:
  49. 49. support for all email providers
  50. 50. browser vendors
  51. 51. navigator.id.*
  52. 52. js
  53. 53. support for allmodern browsers >= 8
  54. 54. LIFD
  55. 55. LocallyIsolatedFeatureDomain
  56. 56. wanted: trusted coderunning in the browser
  57. 57. browserid.orglogin.persona.org
  58. 58. browserid.orglogin.persona.org
  59. 59. localStoragelocalStorage.setItem("key", serializedKey);var serializedKey = localStorage.getItem("key");
  60. 60. storage tied tologin.persona.org
  61. 61. window.postMessage()
  62. 62. jschannel localStorage https://login.persona.org
  63. 63. jschannel localStorage https://login.persona.orgquestions?
  64. 64. live demo
  65. 65. using it on your site
  66. 66. <script src=”https://login.persona.org/include.js”></script></body></html>
  67. 67. navigator.id.watch({ loggedInEmail: “francois@mozilla.com”, onlogin: function (assertion) { $.post(/login, {assertion: assertion}, function (data) { // do something } ); }, onlogout: function () { window.location = /logout; }});
  68. 68. navigator.id.watch({ loggedInUser: “francois@mozilla.com”, onlogin: function (assertion) { $.post(/login, {assertion: assertion}, function (data) { // do something } ); }, onlogout: function () { window.location = /logout; }});
  69. 69. navigator.id.watch({ loggedInUser: null, onlogin: function (assertion) { $.post(/login, {assertion: assertion}, function (data) { // do something } ); }, onlogout: function () { window.location = /logout; }});
  70. 70. navigator.id.watch({ loggedInUser: null, onlogin: function (assertion) { $.post(/login, {assertion: assertion}, function (data) { // do something } ); }, onlogout: function () { window.location = /logout; }});
  71. 71. navigator.id.watch({ loggedInUser: null, onlogin: function (assertion) { $.post(/login, {assertion: assertion}, function (data) { window.location = /; } ); }, onlogout: function () { window.location = /logout; }});
  72. 72. navigator.id.request()
  73. 73. navigator.id.watch({ loggedInUser: null, onlogin: function (assertion) { $.post(/login, {assertion: assertion}, function (data) { window.location = /; } ); }, onlogout: function () { window.location = /logout; }});
  74. 74. navigator.id.watch({ loggedInUser: null, onlogin: function (assertion) { $.post(/login, {assertion: assertion}, function (data) { window.location = /home; } ); }, onlogout: function () { window.location = /logout; }});
  75. 75. var request = https.request({ host: verifier.login.persona.org, path: /verify, method: POST, headers: { content-type: application/x-www-form-urlencoded, content-length: body.length }}, onVerifyResponse);
  76. 76. var request = https.request({ host: verifier.login.persona.org, path: /verify, method: POST, headers: { content-type: application/x-www-form-urlencoded, content-length: body.length }}, onVerifyResponse);var body = qs.stringify({ assertion: assertion, audience: http://123done.org});request.write(body);request.end();
  77. 77. var request = https.request({ host: verifier.login.persona.org, path: /verify, method: POST, headers: { content-type: application/x-www-form-urlencoded, content-length: body.length }}, onVerifyResponse);var body = qs.stringify({ assertion: assertion, audience: http://123done.org});request.write(body);request.end();
  78. 78. { status: “okay”, audience: “http://123done.org”, expires: 1344849682560, email: “francois@mozilla.com”, issuer: “login.persona.org”}
  79. 79. { status: “failed”, reason: “assertion has expired”}
  80. 80. navigator.id.logout()
  81. 81. navigator.id.watch({ loggedInUser: null, onlogin: function (assertion) { $.post(/login, {assertion: assertion}, function (data) { window.location = /home; } ); }, onlogout: function () { window.location = /logout; }});
  82. 82. 1. load javascript library
  83. 83. 1. load javascript library2. setup login & logout callbacks
  84. 84. 1. load javascript library2. setup login & logout callbacks3. add login and logout buttons
  85. 85. 1. load javascript library2. setup login & logout callbacks3. add login and logout buttons4. verify proof of ownership
  86. 86. framework / CMS plugins Express Jungles Mootools Olives Passport
  87. 87. To learn more about Persona:https://login.persona.org/http://identity.mozilla.com/https://developer.mozilla.org/docs/Persona/Why_Personahttps://developer.mozilla.org/docs/Persona/Quick_Setuphttps://github.com/mozilla/browserid-cookbookhttps://developer.mozilla.org/docs/Persona/Libraries_and_pluginshttp://123done.org/https://hacks.mozilla.org/category/a-node-js-holiday-season/@fmarier http://fmarier.org
  88. 88. Photo credits:Top 500 passwords: http://xato.net/passwords/more-top-worst-passwords/Parchment: https://secure.flickr.com/photos/27613359@N03/6750396225/Elephant in room: https://secure.flickr.com/photos/bitboy/246805948/Beach flower: https://secure.flickr.com/photos/vwingate/4696429215/Cookie on tray: https://secure.flickr.com/photos/jamisonjudd/4810986199/ © 2012 François Marier <francois@mozilla.com> This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 New Zealand License.

×