質問編集履歴
3
コード修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -5,29 +5,35 @@
|
|
|
5
5
|
```html
|
|
6
6
|
<!DOCTYPE html>
|
|
7
7
|
<html lang="en">
|
|
8
|
+
|
|
8
9
|
<head>
|
|
9
10
|
<meta charset="UTF-8">
|
|
10
11
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
11
12
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
12
13
|
<title>Document</title>
|
|
13
14
|
</head>
|
|
15
|
+
|
|
14
16
|
<body>
|
|
15
17
|
<p>A. sandboxなし・リンク先：X-Frame-Options: DENY（正しく表示できる）</p>
|
|
18
|
+
<iframe
|
|
16
|
-
|
|
19
|
+
srcdoc="<a href="https://twitter.com" target="_blank">twitter.com</a>"></iframe>
|
|
17
|
-
|
|
20
|
+
|
|
18
21
|
<p>B. sandboxあり・リンク先：X-Frame-Options: DENY（正しく表示できない）</p>
|
|
22
|
+
<iframe sandbox="allow-popups"
|
|
19
|
-
|
|
23
|
+
srcdoc="<a href="https://twitter.com" target="_blank">twitter.com</a>"></iframe>
|
|
20
24
|
<!--
|
|
21
25
|
Chromeの場合の表示
|
|
22
|
-
|
|
26
|
+
|
|
23
27
|
twitter.com はブロックされています
|
|
24
28
|
twitter.com で接続が拒否されました。
|
|
25
29
|
ERR_BLOCKED_BY_RESPONSE
|
|
26
30
|
-->
|
|
27
|
-
|
|
31
|
+
|
|
28
32
|
<p>C. sandboxあり・リンク先：X-Frame-Optionsなし（正しく表示できる）</p>
|
|
33
|
+
<iframe sandbox="allow-popups"
|
|
29
|
-
|
|
34
|
+
srcdoc="<a href="https://example.com" target="_blank">example.com</a>"></iframe>
|
|
30
35
|
</body>
|
|
36
|
+
|
|
31
37
|
</html>
|
|
32
38
|
```
|
|
33
39
|
|
2
補足追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -3,31 +3,46 @@
|
|
|
3
3
|
sandbox属性を維持したままAと同じ挙動にする方法はありますか？
|
|
4
4
|
|
|
5
5
|
```html
|
|
6
|
+
<!DOCTYPE html>
|
|
7
|
+
<html lang="en">
|
|
8
|
+
<head>
|
|
9
|
+
<meta charset="UTF-8">
|
|
10
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
11
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
12
|
+
<title>Document</title>
|
|
13
|
+
</head>
|
|
14
|
+
<body>
|
|
6
|
-
<p>A. sandboxなし・リンク先：X-Frame-Options: DENY（正しく表示できる）</p>
|
|
15
|
+
<p>A. sandboxなし・リンク先：X-Frame-Options: DENY（正しく表示できる）</p>
|
|
7
|
-
<iframe srcdoc="<a href="https://example.com" target="_blank">twitter.com</a>"></iframe>
|
|
16
|
+
<iframe srcdoc="<a href="https://example.com" target="_blank">twitter.com</a>"></iframe>
|
|
8
|
-
|
|
17
|
+
|
|
9
|
-
<p>B. sandboxあり・リンク先：X-Frame-Options: DENY（正しく表示できない）</p>
|
|
18
|
+
<p>B. sandboxあり・リンク先：X-Frame-Options: DENY（正しく表示できない）</p>
|
|
10
|
-
<iframe sandbox="allow-popups" srcdoc="<a href="https://twitter.com" target="_blank">twitter.com</a>"></iframe>
|
|
19
|
+
<iframe sandbox="allow-popups" srcdoc="<a href="https://twitter.com" target="_blank">twitter.com</a>"></iframe>
|
|
11
|
-
<!--
|
|
20
|
+
<!--
|
|
12
|
-
Chromeの場合の表示
|
|
21
|
+
Chromeの場合の表示
|
|
13
|
-
|
|
22
|
+
|
|
14
|
-
twitter.com はブロックされています
|
|
23
|
+
twitter.com はブロックされています
|
|
15
|
-
twitter.com で接続が拒否されました。
|
|
24
|
+
twitter.com で接続が拒否されました。
|
|
16
|
-
ERR_BLOCKED_BY_RESPONSE
|
|
25
|
+
ERR_BLOCKED_BY_RESPONSE
|
|
17
|
-
-->
|
|
26
|
+
-->
|
|
18
|
-
|
|
27
|
+
|
|
19
|
-
<p>C. sandboxあり・リンク先：X-Frame-Optionsなし（正しく表示できる）</p>
|
|
28
|
+
<p>C. sandboxあり・リンク先：X-Frame-Optionsなし（正しく表示できる）</p>
|
|
20
|
-
<iframe sandbox="allow-popups" srcdoc="<a href="https://example.com" target="_blank">example.com</a>"></iframe>
|
|
29
|
+
<iframe sandbox="allow-popups" srcdoc="<a href="https://example.com" target="_blank">example.com</a>"></iframe>
|
|
30
|
+
</body>
|
|
31
|
+
</html>
|
|
21
32
|
```
|
|
22
33
|
|
|
23
|
-
### 補足
|
|
24
|
-
そもそも何を想定したhtmlなんだ、という実装そのもののツッコミもあるかと思いますが、
|
|
25
|
-
あくまで事象理解のためのサンプルですので、挙動について理解できればと思っています。
|
|
26
|
-
|
|
27
34
|
### 各ブラウザの挙動
|
|
28
35
|
Chrome → ブラウザのエラー画面（ブロック）
|
|
29
36
|
Firefox → ブラウザのエラー画面（ブロック）
|
|
30
37
|
Safari → Twitter画面（JavaScriptを使用できません。このブラウザではJavaScriptが無効に...）
|
|
31
38
|
|
|
39
|
+
※リロードしても変わりませんでした。
|
|
40
|
+
|
|
32
41
|
Safariだけ挙動が違いますが、この結果からフレーム禁止だけでなく、
|
|
33
|
-
iframeから別タブで開いた際にsandboxの制約が引き継がれている模様です。
|
|
42
|
+
iframeから別タブで開いた際にsandboxの制約が引き継がれている模様です。
|
|
43
|
+
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
### 補足
|
|
47
|
+
そもそも何を想定したhtmlなんだ、という実装そのもののツッコミもあるかと思いますが、
|
|
48
|
+
あくまで事象理解のためのサンプルですので、挙動について理解できればと思っています。
|
1
補足追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
### 解決したいこと
|
|
1
2
|
下記のBにおいて、なぜ別窓表示にも関わらずiframe内で開いている扱いにされてしまうのでしょうか？
|
|
2
3
|
sandbox属性を維持したままAと同じ挙動にする方法はありますか？
|
|
3
4
|
|
|
4
5
|
```html
|
|
5
|
-
<p>A. sandboxなし・リンク先：
|
|
6
|
+
<p>A. sandboxなし・リンク先：X-Frame-Options: DENY（正しく表示できる）</p>
|
|
6
7
|
<iframe srcdoc="<a href="https://example.com" target="_blank">twitter.com</a>"></iframe>
|
|
7
8
|
|
|
8
9
|
<p>B. sandboxあり・リンク先：X-Frame-Options: DENY（正しく表示できない）</p>
|
|
@@ -19,5 +20,14 @@
|
|
|
19
20
|
<iframe sandbox="allow-popups" srcdoc="<a href="https://example.com" target="_blank">example.com</a>"></iframe>
|
|
20
21
|
```
|
|
21
22
|
|
|
23
|
+
### 補足
|
|
22
24
|
そもそも何を想定したhtmlなんだ、という実装そのもののツッコミもあるかと思いますが、
|
|
23
|
-
あくまで事象理解のためのサンプルですので、挙動について理解できればと思っています。
|
|
25
|
+
あくまで事象理解のためのサンプルですので、挙動について理解できればと思っています。
|
|
26
|
+
|
|
27
|
+
### 各ブラウザの挙動
|
|
28
|
+
Chrome → ブラウザのエラー画面（ブロック）
|
|
29
|
+
Firefox → ブラウザのエラー画面（ブロック）
|
|
30
|
+
Safari → Twitter画面（JavaScriptを使用できません。このブラウザではJavaScriptが無効に...）
|
|
31
|
+
|
|
32
|
+
Safariだけ挙動が違いますが、この結果からフレーム禁止だけでなく、
|
|
33
|
+
iframeから別タブで開いた際にsandboxの制約が引き継がれている模様です。
|