$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
CORS - Cross-Origin Resource Sharing
Search
Sander van Zoest
June 05, 2012
Technology
1
180
CORS - Cross-Origin Resource Sharing
Introduction to CORS for the San Diego JavaScript gruop
Sander van Zoest
June 05, 2012
Tweet
Share
More Decks by Sander van Zoest
See All by Sander van Zoest
Continuous Delivery in Test
svanzoest
0
310
Stay C.A.L.M.S.: A local company's journey into DevOps
svanzoest
4
1.3k
Graphite: Scalable Real-time Graphing
svanzoest
1
290
Opscode Chef
svanzoest
0
91
Other Decks in Technology
See All in Technology
Capture Checking / Separation Checking 入門
tanishiking
0
110
MCP・A2A概要 〜Google Cloudで構築するなら〜
shukob
0
160
Claude Code Getting Started Guide(en)
oikon48
0
150
AI時代の開発フローとともに気を付けたいこと
kkamegawa
0
390
「え?!それ今ではHTMLだけでできるの!?」驚きの進化を遂げたモダンHTML
riyaamemiya
10
4.5k
プラットフォームエンジニアリングとは何であり、なぜプラットフォームエンジニアリングなのか
doublemarket
1
550
Noを伝える技術2025: 爆速合意形成のためのNICOフレームワーク速習 #pmconf2025
aki_iinuma
2
1.2k
AI/MLのマルチテナント基盤を支えるコンテナ技術
pfn
PRO
5
740
たかが特別な時間の終わり / It's Only the End of Special Time
watany
5
1.6k
HIG学習用スライド
yuukiw00w
0
110
pmconf2025 - データを活用し「価値」へ繋げる
glorypulse
0
460
世界最速級 memcached 互換サーバー作った
yasukata
0
160
Featured
See All Featured
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Become a Pro
speakerdeck
PRO
30
5.7k
Raft: Consensus for Rubyists
vanstee
140
7.2k
How to Think Like a Performance Engineer
csswizardry
28
2.3k
Automating Front-end Workflow
addyosmani
1371
200k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.6k
A better future with KSS
kneath
240
18k
RailsConf 2023
tenderlove
30
1.3k
Making the Leap to Tech Lead
cromwellryan
135
9.6k
Product Roadmaps are Hard
iamctodd
PRO
55
12k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Transcript
Cross-Origin Resource Sharing Sander van Zoest San Diego JS, June
5th, 2012 © Copyright 2012 OneHealth Solutions, Inc http://sander.vanzoest.com/ http://www.linkedin.com/in/svanzoest http://github.com/svanzoest http://gplus.to/svanzoest
Same-Origin Policy (SOP) • Central Security Concept • They prevent
a script hosted at one origin from reading or writing to the DOM of another. • Origin - <protocol>://<domain>:<port> © Copyright 2012 OneHealth Solutions, Inc 9/19/13 2
What about Cross-Origin? • JSONP - Error handling tricky -
Authentication primarily via cookies • Proxy Requests via the Server - Extra overhead of a server • Message Passing via iFrames - Cumbersome and confusing • CORS - Made to solve this mess © Copyright 2012 OneHealth Solutions, Inc 9/19/13 3
Cross-Origin Resource Sharing • Similar to Flash’s crossdomain.xml but more
granular. - Per request control - Managed by Application, not Systems • Supports all REST HTTP Methods - Such as PUT, DELETE • Better Error Handling • Plays nice with Authentication Methods © Copyright 2012 OneHealth Solutions, Inc 9/19/13 4
Simple Requests • Request only uses GET or POST. -
If POST is used to send data to the server, the Content-Type of the data sent to the server with the HTTP POST request is one of • application/x-www-form-urlencoded, • multipart/form-data • text/plain. • Does not set custom HTTP Headers • Otherwise, you need to preflight the request © Copyright 2012 OneHealth Solutions, Inc 9/19/13 5
Preflight Request 1. send an HTTP OPTIONS request - in
order to determine whether the actual request is safe to send. © Copyright 2012 OneHealth Solutions, Inc 9/19/13 6 OPTIONS /resources/post-here/ HTTP/1.1 Host: bar.other User-Agent: Mozilla/5.0 … Origin: http://foo.example Access-Control-Request-Method: POST Access-Control-Request-Headers: X-PINGOTHER
Preflight Request 2. server responds - in order to determine
whether the actual request is safe to send. © Copyright 2012 OneHealth Solutions, Inc 9/19/13 7 HTTP/1.1 200 OK Date: Mon, 04 June 2012 01:15:39 GMT Server: Apache/2.4.0 (Unix) Access-Control-Allow-Origin: http://foo.example Access-Control-Allow-Methods: POST, GET, OPTIONS Access-Control-Allow-Headers: X-PINGOTHER Access-Control-Max-Age: 1728000 … Content-Length: 0 Content-Type: text/plain
Preflight Request 3. Actual request happens - Now that we
have permission, we make the true call. © Copyright 2012 OneHealth Solutions, Inc 9/19/13 8 POST /resources/post-here/ HTTP/1.1 Host: bar.other … X-PINGOTHER: pingpong Content-Type: text/xml; charset=UTF-8 Referer: http://foo.example/examples/preflight.html Content-Length: 55 Origin: http://foo.example Pragma: no-cache Cache-Control: no-cache <?xml version="1.0"?><person><name>Arun</name></person>
Potential Security Concerns • Universal Allow: • Site-level Cross Origin
Access: • Access-control decision based on Origin header: • Origin Header Can Easily Be spoofed, - like the Referrer Header • Prolonged caching of Preflight responses • Misplaced-trust • Processing rogue COR © Copyright 2012 OneHealth Solutions, Inc 9/19/13 9
Resources • http://enable-cors.org • http://www.w3.org/TR/cors/ • http://arunranga.com/examples/access-control/ • http://code.google.com/p/html5security/wiki/ CrossOriginRequestSecurity
• https://developer.mozilla.org/en/http_access_control • http://dev.opera.com/articles/view/dom-access-control-using-cross- origin-resource-sharing/ • http://html5security.org/ • http://html5sec.org/ © Copyright 2012 OneHealth Solutions, Inc 9/19/13 10
p.s. We are hiring! http://www.onehealth.com/about/careers/ http://www.onehealth.com/ © Copyright 2012 OneHealth
Solutions, Inc 9/19/13 11