
Googleサイトで作るグループウェア(57)ーAppSheetをサイトに埋め込んで動かすー
この記事を読んで欲しい方
Googleワークスペースを導入したが上手くDXに応用できていない方
Googleワークスペースを導入しようと考えてる中小企業の担当者
Gmailやクラウドアプリだけ使っているテレワーカー
GIGAスクールでGoogleエデュケーションを導入している学校の先生
NEXT GIGAスクールで何をしていいか分からない偉い人
Googleエデュケーションで目玉がほしいGoogleの中の人
ノーコードに興味がある人
AppSheetに興味がある人
①AppSheetをGoogleサイトに埋め込みたいがうまく動かない
AppsheetはGoogleが提供しているノーコード・データベースアプリです。
Googleスプレッドシートやエクセルのような表シートを保存用データベースにして、パソコン、スマホ、タブレットなど、デバイスを選ばずに動かせる画面を、半自動的に作成してくれます。
ただし英語版しかないので、英語が苦手な方にはおすすめしませんが、Chromeの画面翻訳を使ってそこそこ内容が分かるので、興味がある方は挑戦してみてください。(アプリ自体は日本語表示で作れます。アプリを作る画面が英語版しか無いのです)

さて、Appsheet社がGoogleに買収された後に、Appsheetで作られたアプリがGoogleサイトに埋め込めなくなりました。(以前はiframeで埋め込めていましたが、現在はエラーになります。)
これは特にセキュリティー強化上の問題で起きていると考えられます。
そのため、グループウェアに組み込む場合は、外部アプリのように機能アイコンからURLリンクでAppsheetアプリに飛ばすしか方法がありませんでした。(この方法でも全く問題はありませんが、やっぱり埋め込みたい!)
②朗報が飛び込んできた
実は、ある方から教えていただいたのですが、どうやらエラーを回避する方法があるようです。
つまり、AppsheetアプリをGoogleサイトに埋め込む手段があるということです。(ありがとうございました!)
Googleサイトでグループウェアを作ろうとしている私には、ノーコードでアプリが作れるAppsheetが埋め込めるのは、まさに鬼に金棒の情報でした。
③Appsheetのサインインを外す
さて、本題に入りますが、Appsheetアプリは標準では最初にログイン(サインイン)した情報(名前やメールアドレス)を取得して動作するため、サインインが必須なのですが、Googleサイトに埋め込むと、このサインインの動作で弾かれてしまう様です。
つまり、このサインインの動作をOFFにすれば良いのです。
では実際にどのようにするのか、具体的にやってみましょう。
まずAppsheetに入ります。
テンプレートからSimple Surveyを選んでcopyボタンを押してください。

自分の場所(Owned by me)にSimple Surveyアプリをコピーしてきました。

コピーすると、Googleドライブのマイドライブ直下にappsheetフォルダが作られます。
マイドライブ>appsheet>data>アプリ名の中に、データが溜まっていきます。
データベースはGoogleスプレッドシートで、画像や添付ファイルはフォルダが作られて、その中に入っていきます。(アプリ本体はクラウド上の画面の中にあります。データだけがGoogleドライブに置かれます)


③Simple Surveyアプリの編集
これはSimpleSurveyをダブルクリックで開いた時の編集画面です。
左のサイドメニューのSecurity(盾のマーク)をクリックします。
Require sign-inの画面を見てください。

サインインの設定を変更するトグルスイッチを、
Require user signin? > OFF
Yes, the data in this app is public > ON
Yes, I am authorized to set up an insecure app > ON
にします。
終わったら、右上のSAVEボタンを押して保存してください。

この画面の中に More infoというところがありますので、クリックして、更にAlternatives to requiring sign-inをクリックします。
この中にはサインインを行わないで、アプリを作る方法がいくつか書かれていますので、アプリを作る方は応用してみてください。
④AppsheetアプリのURLの取得
さて、実際にアプリを動かしてみます。
スマホのマーク(view)をクリックして、画面右上のななめ矢印のopen in tabをクリックしてください。

ブラウザーでアプリが起動しますが、この時のURLをコピーします。

⑤Googleサイトに埋め込む
Googleサイトの編集画面を開き、挿入>埋め込む>URLで、AppsheetのURLをペーストします。
ページ全体を選び、挿入をクリックします。

Googleサイトに貼り付けられました。プレビューで表示します。

プレビューで表示すると、最初にダイアログが表示され、いろいろな注意点が書かれています。この画面からACCEPTボタンを押します。プレビューの黒メニューと重なるのでずらして押してください。(これは一番最初だけです)

Appsheetアプリが読み込まれ、Googleサイトの画面内で動くようになりました。

アプリ画面をスクロールすると、色々なデータの入力画面が出てきます。
このアプリをスマホで動かすと、カメラと連動して写真が取り込めます。
また、ファイルが添付できたり、サイン(シグネーチャー)の書き込みもできます。(埋め込んだアプリのカメラ連動は動かないと言われていましたが、カメラ連動もシグネーチャーもiPadのブラウザー画面(chrome)で動くことを確認しました。)
入力したデータは、Googleドライブの中に保存されます。

⑥セキュリティーとユーザー数問題
以上のように、夢のようなグループウェア環境が作れることがわかりました。
ただ、Googleがしきりにセキュリティーが甘くなるよと言っているのですが、Googleサイトで、外部公開しない会社内グループウェアの中で使っている限りは、アプリ設計の工夫さえすればサインインしない運用でも問題にはならないでしょう。(機能アイコンからURLリンクで飛ばせば、こういう事はしなくてもセキュリティー保持したままAppsheetアプリは動かせます。)
もう一つは、このやり方で、ユーザー数がどれくらい使えるのか明確になっていませんが、通常であればフリー版でデプロイ(公開)しなければ10名までは利用できると思います。
また、Googleワークスペースの有料版では、Appsheet Core 版が無料で使えるので、社員の数だけ利用可能になると思います。
残念ながら、学校ではEducation Standard以上でないと使えません。(フリー版は使えますが人数は10名までです)

参考: