Suche senden
Hochladen
Cross-Origin Resource Sharing
•
0 gefällt mir
•
872 views
Hiyou Shinnonome
Folgen
Cross-Origin Resource Sharingを簡単に解説しました @2015/06/30 DMM.comラボ ツチノコ定例勉強会
Weniger lesen
Mehr lesen
Internet
Melden
Teilen
Melden
Teilen
1 von 29
Jetzt herunterladen
Downloaden Sie, um offline zu lesen
Empfohlen
SPA勉強会
SPA勉強会
Daisuke Onoe
Html5biz on May 10th, 2013
Html5biz on May 10th, 2013
光一 原田
Nodejs and mongodb
Nodejs and mongodb
Ayako Hatori
20120609
20120609
小野 修司
AWS free tier maximization
AWS free tier maximization
Kenkichi Okazaki
20120128
20120128
小野 修司
Inspector CLI (JAWS-UG 京王線支部 #4 LT)
Inspector CLI (JAWS-UG 京王線支部 #4 LT)
Kenkichi Okazaki
Sales Force Episode VI ~ Return of Ajax Toolkit ~
Sales Force Episode VI ~ Return of Ajax Toolkit ~
Shinichi Tomita
Empfohlen
SPA勉強会
SPA勉強会
Daisuke Onoe
Html5biz on May 10th, 2013
Html5biz on May 10th, 2013
光一 原田
Nodejs and mongodb
Nodejs and mongodb
Ayako Hatori
20120609
20120609
小野 修司
AWS free tier maximization
AWS free tier maximization
Kenkichi Okazaki
20120128
20120128
小野 修司
Inspector CLI (JAWS-UG 京王線支部 #4 LT)
Inspector CLI (JAWS-UG 京王線支部 #4 LT)
Kenkichi Okazaki
Sales Force Episode VI ~ Return of Ajax Toolkit ~
Sales Force Episode VI ~ Return of Ajax Toolkit ~
Shinichi Tomita
Amazon awsを使ったwordpressサイト構築のポイント
Amazon awsを使ったwordpressサイト構築のポイント
Mugen Fujii
WebフレームワークXSS対策の自動化
WebフレームワークXSS対策の自動化
Yoshihiro Ura
サーバーレスでアンケートフォームを作ってみた
サーバーレスでアンケートフォームを作ってみた
ryutakatori
Hijax - 少しずつAjaxへ
Hijax - 少しずつAjaxへ
Yi Gu
React.js
React.js
youhe_
Media Assembly Kit
Media Assembly Kit
Hiromichi Koga
WordPress on movable type(WordCamp Kobe 2013)
WordPress on movable type(WordCamp Kobe 2013)
Hajime Fujimoto
Movable Type as a Playground
Movable Type as a Playground
Taku AMANO
20111203
20111203
小野 修司
Java script
Java script
sayoko miura
サービスが増えた今こそ気にしたいアクセス管理
サービスが増えた今こそ気にしたいアクセス管理
Yosuke Kusumi
Gulp De wordpress in WordBench
Gulp De wordpress in WordBench
Kanako Kobayashi
20150207 elastic loadbalancer
20150207 elastic loadbalancer
Daiki Mori
最近のASP.NET事情2013Winter
最近のASP.NET事情2013Winter
Narami Kiyokura
Service worker が拓く mobile web の新しいかたち
Service worker が拓く mobile web の新しいかたち
Kinuko Yasuda
Data APIの基本
Data APIの基本
Hajime Fujimoto
トレタのMySQL MySQL casual #8
トレタのMySQL MySQL casual #8
Hiroaki Sano
20161115 okubo mt_cloud_handson
20161115 okubo mt_cloud_handson
Six Apart
20180112 ssmjp SDカード今昔
20180112 ssmjp SDカード今昔
Hiyou Shinnonome
DMM.comラボでの日本語全文検索の利用事例紹介
DMM.comラボでの日本語全文検索の利用事例紹介
Hiyou Shinnonome
20150522 ssmjp 誰もが見たことのある仕様書の話
20150522 ssmjp 誰もが見たことのある仕様書の話
Hiyou Shinnonome
qpstudy 2013.04
qpstudy 2013.04
Hiyou Shinnonome
Weitere ähnliche Inhalte
Was ist angesagt?
Amazon awsを使ったwordpressサイト構築のポイント
Amazon awsを使ったwordpressサイト構築のポイント
Mugen Fujii
WebフレームワークXSS対策の自動化
WebフレームワークXSS対策の自動化
Yoshihiro Ura
サーバーレスでアンケートフォームを作ってみた
サーバーレスでアンケートフォームを作ってみた
ryutakatori
Hijax - 少しずつAjaxへ
Hijax - 少しずつAjaxへ
Yi Gu
React.js
React.js
youhe_
Media Assembly Kit
Media Assembly Kit
Hiromichi Koga
WordPress on movable type(WordCamp Kobe 2013)
WordPress on movable type(WordCamp Kobe 2013)
Hajime Fujimoto
Movable Type as a Playground
Movable Type as a Playground
Taku AMANO
20111203
20111203
小野 修司
Java script
Java script
sayoko miura
サービスが増えた今こそ気にしたいアクセス管理
サービスが増えた今こそ気にしたいアクセス管理
Yosuke Kusumi
Gulp De wordpress in WordBench
Gulp De wordpress in WordBench
Kanako Kobayashi
20150207 elastic loadbalancer
20150207 elastic loadbalancer
Daiki Mori
最近のASP.NET事情2013Winter
最近のASP.NET事情2013Winter
Narami Kiyokura
Service worker が拓く mobile web の新しいかたち
Service worker が拓く mobile web の新しいかたち
Kinuko Yasuda
Data APIの基本
Data APIの基本
Hajime Fujimoto
トレタのMySQL MySQL casual #8
トレタのMySQL MySQL casual #8
Hiroaki Sano
20161115 okubo mt_cloud_handson
20161115 okubo mt_cloud_handson
Six Apart
Was ist angesagt?
(18)
Amazon awsを使ったwordpressサイト構築のポイント
Amazon awsを使ったwordpressサイト構築のポイント
WebフレームワークXSS対策の自動化
WebフレームワークXSS対策の自動化
サーバーレスでアンケートフォームを作ってみた
サーバーレスでアンケートフォームを作ってみた
Hijax - 少しずつAjaxへ
Hijax - 少しずつAjaxへ
React.js
React.js
Media Assembly Kit
Media Assembly Kit
WordPress on movable type(WordCamp Kobe 2013)
WordPress on movable type(WordCamp Kobe 2013)
Movable Type as a Playground
Movable Type as a Playground
20111203
20111203
Java script
Java script
サービスが増えた今こそ気にしたいアクセス管理
サービスが増えた今こそ気にしたいアクセス管理
Gulp De wordpress in WordBench
Gulp De wordpress in WordBench
20150207 elastic loadbalancer
20150207 elastic loadbalancer
最近のASP.NET事情2013Winter
最近のASP.NET事情2013Winter
Service worker が拓く mobile web の新しいかたち
Service worker が拓く mobile web の新しいかたち
Data APIの基本
Data APIの基本
トレタのMySQL MySQL casual #8
トレタのMySQL MySQL casual #8
20161115 okubo mt_cloud_handson
20161115 okubo mt_cloud_handson
Mehr von Hiyou Shinnonome
20180112 ssmjp SDカード今昔
20180112 ssmjp SDカード今昔
Hiyou Shinnonome
DMM.comラボでの日本語全文検索の利用事例紹介
DMM.comラボでの日本語全文検索の利用事例紹介
Hiyou Shinnonome
20150522 ssmjp 誰もが見たことのある仕様書の話
20150522 ssmjp 誰もが見たことのある仕様書の話
Hiyou Shinnonome
qpstudy 2013.04
qpstudy 2013.04
Hiyou Shinnonome
20121103 #odstudy できる! VBAマクロ
20121103 #odstudy できる! VBAマクロ
Hiyou Shinnonome
20120519 #qpstudy インターフェース入門
20120519 #qpstudy インターフェース入門
Hiyou Shinnonome
20110528 qpstudy LT 「Interop 行きませんか」
20110528 qpstudy LT 「Interop 行きませんか」
Hiyou Shinnonome
きっかけはネットワーク #nwstudy Vol.01
きっかけはネットワーク #nwstudy Vol.01
Hiyou Shinnonome
#nwstudy の紹介
#nwstudy の紹介
Hiyou Shinnonome
インフラエンジニアのためのUstream入門
インフラエンジニアのためのUstream入門
Hiyou Shinnonome
Mehr von Hiyou Shinnonome
(10)
20180112 ssmjp SDカード今昔
20180112 ssmjp SDカード今昔
DMM.comラボでの日本語全文検索の利用事例紹介
DMM.comラボでの日本語全文検索の利用事例紹介
20150522 ssmjp 誰もが見たことのある仕様書の話
20150522 ssmjp 誰もが見たことのある仕様書の話
qpstudy 2013.04
qpstudy 2013.04
20121103 #odstudy できる! VBAマクロ
20121103 #odstudy できる! VBAマクロ
20120519 #qpstudy インターフェース入門
20120519 #qpstudy インターフェース入門
20110528 qpstudy LT 「Interop 行きませんか」
20110528 qpstudy LT 「Interop 行きませんか」
きっかけはネットワーク #nwstudy Vol.01
きっかけはネットワーク #nwstudy Vol.01
#nwstudy の紹介
#nwstudy の紹介
インフラエンジニアのためのUstream入門
インフラエンジニアのためのUstream入門
Cross-Origin Resource Sharing
1.
Cross-Origin Resource Sharing Ajax時代のCSRF対策
2.
CSRFとは • Cross-Site Request
Forgeries • 正規のフォーム等以外からのリクエストを送り、 データを不正に送受信すること • 詳しくはWikipedia:クロスサイトリクエストフォージェ リ
3.
Ajaxとは • Asynchronous JavaScript
+ XML • 非同期でJavaScriptを用いて必要な情報をXML で取得し、動的に画面を書き換える方法 • 現在はXML以外にJSON等も用いられる • サーバで動的にページを生成するものではない
4.
jQueryとは違うの • jQueryはAjaxを使うためのフレームワークの一 つ • 他にもGoogle
Web ToolkitやSpry等がある
5.
AjaxでのCSRF • 通常のCSRFはサーバへリクエストを送ること で、不正にページを書き換える攻撃手法 • Ajaxではサーバへリクエストを送ってページを 動的に生成することは基本的にない
6.
AjaxでのCSRF • クライアントサイドで動的にページ生成する際 に不正なデータを入れ込まれる • 正規のページに似せて骨格をつくり、ページを 構成する各パーツを正規のサーバから取得する ことで、ぱっと見では見分けがつかないページ を生成することが可能となってしまう
7.
対策 • 各ブラウザは、同一ドメインのリソースのみを Ajaxに利用できるように制限 「Ajaxクロスドメイン制約」 「同一生成元ポリシー」
8.
JSONP • HTMLのscriptタグを用いて、外部ドメインからデー タを持つスクリプトを取得、リソースとして利用する 方法 <script src=
http://data.example.com/req?data=example-data > • JSONPのデータは、基本的にどこからでもリクエス トして取得できてしまう。 → データ漏えいの危険性
9.
リファラ検証 • JSONPの呼び出し元を検証することで、攻撃サ イトへのデータ提供を阻止する • 最近のパーソナルファイアウォール等は、 Refererを削除するものがある →
リファラ検証が成り立たない
10.
その他の危険 • データ内容はあくまでJavaScript • 適切なエスケープを行わないとXSSを許容してし まうおそれがある
11.
CORS • 別ドメインリソースを取得するときのW3C勧告 • Ajaxがリソースを取ろうとした時に、ブラウザ 内部で動作する
→ JavaScriptで制御できない
12.
使われるヘッダ • Origin :
データ参照元ドメイン • Access-Control-* : 各種許可情報のやりとりに 使われる(ヘッダ名で内容は判断できる・後述
13.
CORSシーケンス • Ajaxで別ドメインのリソースを取得しようとする • ブラウザがリソースに対して表示中ページのドメ イン情報等を送る •
リソース側で許可されたアクセスかを判断し、ブ ラウザに応答する • 許可されたアクセスであれば、Ajaxの通信をブラ ウザがリソースへ送信する
14.
CORSシーケンス • Ajaxで別ドメインのリソースを取得しようとする • ブラウザがリソースに対して表示中ページのドメ イン情報等を送る •
リソース側で許可されたアクセスかを判断し、ブ ラウザに応答する • 許可されたアクセスであれば、Ajaxの通信をブラ ウザがリソースへ送信する
15.
Ajaxの外部リソース取得 • XMLHttpRequest(XHR)の呼び出し • JavaScriptからブラウザへリソースの要求が行われる •
ブラウザが外部ドメインかどうかを判断する • ブラウザがpreflightリクエストが必要かを判断 する
16.
preflightの条件 • HTTPメソッドがGET, POST,
HEADのいずれか • HTTPヘッダにAccept, Accept-Language, Content-Language, Content-Type以外のフィー ルドが含まれない • Content-Typeの値はapplication/x-www-form- urlencoded, multipart/form-data, text/plain のいずれか
17.
CORSシーケンス • Ajaxで別ドメインのリソースを取得しようとする • ブラウザがリソースに対して表示中ページの情報 を送る •
リソース側で許可されたアクセスかを判断し、ブ ラウザに応答する • 許可されたアクセスであれば、Ajaxの通信をブラ ウザがリソースへ送信する
18.
CORSシーケンス • Ajaxで別ドメインのリソースを取得しようとする • ブラウザがリソースに対して表示中ページの情報 を送る •
リソース側で許可されたアクセスかを判断し、ブ ラウザに応答する • 許可されたアクセスであれば、Ajaxの通信をブラ ウザがリソースへ送信する
19.
preflight - 送信 •
OPTIONSメソッドを使用 • Originヘッダ • 参照元スキーマ及びドメイン情報 • Access-Control-Request-Methodヘッダ • リクエストに使用するメソッド
20.
preflight - 送信 OPTIONS
/ HTTP/1.1 Host : data.example.com Origin : http://www.example.com Access-Control-Request-Method : GET
21.
CORSシーケンス • Ajaxで別ドメインのリソースを取得しようとする • ブラウザがリソースに対して表示中ページの情報 を送る •
リソース側で許可されたアクセスかを判断し、ブ ラウザに応答する • 許可されたアクセスであれば、Ajaxの通信をブラ ウザがリソースへ送信する
22.
CORSシーケンス • Ajaxで別ドメインのリソースを取得しようとする • ブラウザがリソースに対して表示中ページの情報 を送る •
リソース側で許可されたアクセスかを判断し、ブ ラウザに応答する • 許可されたアクセスであれば、Ajaxの通信をブラ ウザがリソースへ送信する
23.
preflight - 受信 •
200番台のレスポンスコード • Access-Control-Allow-Originヘッダ • 許可されたOriginの情報(通常、リクエストと同値が返される) • Access-Control-Max-Ageヘッダ • preflightのTTL(秒単位 • Access-Control-Allow-Methodsヘッダ • 許可するメソッドの一覧 • Varyヘッダ • 内容によって応答が変更されるヘッダ一覧
24.
preflight - 受信 HTTP/1.1
200 OK Server: nginx/1.7.10 Date: Mon, 29 Jun 2015 09:52:05 GMT Content-Length: 0 Connection: keep-alive Access-Control-Allow-Origin: * Access-Control-Allow-Methods: GET Access-Control-Max-Age: 3000 Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
25.
CORSシーケンス • Ajaxで別ドメインのリソースを取得しようとする • ブラウザがリソースに対して表示中ページの情報 を送る •
リソース側で許可されたアクセスかを判断し、ブ ラウザに応答する • 許可されたアクセスであれば、Ajaxの通信をブラ ウザがリソースへ送信する
26.
CORSシーケンス • Ajaxで別ドメインのリソースを取得しようとする • ブラウザがリソースに対して表示中ページの情報 を送る •
リソース側で許可されたアクセスかを判断し、ブ ラウザに応答する • 許可されたアクセスであれば、Ajaxの通信をブラ ウザがリソースへ送信する
27.
その他ヘッダ • Access-Control-Allow-Credentials • Cookieを許可するか •
Access-Control-Expose-Headers • 使用可能なヘッダの一覧
28.
前提条件 • DNS Spoofingがされていないこと
29.
質疑応答
Jetzt herunterladen