iframe は、ある Web サイトのコンテンツを別の Web サイトや HTML ページに埋め込むための Web 技術です。 この目的では HTML タグ <iframe> が使用され、多様な構成やプロパティで作成可能です。
ArcGIS のインターフェイスや機能を他のビジネス システムに統合する際、一般的なパターンの 1 つとして、ArcGIS Instant Apps や ArcGIS Experience Builder、または Maps SDK for JavaScript で構築されたアプリなどの Web アプリを、iframe を使って別のビジネス システム アプリケーションに埋め込む方法があります。
<iframe> を明示的に定義するコードや HTML を記述することもあれば、iframe 処理を行う埋め込みウィジェットまたはツールのようなパターンがシステムに備わっていることもあります。その場合、iframe に対して追加の制限が課されたり、設定できる iframe タグ属性が制御されることがあります。
このパターンでサポートされるワークフローの例には、次のようなものがあります:
店舗の場所や一般的な地理フィーチャを見つけるために、より大きな Web ページにロケーター マップを埋め込む
編集可能な Web マップとアプリを作成し、フォームベースや他の技術で構築された、より大規模な別のデータ収集プロセスや設定プロセスに埋め込む
データを収集したり、より広範なワークフローに参加する Web サイトまたはアプリケーションの一部として、URL を使用して ArcGIS Survey123 のフォームを表示する
この機能とそのベスト プラクティスは、ArcGIS アプリケーションが他の ArcGIS アプリケーションに埋め込まれるシナリオにも適用されます。
| 機能 | ArcGIS Online | ArcGIS Enterprise | ArcGIS Location Platform | ArcGIS Pro |
|---|---|---|---|---|
| 別のシステムに ArcGIS アプリを埋め込む | N/A | N/A |
フルサポート 一部サポート
リモート システムでは、<iframe> を使用して、ArcGIS Online や ArcGIS Enterprise のアプリケーション、または ArcGIS Maps SDK for JavaScript で構築されたカスタム アプリケーションを埋め込むことができます。
多くの ArcGIS Web アプリでは、URL パラメーターを通じて定義される、読み込み時に構成可能なプロパティがサポートされています。たとえば、https://my.domain.com/portal/home/apps/viewer.html?center=-54,120&zoom=5 と指定すると、アプリはそれらの座標を中心にし、縮尺レベル 5 にズームします。 この統合パターンを使用する場合、親アプリケーションやビジネス システム アプリケーションのプロパティを使って、これらの URL パラメーター (iframe アプリケーションの読み込み方法を制御する) を動的に設定することが一般的です。 たとえば、ユーザーが親アプリケーション内の ID が BD1245 のレコードを非 ArcGIS システムで表示している場合、iframe を定義する際に ../my-app.html?featureID=BD1245 のような URL を含めることで、アプリが読み込まれた時点で対象データがすでに表示され、フォーカスされた状態になります。
これまで、iframe は広く普及してきた技術でありながら、多くのセキュリティー上の課題ももたらしてきました。 そのため、iframe にはさまざまなブラウザーによる制約があり、システム間での機能性や利便性が制限されることがあります。 主な課題は以下のとおりです:
ファイルのダウンロードやアップロードがブロックされる場合がある。 ブラウザーのセキュリティー機能により、iframe からのファイル ダウンロードがブロックされることがあります。この場合、埋め込みアプリのダウンロード リンクやダウンロード ボタンが error や失敗を表示せず、フィーチャ テーブルからのエクスポートなどのファイルが単純にダウンロードされなくなります。 このような問題は、通常、ブラウザーの JavaScript コンソール メッセージを通じて報告されます。
画面サイズがユーザー インターフェイスに悪影響を及ぼす可能性がある。 iframe は、ピクセル単位で固定されたフレーム サイズとして定義されることが多く、埋め込まれるアプリはその想定される表示サイズに合わせて設計される必要があります。 親アプリケーションがユーザーの画面解像度に合わせて iframe を適切に拡大縮小できれば、画面の大きいユーザーはレスポンシブな体験を得られますが、サイズが固定された iframe では小さな埋め込みウィンドウになり、ユーザー エクスペリエンスが損なわれるおそれがあります。 埋め込みアプリは、すべての主要な UI 要素や操作が所定の画面領域内で提供できるように設計されるべきです。