
App Inventor 使用最新試算表元件 Spreadsheet_Part 2
在上一篇教學,我們使用了 Spreadsheet 元件讀取了 Google 試算表的資料,如果只是要做最基本的讀取全部資料,只要將試算表的 ID 設定給 Spreadsheet 元件即可,但是如果我們要用到元件的其它功能,就必須申請一個 Google 開發者帳號,且還要在試算表及 App Inventor 做設定才行,所以第二篇教學我們就來完成上述動作,等第三篇再來介紹元件的其它有趣的功能!
這一篇教學會延續上一篇用到的 App Inventor 專案
1. 進入下方網站,申請一個 Google 開發者帳號。
P.S. 因為我已經申請過了!所以這裡審略申請過程,如遇到問題歡迎留言詢問,我再額外寫一篇教學。

新建一個專案

接著照著我輸入

專案建立好之後,進入專案頁面。

接下來要啟用 Google Sheets API
2. 點選左上角的導覽選單,再點選「API 和服務」。

點「啟用 API 和服務」

輸入「Google Sheets API」後搜尋

點選「啟用」

這樣就完成啟用 Google Sheets API 了!
但是只有啟用還不夠,我們還必須建立「憑證」才可以使用這個 API。
所以接下來我們來建立一個憑證
3. 回到「已啟用的 API 和服務」頁面

將頁面往下捲,找到「Google Sheets API」,點進去。

然後就會進到以下頁面

有沒有看到上方寫著「您必須取得憑證才能使用這個 API,請先按一下 [建立憑證]。」!?
接著我們點它右邊的「建立憑證」按鈕

再來請照著我下方的圖片做操作




這樣就完成囉!
回到「已啟用 API 和服務」畫面,往下滑就可以看到剛剛建立的服務帳戶了!!

再來要下載這個服務帳戶的金鑰,這個金鑰是要上傳到 App Inventor 的。
請點擊剛剛建立的服務帳戶

進入服務帳戶頁面,新增金鑰。


下載金鑰到電腦

到此已經完成在 Google Cloud 的操作了!
接下來只要將 Google 試算表 和這個服務帳戶共用
並上傳金鑰到 App Inventor 就完成前置設定了!!
4. 開啟你的 Google 試算表
點選右上角的共用,於新增使用者欄位輸入剛剛複製的服務帳戶的電子郵件。

選擇為編輯者後,再按傳送按鈕,這樣就完成共用囉!

終於要到最後的階段了
5. 開啟 App Inventor,打開上次的專案並將金鑰上傳

將 Speadsheet 元件的 CredentialsJson 屬性,設為我們上傳的金鑰。

至此所有的前置設定就都完成了!
可以先執行 App 看看
不過如果是開我上次的 aia 執行的話,會發現跑出了錯誤訊息!

這是因為上次我執行 ReadSheet 方法時,sheetName 參數的名稱沒有跟我試算表的一樣。

所以只要修改 sheetName 就可以正常讀取囉!

那麼第二篇教學就到這裡,第三篇我們再來完整介紹此元件的功能。
aia 檔案下載:
Demo 影片:
如果覺得文章內容還不錯的話,麻煩請幫我點個讚!感謝
可以多點幾次喔~~
第一次點讚需使用 Google 或 Facebook 帳號註冊

