iframeのクロスドメイン事情

iframe越しの別ドメインでのcookieのやりとりに四苦八苦しました。

前提条件

  • iframeの呼び出し元と先でサーバドメインが異なる
  • 2つのサーバは両方編集可能 (わるいことしたいわけではない)
  • サーブレットにおいてcookieはsubmit時に送信される [参考]
  • サーバ1のアプリケーションにサーバ2の画面のパラメータを渡したい
    …が、クロスドメイン制約に引っかかる

やりたいこと

  • サーバ1 (srv1.example.co.jp)
  • iframeの呼び出し元
  • アプリケーション処理する
  • サーバ2 (srv2.example.co.jp)
  • iframeの呼び出し先
  • 画面にパラメータ入力する

サーバ1側からiframeタグでサーバ2側の画面を呼び出しています。

クロスドメイン制約により、基本的にサーバ1⇔サーバ2のパラメータはやりとりできません。

が、親フレームから子フレームのJavaScriptを呼び出すことは可能です。数少ない例外にあたります。

もっとも、ChromeFirefoxでは普通に参照できないエラーとなります。IEだけなぜか通ります。hostsとかいじる必要がありますが。

 

本来であれば、サーバ1側にsubmit処理を書き、JavaScriptを通じてパラメータを拾うほうが楽かもしれませんが、諸事情によりサーバ2側のファイルは複数人でメンテナンスされる可能性があるので、なるべくシンプルにしたいです。

そこで、サーバ2側のsubmit時にサーバ1側の特定の関数を呼んでもらうルールだけ設定し、サーバ1側でパラメータチェックしたりcookie書いたりすることにしました。

起こったこと

  1. サーバ2でsubmitする。その際にサーバ1の関数hoge()を呼ぶ
  2. 関数hoge()でdocument.cookieに送りたいパラメータを書き込む
  3. submitを行いサーバ1のアプリケーションの処理を実行する

このときに、document.cookieに書いたパラメータが渡ってきませんでした。

アプリケーションでcookie情報の取得を試した際は受け取れていたのですが、そのときはサーバ1側のファイルからsubmitしていたようです。

 

IEの開発者ツール(F12)でcookie情報を確認してみると、確かにhoge()内で書いたパラメータがcookieに書き込まれているのですが、ドメインsrv2.example.co.jpとなっていました。

つまり、サーバ1側の関数でcookieを書いたとしても、関数を呼び出した側のドメインで書き込まれるということになります。

…まぁ、jQueryなどの外部スクリプトを使ってcookieを書いたときに、jQueryが置かれているサーバのドメインで書かれても困りますね。確かに。

 

悩みましたが、cookieの書き込みをちゃんと調べてみると、パラメータの他にドメインを指定して書き込めるようです。

Cookieの書き込み - とほほのCookie入門

document.cookie = "param=fuga; domain=.example.co.jp"という感じで、cookieのスコープを少し広げて渡すことで上手く取得できました。