質問内容

静的ページのiframe内で「入力」、「確認」、「送信完了orエラー」と遷移するお問い合わせフォームにおいて、Internet Explorerで確認した時だけ「SCRIPT70: 書き込みできません。」と表示されてしまいます。
ChromeやFirefoxでは問題ないので、IE特有の問題だと思うのですが…。
問題の箇所は把握できたのですが、原因がわからず対処に困っております。

期待する処理

iframe内で画面が遷移した際に、repeater関数の5行目を走らせたいです。

エラー内容

※修正
IEのコンソールに出力されるエラー分は下記の通りです。

SCRIPT70: 書き込みできません。
working (624,9)

working (624,9)は、repeater関数内のif (currentIframeTitle != iframe.contentWindow.document.getElementById('page__title'))
を指しており、このif文を排除すると問題なく処理されます。（if分を排除しているので1フレームに1回実行されますが…）
自分がデバッグした範囲ではcurrentIframeTitleが怪しいのですが…。
静的ページをロードした後の初回実行では、上記のif文もエラー出力されず正しく処理されます。

なお、静的ページと埋め込んでいる子ページは同一ドメイン内に設置しております。
よろしくお願いいたします。

当該コード（再現用の簡易版です）

iframeを埋め込んでいる親ページです。（index.html）

HTML
1
2<!DOCTYPE html>
3<html lang="ja" prefix="og: http://ogp.me/ns#">
4  <head>
5    <meta charset="utf-8">
6    <meta http-equiv="X-UA-Compatible" content="IE=edge">
7    <meta name="viewport" content="width=device-width,initial-scale=1">
8  </head>
9  <body>
10    <iframe class="contact__iframe" src="./iframe.php" style="width: 50%; height: 500px"></iframe>
11    <script src="index.js"></script>
12  </body>
13</html>
14

iframeに埋め込まれている子ページです。（iframe.php）
コードは（https://www.web-officer.com/php/how-to-play-multiple-pages-role-in-one-php-file.php）
上記の記事から拝借してきました。このコードでもエラーが発現しました。

php
1
2<?php
3if($_SERVER['REQUEST_METHOD']=="POST") {
4	$transition = $_POST['transition'];
5	$name = $_POST['name'];
6	if($transition == "first") {
7		$transition = "second";
8	}else if($transition == "second") {
9		$transition = "finish";
10	}
11}else {
12	$transition = "first";
13}
14?>
15
16<?php if($transition == "first") { ?>
17  <title>page1</title>
18  <p>お名前を入力して下さい。</p>
19<?php }else if($transition == "second") { ?>
20  <title>page2</title>
21  <p>下記の内容で送信します。宜しければ「送信」ボタンをクリックして下さい。</p>
22  <input name="name" type="hidden" value="<?=$name?>">
23<?php }elseif($transition == "finish") { ?>
24  <title>page3</title>
25  <p>送信が完了しました。ありがとうございました。</p>
26<?php } ?>
27
28<?php if($transition != "finish") { ?>
29<form method="post" action="">
30	<table>
31  	<tr>
32  		<td>お名前</td>
33  		<td><input name="name" type="text" value="test"></td>
34  	</tr>
35	</table>
36	<input name="transition" type="hidden" value="<?php echo $transition ?>">
37	<input type="submit" />
38</form>
39<?php } ?>

親ページで読み込んでいるスクリプトです。（index.js）
オリジナルのコードを簡略化しております。

javascript
1(function () {
2  'use strict';
3
4  {
5    var iframe = document.getElementsByClassName('contact__iframe')[0];
6    var currentIframeTitle = 0; // -----------------------------------------------
7    // iframe内で画面遷移した際に各関数を一回ずつ実行する関数
8    // -----------------------------------------------
9
10    var repeater = function repeater() {
11      if (iframe.contentWindow.document.body) {
12        // currentIframeTitle変数と表示しているページのタイトルタグを比べて、ページが遷移したかどうかを判定する
13        if (currentIframeTitle != iframe.contentWindow.document.getElementsByTagName('title')) {
14          // この中に一回ずつ実行したい関数を記述して、最後にcurrentIframeTitleに現在ページのタイトルタグを代入する。
15          currentIframeTitle = iframe.contentWindow.document.getElementsByTagName('title');
16          console.log("page transition");
17        }
18      } // requestAnimationFrameで、1フレームに1回実行する
19
20
21      window.requestAnimationFrame(repeater);
22    }; // ---------------------------
23    // ページの読み込み時に実行する処理
24    // ---------------------------
25
26
27    window.addEventListener('load', function () {
28      repeater();
29    }, false);
30  }
31
32}());
33

kei344

2019/11/15 17:53

エラー文も質問に追記されたほうがよいです。

退会済みユーザー

2019/11/15 21:40

問題を再現できる必要最低限のところまで今のコードを削っていって、それをサンプルとして提示できませんか？その過程で原因が分かって自己解決できるかもしれませんし、できなくても回答者が問題を再現できれば解決策を出せるかもしれません。

退会済みユーザー

2019/11/16 13:28 編集

修正依頼ありがとうございます。＞＞kei344様質問内容に記載しております通り、「SCRIPT70: 書き込みできません。」というエラーしか出力されず困っております。エラー内容の欄に全文記載させていただきましたのでご確認いただけますと幸いです。＞＞SurferOnWww様再現用の簡易版コードを追加させていただきました。

行動規範の内容に同意します

回答2件

ベストアンサー

自己解決いたしました。

どうやらIEでは、親ページに変更が無かろうが、要素を変数に代入しようが、iframe内で遷移すると遷移元の要素は読み取れないようです。

他のブラウザでもエラーとなっていれば解決が早まったかもしれません。
逆に他のブラウザはなぜ読み取れるんでしょうか…？

今回は変数（currentIframeTitle）に遷移元の要素を保存し、遷移先で使おうとしていたのが原因でした。

対応策として、変数に「遷移元の要素のinnerHTMLを文字列として」保存することで、遷移先ページでも問題なく使用できました。

投稿2019/11/16 14:55

退会済みユーザー

総合スコア0

試していませんが、iframeのロードを待ってから処理をしないとそのエラーが出るのかもしれません。

【ハタさんのブログ(復刻版) : IEでの「書き込みできません」「アクセスできません」の対処】
https://web.archive.org/web/20130402123946/http://blog.xole.net/article.php?id=649

どうやら、typeof unknownという型(?)はオブジェクトがロード中(初期化中)の場合に、undefinedではなく、unknownという値を返すようだ。

投稿2019/11/16 11:08

kei344

総合スコア69596

退会済みユーザー

2019/11/16 14:55 編集

早速のご回答ありがとうございます。削除済みのアーカイブページまで紹介していただいて分かりやすかったです。コード内に記述してある if (iframe.contentWindow.document.body) {` にてiframeの読み込みを待っています。 console.logを利用してエラー付近で使用している変数などをチェックしてみましたが、unknownは見当たりませんでした。

行動規範の内容に同意します

あなたの回答