IEのブラウザ制御に立ち向かった忘備録

# 概要
IEで動くwebシステムを構築するにあたってIEとしてのブラウザ機能を制限する必要があり、対処方法の忘備録をここにまとめる。

# 使うもの

* IE11
* Javaアプリケーション(今回はSpringBootで試す)

# やりたいこと

下記のIEブラウザ機能が制限された状態で業務システム起動したい。

* アドレスバーを非表示にする
* 戻るボタンと進むボタンは使用させたくない
* メニューバーを非表示にする
* 画面はリサイズ可能

# 検討内容と対処

IE起動時は各バーが初期表示されている。
初期表示時から制限できるかどうか、IEの起動オプションを調べてみた。

[Internet Explorer コマンドライン オプションのまとめ](https://masaog.wordpress.com/2010/01/19/internet-explorer-%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%E3%83%A9%E3%82%A4%E3%83%B3-%E3%82%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AE%E3%81%BE%E3%81%A8%E3%82%81/)

起動オプションがいくつかあるようだが、`-k`のキオスクモードが使えるかもしれない。
ウィンドウキー＋Rでファイル名を指定して実行を表示し、キオスクモードでgoogleを表示してみる。
`iexplore -k http://www.google.co.jp`
ブラウザメニュー機能がまったくなく、純粋はhtml部分だけの画面が表示されている。
内容としては期待値に近しいが、最大化で表示されるわ最小化できないわ、これじゃ使えない。

画面遷移時にブラウザ制限できるかどうかを検討してみた。
`windows.open()`や`window.showModalDialog()`の第３引数に画面サイズ等を指定できるので試してみる。

[MDN-window.open](https://developer.mozilla.org/ja/docs/Web/API/Window/open)
[MDN-window.showModalDialog](https://developer.mozilla.org/ja/docs/Web/API/Window/showModalDialog)

```before1.html
<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>画面起動用</title>
    </head>
    <body>
        <button onclick="showwindow()">画面起動</button>
        <script type="text/javascript">
            function showwindow() {
                var features = 'menubar=no,location=no,resizable=yes,scrollbars=yes,status=no,height=768,width=1280';
                window.open('./after', '_blank', features);
            }
        </script>
    </body>
</html>
```
```after.html
<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>メイン</title>
    </head>
    <body>
        <span th:text="'これはメイン画面です。ようこそ '  +  ${name}"></span>
    </body>
</html>
```
```FlowtestController.java
package hello;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestParam;

@Controller
public class FlowtestController {

	@GetMapping("/after")
	public String main(@RequestParam(name="name", required=false, defaultValue="test") String name, Model model) {
		model.addAttribute("name", name + "さん");
		return "after";
	}
}
```

SpringBootでbefore.htmlを起動し、ボタンをクリックするとafter.htmlはメニューバーとアドレスバーが非表示となった。
画面としては期待通りだが、新しいウィンドウで開くため繊維元画面が残っている。
before.htmlのwindow.openの第２引数を'_blank'→'_self'にすると、画面表示内容だけが変わってブラウザ機能は変化しない。←まぁ、当たり前なんだが･･･
新しいウィンドウで開かれたページはブラウザ制御ができるので、繊維元のウィンドウを削除する。

```before2.html
<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>画面起動用</title>
    </head>
    <body>
        <button onclick="showwindow()">画面起動</button>
        <script type="text/javascript">
            function showwindow() {
                var features = 'menubar=no,location=no,resizable=yes,scrollbars=yes,status=no,height=768,width=1280';
                window.open('./after', '_blank', features);
                window.open("", "_self").close();
            }
        </script>
    </body>
</html>
```

新しいウィンドウを開いた後に、実行していた繊維元のウィンドウを閉じる。
それだけの対応で目的が達成できた。

# まとめ
`windows.open()`や`window.showModalDialog()`の第３引数に画面サイズ等のオプションが可能
IEで動かないhtmlやcssがあるので、使えるタグの確認が面倒←これは主観でした。