Kick Those Scripts to the Sandbox @ DC JavaScript

Do you want Tweets or your latest Instagram food picture to display nicely in your site? Just load this third-party script into your site — never mind what it does! … err, what’s the difference between third-party scripts and a cross-site scripting attack again? Can’t third-party scripts steal user credentials, track users without their consent, and hijack your site for advertising purposes? In this talk, we’ll discuss different ways of sandboxing these scripts to increase your site’s security, stability, and protect the privacy of your users. You’ll leave with an understanding of the latest browser features designed to protect you and your users.

Transcript

1. Kick those <scripts> 
 to the sandbox Andrew Dunkman @adunkman
2. 1 Trust 
 and 
 security 
 on the 
 web 2 Malvertising 
 & the 
 principle 
 of least 
 privilege 3 extending 
 the 
 browser 
 sandbox
3. 1 Trust 
 and 
 security 
 on the 
 web
4. 1 Trust and security 
 on the web
5. 1 Trust and security 
 on the web Download this app!
6. 1 Trust and security 
 on the web Download this app!
7. 1 Trust and security 
 on the web Download this app!
8. 1 Trust and security 
 on the web Download this app!
9. 1 Trust and security 
 on the web Go to this site! https://www.google.com
10. 1 Trust and security 
 on the web Go to this site! https://www.weather.gov
11. 1 Trust and security 
 on the web Go to this site! https://rebecca.blackfriday
12. 1 Trust and security 
 on the web Go to this site! https://.la
13. 1 Trust and security 
 on the web
14. 1 Trust and security 
 on the web Web security model basics Site scripts cannot access sensitive parts of your device. Downloaded content can’t be too large, and can be deleted at any time. Pages and scripts on the same site can communicate, but cannot communicate with different sites.
15. 1 Trust and security 
 on the web Web security model basics Site scripts cannot access sensitive parts of your device. Downloaded content can’t be too large, and can be deleted at any time. Pages and scripts on the same site can communicate, but cannot communicate with different sites. Sandbox’d!
16. 1 Trust and security 
 on the web Web security has changed over time Web security is always changing as the world changes how the internet is used. You’re responsible for protecting those less technically literate.
17. 1 Trust and security 
 on the web
18. 1 Trust and security 
 on the web Instant Heart Rate: HR Monitor Flo Health Inc.’s Flo Period & Ovulation Tracker
19. 1 Trust and security 
 on the web cross-site scripting attacks Malicious third-party scripts running in a trusted page.
20. 1 Trust and security 
 on the web cross-site scripting attacks Malicious third-party scripts running in a trusted page. Advertising and social media embeds Malicious third-party scripts running in a trusted page. NON
21. 1 Trust 
 and 
 security 
 on the 
 web 2 Malvertising 
 & the 
 principle 
 of least 
 privilege 3 extending 
 the 
 browser 
 sandbox
22. 2 Malvertising 
 & the 
 principle 
 of least 
 privilege
23. 2 Malvertising 
 & The principle of least privilege malvertising Malware (malicious software) advertising — when a trusted third-party script betrays that trust.
24. 2 Malvertising 
 & The principle of least privilege malvertising
25. 2 Malvertising 
 & The principle of least privilege malvertising
26. 2 Malvertising 
 & The principle of least privilege the power of the browser We don’t often see the power we’re granting to third party scripts. theannoyingsite.com
27. 2 Malvertising 
 & The principle of least privilege the principle of least privilege If you have trustworthy neighbors, do they have your house keys? Do they have everyone’s house keys? If you have a trustworthy application, do they have access to data from other applications? The ability to delete all your photos?
28. 2 Malvertising 
 & The principle of least privilege Do you follow this principle? Unless you limit them, third-party scripts have control to do horrible things to people. You are responsible for what they do.
29. 1 Trust 
 and 
 security 
 on the 
 web 2 Malvertising 
 & the 
 principle 
 of least 
 privilege 3 extending 
 the 
 browser 
 sandbox
30. 3 extending 
 the 
 browser 
 sandbox
31. 3 Extending the 
 browser sandbox by default, share and allow everything Backwards compatibility is one of the web’s biggest constraints. Tighter security is opt-in, which is taken advantage of by malicious sites and advertisers.
32. 3 Extending the 
 browser sandbox don’t share session data By default, cookies are shared with third-party scripts within your sandbox. This can be prevented by hiding cookies from JavaScript. Set-Cookie: user=wero2oi34jlksdf; path=/; HttpOnly
33. 3 Extending the 
 browser sandbox Don’t share where you’ve been By default, the current URL is provided to the next page and embedded frames. This can be prevented by implementing a Referrer-Policy. <iframe referrerpolicy="no-referrer"> Referrer-Policy: no-referrer
