Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
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
180
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
CORS - Cross-Origin Resource Sharing
Introduction to CORS for the San Diego JavaScript gruop
Sander van Zoest
June 05, 2012
More Decks by Sander van Zoest
See All by Sander van Zoest
Continuous Delivery in Test
svanzoest
0
320
Stay C.A.L.M.S.: A local company's journey into DevOps
svanzoest
4
1.3k
Graphite: Scalable Real-time Graphing
svanzoest
1
300
Opscode Chef
svanzoest
0
95
Other Decks in Technology
See All in Technology
「待ち時間」の消滅と「自我消耗」の加速:生成AI時代のエンジニアを救うメンタル・リソース管理
poropinai1966
0
310
システム監視を 「システムを監視するだけ」で 終わらせないために
seiud
0
140
ここは地獄!つらい朝会を体験することで、チームとしてのより良い振る舞いに気づくワークショップ / The stand-up meeting from hell in the game industry
scrummasudar
0
410
WEBフロントエンド研修【MIXI 26新卒技術研修】
mixi_engineers
PRO
1
690
13年運用タイトルのサーバーサイドが辿り着いた現在地 ― モンスターストライクにおける技術・組織・AI活用から得た知見
mixi_engineers
PRO
1
280
データベース研修【MIXI 26新卒技術研修】
mixi_engineers
PRO
1
630
最高のシステムプロンプトを作るためにフィードバック機能を導入した話
alchemy1115
0
210
ダッシュボード"開発"について 〜使われるダッシュボードのつくりかた〜
kimichan
0
240
QAと開発の両側から進める AI活用 -QAプロセスAI支援ツールキットと Inner Loop / Outer Loopの取り組み-
legalontechnologies
PRO
2
350
人とエージェントが高め合う協業設計
kintotechdev
0
1.1k
NYC Summit 2026 におけるAmazon Bedrock AgentCore のアップデート
ren8k
1
260
データエンジニアこそ組織のオントロジーに向き合うべき — 問いに答えるAIから、事業を動かすAIへ
gappy50
4
1.2k
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
85
9.6k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
10k
The browser strikes back
jonoalderson
0
1.4k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
230
Paper Plane
katiecoart
PRO
2
52k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
RailsConf 2023
tenderlove
30
1.5k
Facilitating Awesome Meetings
lara
57
7k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
370
Discover your Explorer Soul
emna__ayadi
2
1.2k
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
350
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
330
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