場合によっては、既存のウェブページ内でアプリをホストしたいこともあるでしょう。技術的には、アプリはウェブページに組み込まれる iframe エレメント内にホストされます。実際のところ、これによって、アプリのエミュレータが AppSheet ウェブサイト上で動作します。
ただし、ログインの必要がないアプリしか iframe にはホストできません。また、アプリが iframe にホストされると、一部の機能が動作しなくなります。オフラインでの動作が厳しく制限され、スキャナは動作せず、カメラの動作が変更され、プッシュ通知などのモバイル専用機能が動作しなくなります。
一般公開アプリをウェブページにホストするには以下の操作を行います。
- アプリの ID を取得する - これを簡単に見つけるには、アプリエディタを開き、エミュレータの上の Preview other device sizes というリンクをクリックします。ブラウザの URL バーを確認すると、
www.appsheet.com/template/mobilepreview?appId=b3756bde-b741-4609-bf7d-e2eee77852d6
などの形式の URL が表示されているはずです。このアプリの ID は、b3756bde-b741-4609-bf7d-e2eee77852d6
です。各アプリには一意の ID が割り当てられているため、正しいアプリの ID を取得してください。 - ウェブページに HTML 要素を追加する ---
<iframe src="https://www.appsheet.com/preview/b3756bde-b741-4609-bf7d-e2eee77852d6" />
の形式の iframe のコード構造を使用します。この例のアプリ ID を実際に表示したいアプリの ID に置き換えてください。幅
と高さ
を適宜設定できます。たとえば、スマートフォンのおおよその寸法を表示するには、<iframe src="https://www.appsheet.com/preview/b3756bde-b741-4609-bf7d-e2eee77852d6" width="320" height="568"/>
を試してください。 - ウェブページが開かれるたびにアプリの定義とデータをホストしたアプリに自動更新させたい場合は、「refresh」オプションを設定します。同様に、ホストしたアプリが開かれるたびにホストしたアプリに未保存のデータを破棄させたい場合は、wipe オプションを設定します。以下は、両方のオプションを有効にしたアプリを埋め込む場合の例です。
<iframe src="https://www.appsheet.com/start/b3756bde-b741-4609-bf7d-e2eee77852d6?refresh=1&wipe=1" width="320" height="568"/>