控制台- Webduino Blockly 教學

控制台在Blockly 裡扮演輔助性質的角色，內容包含開發人員常用的console、日期、時間和cookie、localstorage...等指令，對於一些進階的開發應用而言，是相當方便的 ... 控制台 控制台在Blockly裡扮演輔助性質的角色，內容包含開發人員常用的console、日期、時間和cookie、localstorage...等指令，對於一些進階的開發應用而言，是相當方便的功能。

打開WebduinoBlockly編輯器(https://blockly.webduino.io)，展開左側目錄「進階功能」，點選「控制台」，可以看到對應的控制台積木。

控制台顯示 控制台顯示是網頁開發人員常使用的除錯方法，有別於將資訊顯示在網頁上，在不影響網頁結構的狀況下，可以直接透過控制台顯示各種測試訊息。

要使用控制台首先要點選Chrome瀏覽器右上角的瀏覽器設定選項(通常是三個點或是三條槓)，滑鼠移至「更多工具」的選項，展開選單後點選「開發人員工具」。

點選開發人員工具之後，在瀏覽器內會分割出一個視窗，視窗內就是開發人員工具，用滑鼠點選「Console」，就可以將文字、資訊顯示在裡面，如果程式有出現錯誤，錯訊訊息也會由這邊顯示。

舉例而言，在「控制台顯示」積木的後方，接上「文字」積木，內容輸入123，執行之後在控制台的Console裡就會看到123出現。

我們也可以隨便放幾個積木上去，如果發生錯誤，就會在控制台裡頭看到紅色的錯誤訊息。

日期與時間 日期與時間的積木，可以讀取電腦的日期和時間並在網頁上顯示。

日期的積木可以透過下拉選單，選擇對應的日期格式，或單純取出年、月、日使用。

時間的積木也可透過下拉選單，選擇完整的時間或單純取出時、分、秒使用。

透過網頁互動區的「顯示文字」積木，可以在執行的時候顯示當下的時間。

由於時間或日期的積木，在個位數的部分沒有「補零」(例如7補零之後變成07)，所以如果有補零的需求，也可以透過變數、邏輯與字串的組合來實現。

範例解答：https://goo.gl/gA9SNE 暫存的儲存和讀取 瀏覽器的暫存功能分成三種：cookie、localStorage和sessionStorage，存在cookie的資訊可以保留到使用者自己清除，存在localStorage的資料可保留到瀏覽器關閉，而存在sessionStorage的資料只能保留在各自的分頁內，分頁關閉就會清除，透過暫存的功能，可以將一些資訊「暫時」由瀏覽器存著，就算沒有資料庫的輔助，也可以簡單實現「儲存」的功能。

儲存的方式很簡單，只要先選擇要暫存到cookie、localStroage或sessionStorage，接著指定名稱和內容文字即可。

如果是同一種儲存方式，名稱必須不同，假設分別有兩段文字，暫存到cookie和localStorage，若名稱都是temp則沒有關係，但如果都要存到localStorage，則名稱不可重複，否則後面儲存的會把前面儲存的資料覆蓋。

舉例來說我們可以將AAA存入localStorage的temp，BBB存入localStorage的temp2，CCC則存入cookie的temp，執行程式之後，這些文字就會暫存到對應的名稱裡。

讀取的時候，只要選擇對應的暫存功能和名稱，就可以將暫存的資料讀取出來。

注意！如果瀏覽器本身有設定清除暫存資料的功能，可能就不會顯示暫存資料。

聯絡我們 如果對於Webduino產品有興趣，歡迎透過下列方式購買： 個人線上購買：https://store.webduino.io/(支援信用卡、超商取貨付款) 企業＆學校採購：來信[email protected]或來電07-3388511。

如果對於這篇教學有任何問題或建議，歡迎透過下列方式聯繫我們： Email：[email protected](如對於產品有使用上的問題，建議透過Email附上照片或影片聯繫) Facebook粉絲團：https://www.facebook.com/webduino/ Facebook技術討論社團：https://www.facebook.com/groups/webduino/ Webduino基礎教學 Webduino開發板 馬克一號(介紹) 馬克一號(初始化設定) WebduinoFly(介紹) WebduinoFly(初始化設定) WebduinoSmart(介紹) WebduinoSmart(初始化設定) 開發板擴充設定 Arduino韌體下載與燒錄 使用WebSocket操控 WebduinoBlockly 認識WebduinoBlockly WebduinoBlockly基本操作 WebduinoBlockly特殊功能 連動多塊開發板 腳位偵測設定 發光元件 LED 三色LED LED點矩陣 輸入輸出 繼電器 蜂鳴器 按鈕開關 震動開關 搖桿 紅外線發射接收 環境偵測 超音波偵測 溫濕度偵測 人體紅外線偵測 聲音偵測 光敏電阻 可變電阻 土壤濕度偵測 三軸加速度計 無線感應 RFID 玩具及馬達 伺服馬達 Webduino綜合應用 元件應用 LED(兩顆交互閃爍) LED(霹靂燈) LED(語音聲控) LED(人臉追蹤) LED(Google表單操控) 三色LED(調色盤) 蜂鳴器(多人協奏) 蜂鳴器(會說話的鬧鐘) 傳感器應用 超音波(改變圖片大小) 超音波(控制LED) 超音波(控制三色LED) 溫濕度(Firebase紀錄) RFID(控制Youtube) 可變電阻(改變Youtube音量) 聲音偵測(吹點矩陣蠟燭) 玩具改造 Smart自走車(組裝步驟) Smart自走車(網頁遙控器操控) Smart自走車(超音波避障) Smart自走車(溫濕度感測車) Smart智慧路燈(組裝步驟) Smart智慧路燈(接線教學) Smart飛天車(組裝步驟) Smart飛天車(接線教學) 馬克一號自走車(鍵盤操控) 馬克一號自走車(行動裝置操控) 馬克一號自走車(循跡功能) WABot機器人(初始化設定) WABot機器人(基礎操控) 百元玩具車大改造 智慧生活 智慧植栽(水泵) 智慧插座(組裝與操控) 智慧追蹤(伺服馬達+攝影機) Webduino雲端平台 基本介紹 註冊與登入 Blockly程式積木 Device裝置管理(裝置認證) Device裝置管理(雲端更新) 兌換券(領取與添加新功能) 發光元件 LCD螢幕 七段顯示器 輸入輸出 MP3播放器 環境偵測 PM2.5細懸浮微粒偵測 顏色感測器 電子羅盤 光度計 溫濕度計 資料庫 Google試算表(設定) Google試算表(儲存) Google試算表(讀取) 綜合應用 記錄PM2.5(Google試算表) 玩具改造 Smart智慧小屋（組裝步驟） Blockly教學 基本功能 變數 流程 文字 數學式 列表 邏輯 迴圈 進階功能 控制台 等待 數值轉換 鍵盤行為 語音聲控 語音朗讀 行動裝置 網頁互動區 文字、點擊、圖片 顏色、按鈕、拉霸 遙控器 Youtube 影像追蹤 創意應用 抽籤並朗讀姓名 大樂透自動選號 隨機組合朗讀語句 語音朗讀逐字稿 小時鐘 語音報時 九九乘法你問我答 BlocklyGames 迷宮 鳥 烏龜 影片 池塘導師 Dr.Smart教學 開發板元件 三色LED 三色LED(色彩輪播) 光敏電阻 光敏電阻(色彩變化) 按鈕開關 按鈕開關(控制顏色) 按鈕開關(控制Youtube) 元件及傳感器 LED 蜂鳴器 震動開關 LED點矩陣 超音波偵測 溫濕度偵測 綜合應用 蜂鳴器(多人協奏) 超音波(倒車雷達) 超音波(控制Youtube) LED點矩陣(顯示距離) LED點矩陣(顯示溫度) 按鈕開關(控制蜂鳴器) 實戰智慧插座 基本操控 組裝智慧插座 網頁操控智慧插座 傳感器應用 超音波偵測距離 光線偵測 人體紅外線偵測 聲音偵測 電視機遙控器 按鈕開關 電流急急棒 土壤濕度偵測 RFID感應 進階應用 語音辨識 人臉、顏色追蹤 手機陀螺儀 聊天室(原理) 聊天室(前後端實作) Google試算表(原理) Google試算表(前後端實作) Google地圖(原理) Google地圖(前後端實作) Youtube互動 Opendata實作 Node-Red(基礎操作) Node-Red(Twitter) Node-Red(E-mail) 日幣匯率(Node-Red爬蟲) 日幣匯率(Node-js爬蟲) 常見問題 Webduino相關 關於Webduino 購買Webduino產品 技術支援與合作 Webduino開發板 關於Webduino開發板 連線相關＆初始化設定問題 Web:Bit相關問題 WebduinoSmart相關問題 其它問題