App Inventor學習記錄122-用google表單,把資料傳到 google sheet上

之前有介紹過怎麼從google sheet中取得資料 ,這次來介紹怎麼在 app inventor中,利用網路元件以及 google表單,把資料傳到 google sheet上
記錄一下:
App Inventor學習記錄122-用google表單,把資料傳到 google sheet上


這次的完成範例如下。

按下按鈕之後,就會把我們輸入在文字輸入盒以及密碼輸入盒的資料,透過 google表單網址文字的組合,把它送到 google sheet中

這個應該是目前比較容易的做法,只要找對使用的網址,用文字方塊排列好就可以了。這次的程式碼很少,會花比較多的篇幅在介紹怎麼取得 google 表單的網址,以及怎麼組合這些東西上。


首先,我們新增一個表單。

在這個表單中,我放入兩個項目,分別是名稱和神奇的數字不能偷改。
要注意的地方有三個。
1. 問題的類型,請選擇簡答
2. 不用勾選必填的選項。我們會在 app inventor的程式中來判斷。
3. 不要出現 password或是密碼的字眼,所以在這裡我用”神奇的數字不能偷改”來代替。不然我們建好的表單過一陣子會出現違反 google服務條款的字樣。


像這樣。

接下來我們按一下上方的回覆

點擊建立試算表
這個步驟其它可以省去,等到有人送出表單資料的時候,其實也是會自動建一個試算表。
這是個人的習慣。


接著選擇建立新試算表,或填入試算表的名稱後,按下下方的建立

這樣就完成建立試算表的動作,以後只要有人填好表單,就會把資料存到我們設定的這個新的試算表中。


打開這個新建好的試算表。

第一欄的內容都固定是時間戳記。
從第二欄開始,就會根據我們表單題目的順序,依序的出現。

我們也可以先建立一個空白的試算表之後,再依次點擊工具->建立表單的方式,來建立一個新的表單。


接著我們回到我們的表單中,點擊右上角的更多選項


點擊取得預先填入的連結

如果找不到這個選項的話,請注意一下網址連結的最後面,是不是有 edit,長的像下面這樣。
https://docs.google.com/forms/xxxxxxxxxxx/edit


點擊取得預先填入的連結之後,會打開一個新的視窗。

https://docs.google.com/forms/xxxxxxxxxxx/prefill
這個時候的網址是上面這樣,跟剛剛的網址只差在最後的結尾處。

我們先把問題都先填上資料,這樣等一下在拆分的時候,會看的比較清楚。
資料填完之後,我們再按下下方的取得連結


這個時候,畫面下方會跳出一個黑底白字的訊息出來。

點擊複製連結


然後,我們把複制下來的連結,貼到記事本上備用。

這一串網址中,我們會用到幾個字串。我把它給列下來。
1. ?usp=pp_url,這個是固定的字串。
2. &entry.1685140301=,這個是名稱這個問題的識別 id。
3. &entry.437976299=,這個是神奇數字不能偷改這個問題的識別 id。


接著我們打開 google硬碟中,表單所在地的資料夾。


我們在表單的上面按滑鼠右鍵後,點擊取得連結


按下複製連結

複製下來的這個連結,就是這個的填寫網址。


我們打開這個網址。

問題給填上後,按下提交按鈕,測試一下


這樣就完成表單提交的動作。

這個時候,我們可以確認一下,在對應的試算表中,有沒有取得一筆資料。
如果有的話,代表前面的步驟都對了,填完表單中的資料後,就可以存到 google sheet中。


接著,我們複製一下這個時候的網址。把它貼到。剛剛的記事本上比較一下。

到這裡,我們就已經取得我們需要的所有資料,接下來就是組合的問題。
我們來組合一下這兩個網址。
首先,我們複製下面這串結尾是 formResponse的網址。像下面這樣。
https://docs.google.com/forms/xxxxxxxxxxx/formResponse

然後,再這個網址之後,加上我們剛剛複製下來的三個字串。三個字串的說明如下。
1. ?usp=pp_url,這個是固定的字串。
2. &entry.1685140301=,這個是”名稱“這個問題的識別 id
3. &entry.437976299=,這個是”神奇數字不能偷改“這個問題的識別 id

組合完成之後的網址會長的像這樣
https://docs.google.com/forms/xxxxxxxxxxx/formResponse
?usp=pp_url&entry.1685140301=TextBox1.text&entry.437976299=PasswordTextBox1.text

TextBox1.text的部份,就是等一下在程式中放文字輸入盒的文字。
PasswordTextBox1.text的部份,就是等一下在程式中放密碼輸入盒的文字。


接下來後進入到 app inventor的畫面編排這裡。

分別放上文字輸入盒、密碼輸入盒,按鈕,以及最重要的 web網路元件


程式的部份就是這樣。

when button 1.click,當按鈕按下的時候。
set web1.url to把網路元件的網址,設定成文字方塊的組合。
這裡文字方塊的組合依次是下面這樣子。
https://docs.google.com/forms/xxxxxxxxxxx/formResponse
?usp=pp_url
&entry.1685140301=
TextBox1.text
&entry.437976299=
PasswordTextBox1.text

最後在 call web1.get,這樣就會把資料從 google 表單中送到 google sheet上了。
實際的效果,請參考最上面的 gif範例。


再補一張圖片來看。


這裡的重點在於,每一個表單的網址都是不一樣的。所以請複製自己表單的網址使用。

另外呢,每一個問題的識別 id,也就是 &entry.xxxxxxx=這個字串的數字,也都會是不一樣的,所以我們要先找到表單中,每一個問題的識別 id之後,再去組合我們的網址。

我本來是想用 firebse讓使用者可以自行的註冊。但是後來發現,這不符合我的需求。
因為在查資料的時候,太麻煩了,應該改用 google sheet來整理會比較表。
在表單的地方,就可以多增加一些訊息的欄位,這樣資料填一填之後,在管理上會比較方便。

接下來要做的是,用這個表單產生的資料,去做檢查帳號的動作。

這次的 aia檔的下載連結如下:
NO_122_google_forn.aia

參考書籍請見博客來書籍介紹頁面:
手機應用程式設計超簡單 App Inventor 2零基礎入門班
TQC+ 創意App程式設計認證指南
TQC+創意App程式設計認證指南解題秘笈
手機應用程式設計超簡單:App Inventor 2初學特訓班
手機應用程式設計超簡單:App Inventor 2小專題特訓班
手機應用程式設計超簡單:App Inventor 2資料庫專題特訓班

之前介紹過的一些 appinventor的使用記錄,都整理在下面這個頁面上了。
APP INVENTOR學習記錄及資源整理頁面

發表迴響