KEMBAR78
Designing & Building Secure Web APIs | PDF
April 27, 2018
PRESENTED
BY
Designing & Building Secure Web APIs
Vivek Thuravupala
Software Engineer @ Postman
Postman, API Development Environment
Relevance
APIs have been
exploding.
THOUSANDS
OF APIs!
So has API usage.
15B+ 10B+ 7B+
Average Daily API Calls
(2016)
Source: Programmable Web
The API Lifecycle
Application & API
Collation, Transformation...
Data-source
Database, cache, 3rd Party
API, etc.
Client
API Consumption & Presentation


Let’s build a GitHub proxy API!
Application & API
Collation, Transformation...
Data-source
Database, cache, 3rd Party
API, etc.
Client
API Consumption & Presentation


Design
! Why build this API?
! Who is your consumer?
! What can they do with your API?
! Public consumption of private resources
! An open public-facing website
! Fetch activity frequency
Planning
! Why build this API?
! Who is your consumer?
! What can they do with your API?
! Public consumption of private resources
! An open public-facing website
! Fetch activity frequency
Planning
! Public consumption of private resources
! An open public-facing website
! Fetch activity frequency
! Why build this API?
! Who is your consumer?
! What can they do with your API?
Planning
Let’s take a quick peek
at the GitHub API
TODO: Add API screenshots here
TODO: Add API screenshots here
TODO: Add API screenshots here
Application & API
Collation, Transformation...
Data-source
Database, cache, 3rd Party
API, etc.
Client
API Consumption & Presentation


Browser
Security Blanket
! CORS
! HTTPS
! Strict-Transport-Security
! Set-Cookie: SameSite, Secure,
HttpOnly
! X-Frame-Options
! Hide Application/Framework Headers
Leverage the ecosystem
Security Blanket
Reference: MDN
Cross-origin Resource Sharing
Chrome 4+, Edge 12+, FF 3.5+, IE 10+, Safari 4+
https://www.origin2.com
Get all emails
https://www.origin1.com
XHR/Fetch call
Security Blanket
Reference: MDN
Cross-origin Resource Sharing
https://www.origin2.com
https://www.origin1.com
XHR/Fetch call
Chrome 4+, Edge 12+, FF 3.5+, IE 10+, Safari 4+
Security Blanket
Reference: MDN
Cross-origin Resource Sharing
https://www.origin2.com
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST
https://www.origin1.com
XHR/Fetch call
OPTIONS POST
Chrome 4+, Edge 12+, FF 3.5+, IE 10+, Safari 4+
Cross-origin Resource Sharing
Security Blanket
! XMLHttpRequest , Fetch API follow
same-origin policy
! Different domain, protocol, or port
! Uses a pre-flight request if necessaryChrome 4+, Edge 12+, FF 3.5+, IE 10+, Safari 4+
Reference: MDN
Security Blanket
! HTTP over TLS
! Enforced on the client
! Does not hide origin/destination IP
Chrome 4+, Edge 12+, FF 4+, IE 11, Safari 7+
Reference: MDN
HTTPS + HSTS
Security Blanket
Reference: MDN
HTTPS + HSTS
Server
https://www.origin1.com
XHR/Fetch call, Document request
GET, *
Strict-Transport-Security
max-age: 31536000;
includeSubdomains
Chrome 4+, Edge 12+, FF 4+, IE 11, Safari 7+
Security Blanket
Reference: MDN
HTTPS + HSTS
Server
https://www.origin1.com
XHR/Fetch call, Document request
HTTP *
Chrome 4+, Edge 12+, FF 4+, IE 11, Safari 7+
Security Blanket
! Secure
○ Transmit only over HTTPS
! HttpOnly
○ Disallow access via JS
! SameSite (Chrome, Opera)
○ Useful against CSRF
Reference: MDN
Set-Cookie Flags
Chrome 1+, Edge, FF 3+, IE 9, Safari 5+
Security Blanket
! CSP
! X-XSS-Options
! X-Content-Type-Options
! Referrer-Policy
! Subresource Integrity
Just to note, if you’re serving a UI and not just an API.
Reference: MDN
Resource Representation
! Decoupled representation
! Sanitized
! Leverage HTTP(s)
○ Keep real-world quirks in mind!
Internal vs. External
Design, Mock, Debug
! Do it all in one place
Our first priority is to get a usable API.
TODO: Add mock/test screenshots/video herehttps://www.townscript.com/e/walmart-meetup/booking
TODO: Add mock/test screenshots/video here
TODO: Add mock/test screenshots/video herehttps://www.townscript.com/e/walmart-meetup/booking
TODO: Add mock/test screenshots/video here
Versioning
A quick word.
Versioning
! Twitter, 3 versions, 5 years
! Google Maps, 3 versions, 8+ years
! GitHub, 3 versions, 6+ years
Try to avoid (breaking) versioning
Versioning ! Facebook Graph API
! Versions: ¯_(ツ)_/¯Try to avoid (breaking) versioning
Versioning
! Publishers want to update ASAP
! Consumers want to avoid updating
! Multiple versions = increased attack
surface
Try to avoid (breaking) versioning
Build
Security Blanket
! Enforce using static code analysis &
testing
! Architecture as a forcing function
Reference: MDN
Security Blanket
! Lint for security
! Test for security
! Make it harder to be insecure
Static code analysis & testing
Security Blanket
Architecture as a forcing function
! The larger your team, the more difficult
it is to enforce your design
“A forcing function is an aspect of a
design that prevents the user from
taking an action without consciously
considering information relevant to
that action.”
Security Blanket
Reference: Interaction Design Foundation
Architecture as a forcing function
Security Blanket
! Make it much harder to be insecure
Architecture as a forcing function
Incoming Request Controller
Application logic, doesn’t
have to worry about
headers at all.
Outgoing Policy
Adds all security headers
by default. Can be
configured with a list if
necessary.
Response
Response has headers
by default. It’s more work
to get rid of them.
Architecture as a forcing function
! Guidelines, not rules
! Do your own research
! Security comes in layers
Wrapping up
Thank You!
@godfrzero @postmanclient

