iframeを使ってクロスドメインでCookieを書き込む[iframe][sso]
iframeを使うことでドメインをまたいでクッキーを書き込む方法です
これはサードパーティクッキーと呼ばれているものです。
例えて言えば、parent.com にアクセスしただけで、外部ドメイン child.com のクッキーをセットしてしまうという黒魔術です。
完全なクロスドメインのSSO(シングルサインオン)を実現するために研究しました。
参考にしたのはGoogleのSSOです。
Googleは一度ログインすると、google.comだけでなく、youtube.com, google.co.jpも別のドメインであるにも関わらず全てログインしておいてくれます。
これをGoogleは、ユーザがログインすると https://accounts.google.com/CheckCookie に一度リダイレクトさせることで実現しています。
このページを反射神経でCtrl+Uソースを表示して参考にしました。
参考URL: view-source:https://accounts.google.com/CheckCookie?continue=http%3A%2F%2Fwww.google.co.jp%2F&hl=ja&chtml=LoginDoneHtml&dnConn=https%3A%2F%2Faccounts.youtube.com&pstMsg=1
ダメだった方法
1, 親htmlの中に作った子iframeの中でXMLHTTPRequestを使ってcookie.phpにAjax通信してCookieをセット
2, 親htmlの中に作った子iframeの中の孫iframeの中でXMLHTTPRequestを使ってcookie.phpにAjax通信してCookieをセット
<?php $name = "test"; $value = "valuetest"; header("P3P: CP='UNI CUR OUR'"); //IEのP3Pルール対策 setcookie($name, $value); var_dump($_COOKIE); ?>
groundchild.htmlのjs文
var xhr = new XMLHttpRequest(); xhr.open('GET', "http://***.***/cookie.php", true); xhr.onreadystatechange = function(){ alert("success"); }; var result = xhr.send(null);
成功した方法
3, 親htmlの中に作った子iframeの中でCookieをjavascriptでセット
4, 親htmlの中に作った子iframeの中の孫iframeの中でCookieをjavascriptでセット
<html> <head> <script> document.cookie = "sampleName=sampleValue"; </script> </head> </html>
これが一番おすすめです。
5, 親htmlの中に作った子iframeの中にフォームを作ってHTTPリクエストをcookie.phpになげる
6, 親htmlの中に作った子iframeの中の孫iframeの中にフォームを作ってHTTPリクエストをcookie.phpになげる
groundChild.html
<form id="cookieform" method="POST" action="http://example.com/cookie.php"> </form> <script type="text/javascript"> document.getElementById("cookieform").submit(); </script>
非常に参考にした書籍たち。作者様ありがとうございました。
- 作者: 徳丸浩
- 出版社/メーカー: SBクリエイティブ
- 発売日: 2011/03/01
- メディア: 単行本
- 購入: 119人 クリック: 4,283回
- この商品を含むブログ (146件) を見る
- 作者: ウェド・アルコーン,クリスチャン・フライコット,ミシェル・オーラ
- 出版社/メーカー: 翔泳社
- 発売日: 2016/03/15
- メディア: Kindle版
- この商品を含むブログを見る
HTML5 Hacks ―インタラクティブWebアプリケーションのためのテクニック
- 作者: Jesse Cravens,Jeff Burtoft,大岩尚宏(技術監修),出葉義治
- 出版社/メーカー: オライリージャパン
- 発売日: 2013/10/26
- メディア: 単行本(ソフトカバー)
- この商品を含むブログ (3件) を見る