Program

iframe先のページが404でないか判定する方法 (javascript)

こんばんは、ころすけ(@wg_koro)です。

キーボード

諸々の理由で、iframe先のページが生きているのか死んでいるのか(404など)、判定しなくてはならなくなりました。

さてどうしよう。iframeは404でもonload走るし、ステータスコード取れないし・・・。

そうだ、postMessage使おう

というわけで、たどり着いたのがpostMessageを使う方法。iframe先が自分のページであることが前提になりますが、こいつを使えばどうにかなる。

あ、「postMessage」はiframeを使って、異なるページ間でメッセージ(文字列)を送受信する仕組みです。クロスドメインであってもOK。IE以外はもちろんのこと、IEも8以上で対応しています。割と広いブラウザで使える技術です。

ページ作って試してみた。
iframe先が生きているかのテスト

上記のページを表示して「iframe先は生きてるよ!」というアラートが出れば、iframe先が生存していることを確認できています。

中身

やっていることは至極簡単。

  1. iframe先の子ページで、読み込みと同時に親ウィンドウにメッセージを送る。
  2. 親ページは、子ページからメッセージを受け取るとアラート表示

「子ページが404などで死んでいたら、メッセージが送られてこないので死んでいると判定する」というロジックです。

実際はアラートを表示させるのではなくフラグをセット。iframeのonload後、一定時間待ってもフラグがONになっていなければ死亡判定…という使い方になります。

ブラウザが少し限定されることと、iframe先のページが自分のコントロール下にあるのが前提となりますが、意外と使えるテクニックだと思いますヨ。

うん、postMessageは応用が色々効いて面白いなー。

Facebook / 広告
2013年09月05日 | Posted in ProgramNo Comments » 

関連記事

コメントを残す

メールアドレスが公開されることはありません。

スパム対策のため、コメントする際は下記の計算式を埋めてください。 計算式の有効期限が切れました。計算式の隣にある再読み込みボタンを押してください。