Designing & Building Secure Web APIs

  • 1.
    April 27, 2018 PRESENTED BY Designing& Building Secure Web APIs Vivek Thuravupala Software Engineer @ Postman
  • 2.
  • 3.
  • 4.
  • 5.
    So has APIusage. 15B+ 10B+ 7B+ Average Daily API Calls (2016) Source: Programmable Web
  • 6.
  • 8.
    Application & API Collation,Transformation... Data-source Database, cache, 3rd Party API, etc. Client API Consumption & Presentation 

  • 9.
    Let’s build aGitHub proxy API! Application & API Collation, Transformation... Data-source Database, cache, 3rd Party API, etc. Client API Consumption & Presentation 

  • 10.
  • 11.
    ! Why buildthis API? ! Who is your consumer? ! What can they do with your API? ! Public consumption of private resources ! An open public-facing website ! Fetch activity frequency Planning
  • 12.
    ! Why buildthis API? ! Who is your consumer? ! What can they do with your API? ! Public consumption of private resources ! An open public-facing website ! Fetch activity frequency Planning
  • 13.
    ! Public consumptionof private resources ! An open public-facing website ! Fetch activity frequency ! Why build this API? ! Who is your consumer? ! What can they do with your API? Planning
  • 14.
    Let’s take aquick peek at the GitHub API
  • 15.
    TODO: Add APIscreenshots here
  • 16.
    TODO: Add APIscreenshots here
  • 17.
    TODO: Add APIscreenshots here
  • 18.
    Application & API Collation,Transformation... Data-source Database, cache, 3rd Party API, etc. Client API Consumption & Presentation 
 Browser
  • 19.
    Security Blanket ! CORS !HTTPS ! Strict-Transport-Security ! Set-Cookie: SameSite, Secure, HttpOnly ! X-Frame-Options ! Hide Application/Framework Headers Leverage the ecosystem
  • 20.
    Security Blanket Reference: MDN Cross-originResource Sharing Chrome 4+, Edge 12+, FF 3.5+, IE 10+, Safari 4+ https://www.origin2.com Get all emails https://www.origin1.com XHR/Fetch call
  • 21.
    Security Blanket Reference: MDN Cross-originResource Sharing https://www.origin2.com https://www.origin1.com XHR/Fetch call Chrome 4+, Edge 12+, FF 3.5+, IE 10+, Safari 4+
  • 22.
    Security Blanket Reference: MDN Cross-originResource Sharing https://www.origin2.com Access-Control-Allow-Origin: * Access-Control-Allow-Methods: POST https://www.origin1.com XHR/Fetch call OPTIONS POST Chrome 4+, Edge 12+, FF 3.5+, IE 10+, Safari 4+
  • 23.
    Cross-origin Resource Sharing SecurityBlanket ! XMLHttpRequest , Fetch API follow same-origin policy ! Different domain, protocol, or port ! Uses a pre-flight request if necessaryChrome 4+, Edge 12+, FF 3.5+, IE 10+, Safari 4+ Reference: MDN
  • 24.
    Security Blanket ! HTTPover TLS ! Enforced on the client ! Does not hide origin/destination IP Chrome 4+, Edge 12+, FF 4+, IE 11, Safari 7+ Reference: MDN HTTPS + HSTS
  • 25.
    Security Blanket Reference: MDN HTTPS+ HSTS Server https://www.origin1.com XHR/Fetch call, Document request GET, * Strict-Transport-Security max-age: 31536000; includeSubdomains Chrome 4+, Edge 12+, FF 4+, IE 11, Safari 7+
  • 26.
    Security Blanket Reference: MDN HTTPS+ HSTS Server https://www.origin1.com XHR/Fetch call, Document request HTTP * Chrome 4+, Edge 12+, FF 4+, IE 11, Safari 7+
  • 27.
    Security Blanket ! Secure ○Transmit only over HTTPS ! HttpOnly ○ Disallow access via JS ! SameSite (Chrome, Opera) ○ Useful against CSRF Reference: MDN Set-Cookie Flags Chrome 1+, Edge, FF 3+, IE 9, Safari 5+
  • 28.
    Security Blanket ! CSP !X-XSS-Options ! X-Content-Type-Options ! Referrer-Policy ! Subresource Integrity Just to note, if you’re serving a UI and not just an API. Reference: MDN
  • 29.
    Resource Representation ! Decoupledrepresentation ! Sanitized ! Leverage HTTP(s) ○ Keep real-world quirks in mind! Internal vs. External
  • 30.
    Design, Mock, Debug !Do it all in one place Our first priority is to get a usable API.
  • 31.
    TODO: Add mock/testscreenshots/video herehttps://www.townscript.com/e/walmart-meetup/booking
  • 32.
    TODO: Add mock/testscreenshots/video here
  • 33.
    TODO: Add mock/testscreenshots/video herehttps://www.townscript.com/e/walmart-meetup/booking
  • 34.
    TODO: Add mock/testscreenshots/video here
  • 35.
  • 36.
    Versioning ! Twitter, 3versions, 5 years ! Google Maps, 3 versions, 8+ years ! GitHub, 3 versions, 6+ years Try to avoid (breaking) versioning
  • 37.
    Versioning ! FacebookGraph API ! Versions: ¯_(ツ)_/¯Try to avoid (breaking) versioning
  • 38.
    Versioning ! Publishers wantto update ASAP ! Consumers want to avoid updating ! Multiple versions = increased attack surface Try to avoid (breaking) versioning
  • 39.
  • 40.
    Security Blanket ! Enforceusing static code analysis & testing ! Architecture as a forcing function Reference: MDN
  • 41.
    Security Blanket ! Lintfor security ! Test for security ! Make it harder to be insecure Static code analysis & testing
  • 42.
    Security Blanket Architecture asa forcing function ! The larger your team, the more difficult it is to enforce your design
  • 43.
    “A forcing functionis an aspect of a design that prevents the user from taking an action without consciously considering information relevant to that action.” Security Blanket Reference: Interaction Design Foundation Architecture as a forcing function
  • 44.
    Security Blanket ! Makeit much harder to be insecure Architecture as a forcing function
  • 45.
    Incoming Request Controller Applicationlogic, doesn’t have to worry about headers at all. Outgoing Policy Adds all security headers by default. Can be configured with a list if necessary. Response Response has headers by default. It’s more work to get rid of them. Architecture as a forcing function
  • 46.
    ! Guidelines, notrules ! Do your own research ! Security comes in layers Wrapping up
  • 47.