<aside class="msg message"><span class="msg-symbol">!</span><div class="msg-content">
<p data-line="1" class="code-line">この記事は毎週必ず記事がでるテックブログ <a href="https://zenn.dev/topics/lgtechblogsprint" target="_blank">Loglass Tech Blog Sprint</a> の31週目の記事です！<br>
1年間連続達成まで残り22週となりました！</p>
</div></aside>
<h1 id="%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB" data-line="5" class="code-line">
<a class="header-anchor-link" href="#%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB" aria-hidden="true"></a> はじめに</h1>
<p data-line="7" class="code-line">こんにちは、ログラスでエンジニアをしている浅井（<a href="https://twitter.com/mixplace" target="_blank" rel="nofollow noopener noreferrer">@mixplace</a>）です。開発チームのいちメンバーとして開発活動を行う傍ら、フロントエンド領域、デザインシステム領域に携わっております。</p>
<p data-line="9" class="code-line">以前、「ファイル選択のダイアログを開くことができない」という相談を受けたことがあり、その事象調査を進めていった際に、企業向けChromeである「Chrome Enterprise」と「Chrome ポリシー」というものが存在することを知りました。</p>
<p data-line="11" class="code-line">公式ドキュメントによると、Chrome ポリシーと呼ばれる設定を行うことで、利用者のブラウザ設定を、IT管理者がきめ細かく制御できるとのことです。</p>
<p data-line="13" class="code-line">本記事では、企業向けWeb ブラウザである Chrome Enterprise について紹介し、後半はフロントエンド関連の技術調査の際に役立つかもしれない確認点について記していきたいと思います。</p>
<h1 id="chrome-enterprise-%E3%81%A8-chrome-%E3%83%9D%E3%83%AA%E3%82%B7%E3%83%BC" data-line="15" class="code-line">
<a class="header-anchor-link" href="#chrome-enterprise-%E3%81%A8-chrome-%E3%83%9D%E3%83%AA%E3%82%B7%E3%83%BC" aria-hidden="true"></a> Chrome Enterprise と Chrome ポリシー</h1>
<p data-line="17" class="code-line">Chrome Enterprise は、企業向けに特化した Chrome となっており、ブラウザ自体の機能は Chrome と同等となっています。<br>
Chrome Enterprise の公式サイトからダウンロードができ、バージョンも最新のものが提供されています。</p>
<p data-line="20" class="code-line">通常版のChromeと異なるのは以下の2点です。</p>
<ol data-line="22" class="code-line">
<li data-line="22" class="code-line">IT管理者が、Chrome ポリシー（設定）を管理・適用できる</li>
<li data-line="23" class="code-line">ブラウザのインストール形態: OSの管理者権限を用いてインストーラーでブラウザをインストールする</li>
</ol>
<p data-line="25" class="code-line">より詳しい情報は、<a href="https://chromeenterprise.google/intl/ja_jp/" target="_blank" rel="nofollow noopener noreferrer">Chrome Enterpriseのサイト</a>をご覧ください。</p>
<p data-line="27" class="code-line"><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__58acedf449654" src="https://embed.zenn.studio/card#zenn-embedded__58acedf449654" data-content="https%3A%2F%2Fchromeenterprise.google%2Fintl%2Fja_jp%2F" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://chromeenterprise.google/intl/ja_jp/" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://chromeenterprise.google/intl/ja_jp/</a></p>
<h2 id="chrome-%E3%83%9D%E3%83%AA%E3%82%B7%E3%83%BC%E3%81%AB%E3%82%88%E3%81%A3%E3%81%A6%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%81%AE%E8%A8%AD%E5%AE%9A%E3%82%92%E7%AE%A1%E7%90%86%2F%E9%81%A9%E7%94%A8%E3%81%A7%E3%81%8D%E3%82%8B" data-line="29" class="code-line">
<a class="header-anchor-link" href="#chrome-%E3%83%9D%E3%83%AA%E3%82%B7%E3%83%BC%E3%81%AB%E3%82%88%E3%81%A3%E3%81%A6%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%81%AE%E8%A8%AD%E5%AE%9A%E3%82%92%E7%AE%A1%E7%90%86%2F%E9%81%A9%E7%94%A8%E3%81%A7%E3%81%8D%E3%82%8B" aria-hidden="true"></a> Chrome ポリシーによってブラウザの設定を管理/適用できる</h2>
<p data-line="31" class="code-line">Chrome ポリシーを管理できるというChrome Enterpriseの特徴がわかったところで、Chrome ポリシーについても少し説明させてください。</p>
<p data-line="33" class="code-line">Chrome ポリシーは「Chromeブラウザの設定を、IT管理者側で管理するための設定群」を指します。</p>
<p data-line="35" class="code-line">ポリシーの中には、例えば、セキュリティ設定、プライバシー設定、拡張機能の管理、ホームページの設定、デフォルトの検索エンジンの設定などが含まれています。</p>
<p data-line="37" class="code-line">このポリシーの仕組みがあることで、社員の皆さんが使うChromeの設定を、IT管理者側で一律で設定・適用できるわけです。</p>
<p data-line="39" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/119a040dab94-20240321.png" alt="Google Adminのスクリーンショット" loading="lazy" class="md-img"><br>
<em>ITシステム管理者がChromeポリシーの設定で用いる「Google Admin」の画面<br>
※画面内の設定値は一例であり、弊社が運用している設定値ではありません</em></p>
<p data-line="43" class="code-line">どのようなポリシーが適用されているかは、Chrome のアドレスバーで <code>chrome://policy</code> と入力することで確認できます。</p>
<p data-line="45" class="code-line">「Chrome Polices」のセクションで適用されているポリシーを確認できます。<br>
※個人利用のChromeですと、なにも設定が適用されていないため空白となります</p>
<p data-line="48" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/44a92ca1f785-20240321.png" alt="Chrome Policyの設定" loading="lazy" class="md-img"><br>
<em>どんなChromeポリシーが適用されているか、ユーザーが確認できる「ポリシー」画面</em></p>
<h1 id="%E3%83%9D%E3%83%AA%E3%82%B7%E3%83%BC%E3%81%AB%E3%82%88%E3%81%A3%E3%81%A6web%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B8%E3%83%B3%E3%82%B0%E3%81%AB%E3%81%A9%E3%81%AE%E3%82%88%E3%81%86%E3%81%AA%E5%88%B6%E7%B4%84%E3%81%8C%E5%87%BA%E3%82%8B%E3%81%8B" data-line="52" class="code-line">
<a class="header-anchor-link" href="#%E3%83%9D%E3%83%AA%E3%82%B7%E3%83%BC%E3%81%AB%E3%82%88%E3%81%A3%E3%81%A6web%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B8%E3%83%B3%E3%82%B0%E3%81%AB%E3%81%A9%E3%81%AE%E3%82%88%E3%81%86%E3%81%AA%E5%88%B6%E7%B4%84%E3%81%8C%E5%87%BA%E3%82%8B%E3%81%8B" aria-hidden="true"></a> ポリシーによってWebブラウジングにどのような制約が出るか</h1>
<p data-line="54" class="code-line">Chromeポリシーで設定をきめ細かく制御できることがわかったことで、具体的にどのようなChromeポリシーがあるのかは、<a href="https://chromeenterprise.google/policies/" target="_blank" rel="nofollow noopener noreferrer">Chrome Enterpriseの公式サイトにあるポリシーリスト</a>で公開されています。</p>
<p data-line="56" class="code-line">一言でまとめるのが難しいのですが、一例を挙げますと、</p>
<ul data-line="58" class="code-line">
<li data-line="58" class="code-line">ユーザー自身がChromeの設定でカスタマイズできる部分のデフォルト設定値の適用</li>
<li data-line="59" class="code-line">シークレットモードの有効・無効</li>
<li data-line="60" class="code-line">タスクマネージャーの有効・無効</li>
<li data-line="61" class="code-line">ダウンロード機能の有効・無効</li>
<li data-line="62" class="code-line">PDFファイルのコンテンツ閲覧機能の有効・無効</li>
<li data-line="63" class="code-line">特定のURLへのアクセス許可・ブロック</li>
<li data-line="64" class="code-line">etc…</li>
</ul>
<p data-line="66" class="code-line">Chromeポリシーの数は200以上あり、IT管理者が非常にきめ細かくChromeの機能を調整できることが伺えます。</p>
<p data-line="68" class="code-line">情報セキュリティの観点で、IT管理者が厳しく制限することもあり得るかもしれません。</p>
<p data-line="70" class="code-line">Web フロントエンドの視点で特に影響が出そうな点は、「Webフロントエンド と OSをつなぐ部分」、いわゆるファイルやデバイスといった領域といえます。</p>
<p data-line="72" class="code-line">以下、具体をいくつか紹介します。</p>
<h2 id="%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%81%AE%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89%E3%83%BB%E3%83%80%E3%82%A6%E3%83%B3%E3%83%AD%E3%83%BC%E3%83%89%E7%B3%BB" data-line="74" class="code-line">
<a class="header-anchor-link" href="#%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%81%AE%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89%E3%83%BB%E3%83%80%E3%82%A6%E3%83%B3%E3%83%AD%E3%83%BC%E3%83%89%E7%B3%BB" aria-hidden="true"></a> ファイルのアップロード・ダウンロード系</h2>
<p data-line="76" class="code-line">Webフロントエンドのアプリケーションにおいて、特定のファイルをアップロード・ダウンロードしたいユースケースは、往々にしてあるかと思います。</p>
<p data-line="78" class="code-line"><strong><a href="https://chromeenterprise.google/policies/#AllowFileSelectionDialogs" target="_blank" rel="nofollow noopener noreferrer">AllowFileSelectionDialogs</a></strong></p>
<p data-line="80" class="code-line">HTML で <code>&lt;input type="file"&gt;</code> で要素を配置すると、ファイル選択ダイアログが表示されますが、このポリシー設定がオフになっていると、ファイル選択のダイアログが表示されず、無条件にキャンセルが押下されたものとなります。</p>
<p data-line="82" class="code-line">過去に「ファイル選択ダイアログが開かずファイルをアップロードができない」事象のお問い合わせを頂いたことがあり、今回の記事執筆のきっかけとなりました。</p>
<p data-line="84" class="code-line"><strong><a href="https://chromeenterprise.google/policies/#DownloadRestrictions" target="_blank" rel="nofollow noopener noreferrer">DownloadRestrictions</a></strong></p>
<p data-line="86" class="code-line">ファイルのダウンロードを制限できるポリシー。<br>
セーフブラウジングで可否を決めたりと、数段階で分けることができます。</p>
<h2 id="%E3%83%87%E3%83%90%E3%82%A4%E3%82%B9%E9%80%A3%E6%90%BA%E7%B3%BB" data-line="89" class="code-line">
<a class="header-anchor-link" href="#%E3%83%87%E3%83%90%E3%82%A4%E3%82%B9%E9%80%A3%E6%90%BA%E7%B3%BB" aria-hidden="true"></a> デバイス連携系</h2>
<p data-line="91" class="code-line">Bluetooth, WebUSB, Web Audio, MediaDevices, Web VR, Web NFC といったWeb API を用いることにより、Chromeと外部デバイス間で連携ができるようになっています。</p>
<p data-line="93" class="code-line">Chromeの設定で、それぞれのWebAPIの利用の有効/無効を個別設定できますが、Chrome ポリシー側でも、IT管理者がURL単位できめ細かく設定できたりします。</p>
<p data-line="95" class="code-line">例えば、 <strong><a href="https://chromeenterprise.google/policies/#AudioCaptureAllowed" target="_blank" rel="nofollow noopener noreferrer">AudioCaptureAllowedUrls</a>, <a href="https://chromeenterprise.google/policies/#VideoCaptureAllowed" target="_blank" rel="nofollow noopener noreferrer">VideoCaptureAllowedUrls</a></strong> といったポリシーによって、音声や映像入力を許可するURLを指定して制御することも可能になっています。</p>
<h1 id="%E3%81%8A%E3%82%8F%E3%82%8A%E3%81%AB" data-line="97" class="code-line">
<a class="header-anchor-link" href="#%E3%81%8A%E3%82%8F%E3%82%8A%E3%81%AB" aria-hidden="true"></a> おわりに</h1>
<p data-line="99" class="code-line">今回は Chrome Enterprise における Chrome ポリシーによってブラウザの挙動が変化するポイントをご紹介しました。</p>
<p data-line="101" class="code-line">ブラウザの動作にまつわる事象調査で「Chrome ポリシーが影響していた」ケースは、私自身も過去数えるくらいしかありません。</p>
<p data-line="103" class="code-line">しかしWebブラウザの挙動として説明がつかない場合に「Chrome ポリシーが影響している事象かどうか？」も観点のひとつとして、頭の片隅に入れておくと良いなと思い、今回記事にまとめました。</p>
<p data-line="105" class="code-line">Chromeポリシーの設定をいち開発者が変更して挙動を確認する機会もありませんが、Chrome Enterprise の技術ドキュメントは、ポリシーの詳細や適用範囲が細かく記載されている点が大変役立ちました。</p>
<p data-line="107" class="code-line">今回はChrome Enterpriseについて紹介しましたが、Microsoft Edgeにおいても「Edge for Business」で同等のサービスが提供されています。<br>
Microsoft Entraアカウントを用いて、企業用のポリシーを適用することが可能となっていますので、興味ある方は <a href="https://learn.microsoft.com/ja-jp/deployedge/microsoft-edge-for-business" target="_blank" rel="nofollow noopener noreferrer">Edge for Business</a> もご覧ください。</p>
<p data-line="110" class="code-line">本記事は以上となります。次回の Tech Blog Sprint 記事もぜひお楽しみに！</p>
<h1 id="%E5%8F%82%E8%80%83%E3%83%AA%E3%83%B3%E3%82%AF" data-line="112" class="code-line">
<a class="header-anchor-link" href="#%E5%8F%82%E8%80%83%E3%83%AA%E3%83%B3%E3%82%AF" aria-hidden="true"></a> 参考リンク</h1>
<p data-line="113" class="code-line"><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__39ad94efbe73e" src="https://embed.zenn.studio/card#zenn-embedded__39ad94efbe73e" data-content="https%3A%2F%2Fchromeenterprise.google%2Fintl%2Fja_jp%2F" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://chromeenterprise.google/intl/ja_jp/" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://chromeenterprise.google/intl/ja_jp/</a><br style="display:none">
<span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__ead4d517ab39" src="https://embed.zenn.studio/card#zenn-embedded__ead4d517ab39" data-content="https%3A%2F%2Fzenn.dev%2Fkatayama%2Farticles%2F32112e22e5b282" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://zenn.dev/katayama/articles/32112e22e5b282" style="display:none" target="_blank">https://zenn.dev/katayama/articles/32112e22e5b282</a><br style="display:none">
<span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__c2ea88232740b" src="https://embed.zenn.studio/card#zenn-embedded__c2ea88232740b" data-content="https%3A%2F%2Flearn.microsoft.com%2Fja-jp%2Fdeployedge%2Fmicrosoft-edge-for-business" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://learn.microsoft.com/ja-jp/deployedge/microsoft-edge-for-business" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://learn.microsoft.com/ja-jp/deployedge/microsoft-edge-for-business</a></p>


エンジニアが企業向けWebブラウザと向き合う: Chrome ポリシーとWebブラウジングにおける挙動の変化

Chrome ポリシーによってブラウザの設定を管理/適用できる

Chrome Enterprise と Chrome ポリシー

ファイルのアップロード・ダウンロード系

ポリシーによってWebブラウジングにどのような制約が出るか

Discussion