
使用 App Inventor 傳送 Gmail 信件
今天要來介紹,如何使用 IFTTT 這個服務平台,讓 App Inventor 可以不用啟動 Gmail App,直接將信件傳送出去!
老師~~ 到底什麼是 IFTTT 啊!?
IFTTT 簡單來說就是:


那麼接下來就來介紹它的用法!
1. 首先進入 IFTTT 網站
點我進入

2. 點擊網頁右上角的「Log in」按鈕

3. 然後點選最下面的「Continue with Apple, Google, or Facebook」

請選擇「Continue with Google」

選擇要登入的 Google 帳號

登入成功後,請到 My Applets 頁面。

4. 點擊網頁右上角的「Create」按鈕

5. 點擊「If This Add」按鈕

於搜尋框輸入「Webhooks」,並點進去。

再點擊「Receive a web request」藍框

點「Connect」按鈕

Event Name 請輸入「SendGmail」(或是填自己想要的也可以),填完後再按「Create trigger」按鈕。

6. If 完成後,再來請點選下面的「Then That Add」按鈕。

這次請搜尋「Gmail」

點進來後請選擇左邊的「Send an email」藍框

點「Connect」

選擇要連接的 Google 帳號 (之後要傳送的郵件,會從妳選擇的帳號寄送。),還要按允許喔!

7. 在 To address 這裡,請點選右下角的「Add ingredient」按鈕。

選擇「Value1」


CC address 、 BCC address 和 Attachment URL 保持清空
Subject 和 Body 欄位裡的資料請都先刪除,清空後請分別加入「Value2」和「Value3」。

好了之後再點選最底下的「Create action」按鈕

點選「Continue」

最後再點選「Finish」

接著我們要去複製連接時要用的 Key (每個人的都不一樣)
8. 點網頁右上角的人頭框,再點選「My services」。

選擇「Webhooks」

點擊「Documentation」

可以先把 key 複製到記事本;下面的網址就是,等等要設定給網路元件的網址。(等等操作請用自己的 Key 喔!)

接下來要開始設計 App 了!
9. 新增一個 App Inventor 專案,需要元件如下:

要有網路元件喔!
10. 切換到程式設計,拉兩個變數,分別是 key 跟 event。

程式初始化時,要設定網路元件的網址,跟設定請求標頭。

網址格式是剛剛在拿 key 的頁面下面顯示的

11. 當傳送按鈕被點選時,要執行 POST 文字請求。

格式也是照剛剛 key 的頁面的
收件者欄位是 Value1
主旨是 Value2
內容是 Value3

最後當網路元件取得文字時,結束進度框,並顯示回應內容!

App 至此就撰寫完成囉!
趕快去執行看看吧!!
App 執行範例:
如果覺得文章內容還不錯的話,麻煩請幫我點個讚!感謝
可以多點幾次喔~~
第一次點讚需使用 Google 或 Facebook 帳號註冊

