原著：李立源 Lee Lup Yuen／譯者：賴梓仁 Upton Lai
如果您可以將您以電池供應電力的 BBC micro:bit 設置在城市裡的任何一個角落來收集感測資料，或者是隨時查看從家裡、學校、工作場所即時更新的感測資料，不是很酷嗎？thethings.iO 是一朵物聯網的雲，它讓您可以即時顯示感測資料及裝置所在位置。thethings.iO 接收從 micro:bit 傳送來的感測資料（例如：透過 Sigfox 物聯網），並透過電腦或手機裡的網頁瀏覽器將感測資料即時顯示出來。透過以下的教學，各位將會學習到：
- 建立 thethings.iO 帳號（免費試用）
- 設置 Sigfox 後台來將 micro:bit 的感測資料傳送給 thethings.iO
- 在 thethings.iO 上建立一個物件來代表我們的 micro:bit 與其感測器
- 安裝雲端程式（JavaScript）好讓 thethings.iO 能夠解析出感測資料
- 在 thethings.iO 上驗證解析後的感測資料
- 在 thethings.iO 上建立儀表顯示板來顯示即時更新的感測資料
- 加入一張地圖來顯示 micro:bit 大概的位置
thethings.iO 儀表顯示板將感測資料與裝置所在位置即時顯示出來
只是，micro:bit 沒有 GPS 或 WiFi 定址功能，我們如何得知裝置的所在位置呢？這就是像 Sigfox 這種現代物聯網網路之所以神奇的地方囉。
物聯網裝置的定址
物聯網網路的運作模式與行動電話網路相同（有訊號塔與基站）。物聯網網路可以用相同的三角定位法（參考多個基站接收到的訊號強度）找出裝置的大概位置。
或是簡單說來，當我們聽見一聲巨響，因為每隻耳朵感受到的響度不同，所以我們能夠約略知道聲音是從哪個方向傳來。現在想像一下，如果我們有第三隻耳朵（假設它在正確的位置上），加上它所感受到的響度更能讓我們將音源從特定方向限縮到特定位置，這就是我們所指的三角定位法，透過物聯網裝置發送出的訊息來找到它的大概位置，好比我們用了三隻或更多耳朵（基站）聆聽聲音後，推估出音源的所在位置一樣。
Sigfox 定址的範例，請注意，精度半徑為 3.2 公里
在某些區域，物聯網網路計算出來的裝置位置可能會偏差到一公里或是更多。我們無法獲取物聯網裝置的精確位置，而是只能知道裝置約莫落在哪個區塊附近。
如果您正在教授 micro:bit，而且學生們已經在市中心佈滿了 micro:bit 感測裝置，那麼您就能使用物聯網網路的定址功能來確認裝置是否佈署在正確的鄰里之內，然後以裝置的大概位置，監控裝置是否被偷或是被當成垃圾給處理掉（我的學生就有發生過這種事）。
將 micro:bit 設置成一個物聯網感測裝置，裝進從大創百貨買來的珠寶盒做保護
教材需要的材料
- 一片已經設置成物聯網感測裝置且能將感測資料上傳到 Sigfox 網路的 BBC micro:bit 開發板，可參考【Tutorial】連接 BBC micro:bit 與 Sigfox 物聯網。
- 為了要在 micro:bit 上使用 Sigfox 定位服務（又名 Sigfox Atlas），您可能需要額外選購定位服務（與您在地的 Sigfox 營運商確認），即使沒有 Sigfox 定位服務，您還是可以看到 micro:bit 上傳的感測資料（只是沒有位置圖而已）。
建立 thethings.iO 帳號
- 註冊 thethings.iO 帳號
- 點擊 Start Your Free Trial
- 填入您想要的 thethings.iO 使用者名稱、電子郵件，以及 thethings.iO 密碼，點擊 Create A Free Account
4. 註冊完成後，點擊左側功能列裡的 Things（第二個圖示）
稍後我們將在物件頁面看到我們的 micro:bit 裝置，因為我們使用的 micro:bit 就是「物聯網」所意指的 「那個物件」。首先，我們要建立一個裝置集來收納我們的 micro:bit，在 thethings.iO 裡，稱呼這種裝置集為物聯網產品 （IoT Product）。
建立物件
1. 在 Things 頁面上，點擊 Create New IoT Product
2. 將名稱設定為 microbit、格式設定為 Sigfox，點擊 Create
3. 點擊 microbit 產品旁的 Details
記下 Callback URL 以及 Geolocation URL –它們專屬於您的 thethings.iO 帳號，等會我們會將這兩個網址複製到 Sigfox 後台的設定裡。
我們已經將 micro:bit 設定成物件了嗎？還不完全。thethings.iO 有個有用的功能是：當 thethings.iO 接收到新的 Sigfox 裝置上傳第一則訊息時，會自動建立起對應的物件。所以，接下來我們會設置 Sigfox 後台來將 micro:bit 訊息傳遞給 thethings.iO，並因此啟動 thethings.iO 的物件建立。
設置 SIGFOX 後台
1. 以一個新瀏覽器視窗開啟 Sigfox 後台，並以您的 Sigfox 帳號登入後，點擊上方功能列裡的 Device Type
2. 找到您的裝置後，點擊裝置右側的連結
3. 點擊左側功能列裡的 Callbacks，點擊右上角的 New
4. 點擊 Custom Callback
5. 依上圖內容所示，填入 Type、Channel、Use HTTP Method 等 Callback 欄位，並且將稍早我們從 thethings.iO 紀錄下來的 Callback URL 複製到 URL Pattern 欄位，以預設值 application/x-www-form-urlencoded 完成 Content Type 的欄位設定，點擊 OK
6. 我們已經建立好 Callback，而 Sigfox 後台會依據這個 Callback 設定來將我們的 micro:bit 訊息傳遞到 thethings.iO，接下來我們要為 Sigfox 定位設定另一組 Callback
先點擊右上方的 New，再點擊 Custom Callback。
7. 依上圖內容所示，填寫 Type、Channel、Use HTTP Method 等 Callback 欄位
如果 GEOLOC 選項無法啟用，表示您沒有選購 Sigfox Atlas 定址服務。點擊Cancel 並略過以下步驟。將稍早我們從 thethings.iO 紀錄下來的 Geolocation URL 複製到 URL Pattern 欄位，以預設值application/x-www-form-urlencoded 完成 Content Type 的欄位設定，點擊 OK。
您應該可以看到兩個 Callbacks 設定：一個是 Sigfox 訊息使用，另一個則是Sigfox 定址使用。thethings.iO 可以開始接收由我們的 micro:bit 上傳的訊息及定址資訊了。
8. 點擊上方功能列裡的 Device。點擊您的裝置編號後，在點擊左側功能列裡的 Messages
將 micro:bit 開機。如下圖所示，確認 micro:bit 可以傳送訊息給 Sigfox。若是可以上傳訊息到 Sigfox，Callbacks 欄位將會以綠色呈現。
接著，我們透過安裝名為 sigfox_parser 的雲端程式碼來告訴 thethings.iO 應該如何解析我們上傳的訊息（如 0038028012709870）。一則訊息實際上包含了四種感測數據。
安裝雲端程式
1. 回到 thethings.iO 瀏覽器視窗
點擊左側功能列裡的 Cloud Code（第四個圖示）。
2. 往下滑動 Cloud Code 頁面，直到您看到 sigfox_parser 字樣，然後點擊 Edit
3. 點擊連結，然後複製連結中的內容 （一個 JavaScript 函式）
4. 將 sigfox_parser 函式，貼上並覆蓋 Code 欄位裡的所有內容（如上圖所示），點擊 Save
完成上述步驟，解析感測器訊息用的雲端程式碼就已經安裝完成。
解析感測訊息
我們剛剛修改了什麼？sigfox_parser 是 thethings.iO 每每接收到 Sigfox 訊息時會呼叫的 JavaScript 函式，借助這個函式解析出 Sigfox 訊息裡的 12 個位元組資料，分別代表了哪些欄位名稱與感測數值。
如果您看過了 sigfox_parser 內容，您就會知道，micro:bit 程式會傳送 16 個十進制數字（總共 8 bytes）的訊息，其中包含了四種數據（訊息編號與感測器的感測值），而且每種數據都由 4 個十進制數字所組成。
這個 sigfox_parser 函式會用指定的格式解析 Sigfox 訊息。如果您了解JavaScript 語法，可以到這裡看看。
由於 thethings.iO 允許我們上傳各自的 JavaScript 程式碼到他們的雲端伺服器，著實給了我們無限的靈活度來整合我們自行選用的資料庫、應用程式、系統，甚至是整合其他雲端服務（如 Amazon Web Services）也都可以。
訊息解析的驗證
1. 驗證在 sigfox_parser 裡的程式碼是否有正確地解析 micro:bit 訊息。點擊左側功能列裡的 Things，在 microbit 產品列裡，點擊 Details。
2 這裡應該要有個物件用來代表我們的 micro:bit，而且這個物件是由thethings.iO 在接收到 micro:bit 第一則 Sigfox 訊息時自動建立的。
點擊 Details。
3 往下滑動到 Thing Details 頁面的末端，有個大的對話視窗，點擊左上角的 dropdown 下拉式選單，選取感測器：tmp （溫度）、lig （光線強度）、acl （加速度）。接著，您將會看到一張圖表，顯示著已經接收並解析得來的感測值。如上圖所示。
如果溫度感測值看起來還算合理，那麼 Sigfox 訊息解析肯定有被正確地執行。此時，我們已經可以在 thethings.iO 上看到一個代表著 micro:bit 的物件，而且物件有著有效的感測值。
在 thethings.iO 中使用物件的重點是什麼？想當然，是因為我們能將物件裡的感測資料具體化，所以，接下來，我們要建立儀表顯示板來將 micro:bit 的感測資料顯示出來。
顯示感測資料
1 點擊左側功能表裡的Dashboard （第一個圖示）
儀表顯示板會以展示用的圖形界面進行初使化，並且提供許多呈現感測資料的圖示選項。
讓我們移除展示用的圖形界面。
2 點擊右下角的 Edit Dashboard
3 每個圖形界面的右上角都有個 ❎ 圖示
點擊每個圖形界面的 ❎ 圖示來移除所有的圖形界面。
4 點擊右下角的 Save Dashboard 來儲存清空後的儀表顯示板
5 點擊右下角的 Add Widget
6 依下圖內容所示，設置新的圖形界面，溫度圖形界面將以折線圖來顯示歷史溫度值。
每一顆 Sigfox 收發器都有一組獨一無二的編號，將連接 micro:bit 的這組Sigfox 裝置編號填入 Thing 欄位。
點擊 Customise It。
點擊 Custom Parameters 彈跳視窗裡的 Done。
7 我們有能夠即時更新的 micro:bit 溫度曲線了！
重覆上述 Add Widget 步驟來建立光線強度的圖形界面。
將 Widget Name 設定為 Light Level。
將 Resource 設定為 lig。
重覆上述 Add Widget 步驟來建立加速度的圖形界面。將 Widget Name 設定為 Acceleration。將
設定為 acl。
8 恭喜–現在您可以查看即時從 micro:bit 傳來的串流感測資料了，而且還能透過任何網頁瀏覽器查看您的 micro:bit，甚至是使用 iPhone 與 Android 手機來查看也都不成問題。
顯示裝置位置
1. 最後一項任務，我們要加入一張地圖來顯示 micro:bit 的約略位置 （假設我們已經完成了先前提過的定位 Callback 設定）。
點擊儀表顯示板上的 Add Widget。
如下圖所示，完成圖形界面的設定。
2. 點擊 Customise It
點擊 Custom Parameters 彈跳視窗裡的 Done。
3. 您可以點擊右下角的 Edit Dashboard 來移動或是調整圖形界面大小，調整完成後，點擊 Save Dashboard。
4. 終於，我們完成了 micro:bit 儀表顯示板的設置。它能即時顯示來自 micro:bit 的串流感測資料，並且查看 micro:bit 的下落。
小結
在我先前的文章已經教會大家如何以 micro:bit 與 Sigfox 模組創作出您專屬的物聯網感測裝置，只是為了要展示物聯網的真正價值，我們還需要合適的圖形界面來呈現感測數值，因此，在這份教材加入了感測資料圖形界面之後，完整的物聯網裝置開發流程也將大功告成。
希望這份教材對你的物聯網開發計劃 － 無論是正在研發的新款物聯網產品或是教授同學的物聯網課程，都能有所助益。
*【譯者】賴梓仁 Upton Lai（uptonlai@gmail.com）電子電路設計界的自由工作者，從創客小物到消費性電子產品都有涉略。
訂閱MakerPRO知識充電報
與40000位開發者一同掌握科技創新的技術資訊！