34. 3 Extending the 
 browser sandbox Referrer-policy settings no-referrer
 no-referrer-when-downgrade
 origin
 origin-when-cross-origin
 same-origin
 strict-origin
 strict-origin-when-cross-origin
 unsafe-url
35. 3 Extending the 
 browser sandbox Don’t allow certain behaviors All behaviors are enabled by default, but can be disabled by specifying an allow-list. <iframe sandbox="allow-scripts allow-same-origin allow-popups"> Content-Security-Policy: sandbox allow-scripts allow- same-origin allow-popups
36. 3 Extending the 
 browser sandbox sandbox settings allow-forms
 allow-modals
 allow-orientation-lock
 allow-pointer-lock
 allow-popups
 allow-popups-to-escape-sandbox
 allow-presentation
 allow-same-origin
 allow-scripts
 allow-storage-access-by-user-activation
 allow-top-navigation
 allow-top-navigation-by-user-activation
37. 3 Extending the 
 browser sandbox sandbox settings allow-forms
 allow-modals
 allow-orientation-lock
 allow-pointer-lock
 allow-popups
 allow-popups-to-escape-sandbox
 allow-presentation
 allow-same-origin
 allow-scripts
 allow-storage-access-by-user-activation
 allow-top-navigation
 allow-top-navigation-by-user-activation
38. 3 Extending the 
 browser sandbox sandbox settings allow-forms
 allow-modals
 allow-orientation-lock
 allow-pointer-lock
 allow-popups
 allow-popups-to-escape-sandbox
 allow-presentation
 allow-same-origin
 allow-scripts
 allow-storage-access-by-user-activation
 allow-top-navigation
 allow-top-navigation-by-user-activation
39. 3 Extending the 
 browser sandbox sandbox settings allow-forms
 allow-modals
 allow-orientation-lock
 allow-pointer-lock
 allow-popups
 allow-popups-to-escape-sandbox
 allow-presentation
 allow-same-origin
 allow-scripts
 allow-storage-access-by-user-activation
 allow-top-navigation
 allow-top-navigation-by-user-activation
40. 3 Extending the 
 browser sandbox Don’t allow unexpected domains The browser will load scripts, fonts, videos, and all other content from anywhere by default. Instead, an allow-list can be specified. Content-Security-Policy: default-src 'self' *.googleanalytics.com
41. 3 Extending the 
 browser sandbox content-security-policy settings default-src
 connect-src
 font-src
 frame-src
 img-src
 manifest-src
 media-src
 object-src
 script-src
 style-src
 worker-src report-uri
42. 3 Extending the 
 browser sandbox content-security-policy settings default-src
 connect-src
 font-src
 frame-src
 img-src
 manifest-src
 media-src
 object-src
 script-src
 style-src
 worker-src report-uri

43. 3 Extending the 
 browser sandbox content-security-policy settings default-src
 connect-src
 font-src
 frame-src
 img-src
 manifest-src
 media-src
 object-src
 script-src
 style-src
 worker-src report-uri

44. 3 Extending the 
 browser sandbox content-security-policy settings default-src
 connect-src
 font-src
 frame-src
 img-src
 manifest-src
 media-src
 object-src
 script-src
 style-src
 worker-src report-uri

45. 3 Extending the 
 browser sandbox don’t allow browser features By default, anything the browser can do is allowed. Instead, an allow-list can be specified. <iframe allow="autoplay 'none'; geolocation 'none'"> Feature-Policy: autoplay 'none'; geolocation ‘none'
46. 3 Extending the 
 browser sandbox Feature-policy settings autoplay
 camera
 document-domain
 encrypted-media
 fullscreen
 geolocation
 microphone
 midi
 payment
 vr
 vibrate accelerometer
 ambient-light-sensor
 gyroscope
 layout-animations
 legacy-image-formats
 magnetometer
 oversized-images
 picture-in-picture
 speaker
 sync-xhr
 unoptimized-images
 unsized-media
 usb

47. 3 Extending the 
 browser sandbox Applying these techniques Interest in this area began with a site with a tight 
 Content-Security-Policy and Twitter… Do I want to give Twitter control of my site’s users?
48. 3 Extending the 
 browser sandbox Crazy ideas!? Using limited VirtualDOM diffing with a WebWorker — maybe impossible, but maybe magic.
49. 3 Extending the 
 browser sandbox Crazy ideas!?
50. web security is your responsibility to opt-in to Please do it
51. Thank you Questions? Find me after, join the group, and ask!
 I’m happy to answer any and all questions.