Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Smart Data Center

306 views

Published on

開源軟硬體機房環控建置經驗分享

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Smart Data Center

  1. 1. ) / : ( hmchen@nutc.edu.tw ( E ( E 1
  2. 2. D 1 I I ( ) 2),) ) G 4 3 2
  3. 3. 3
  4. 4. (TitanLi) 6 4 4 1 T 6 H42 M 8K 3 L M 1 C 2 1 M O UO ) (0 4 E 4
  5. 5. (TitanLi) r DHk c e ) 3 1 O bO taC 4 2 hn e l aC ) 3 r po S iGl u ( Hk 5
  6. 6. 6
  7. 7. 0201 03 24 24 HPC 7
  8. 8. 不想花錢 8
  9. 9. 08 01 ARIMA modelQR code LINE-BOT LINE-BOT 24 UPS web 9
  10. 10. 10
  11. 11. 11
  12. 12. 12
  13. 13. 13
  14. 14. 14
  15. 15. 15
  16. 16. 16
  17. 17. 0 3 ) 3 17
  18. 18. Web Dashboard Version1 18
  19. 19. Web Dashboard Version1 19
  20. 20. Web Dashboard Version2 DL-303 20
  21. 21. Web Dashboard Version2 IO ET7044 21
  22. 22. Web Dashboard Version2 PM3133 22
  23. 23. Web Dashboard Version3 23
  24. 24. 24
  25. 25. LINE-BOT 25
  26. 26. LINE-BOT 26
  27. 27. LINE-BOT 27
  28. 28. LINE-BOT 28
  29. 29. Demo 29https://www.youtube.com/watch?v=kMMYxFdER4M
  30. 30. C . -/ . / / T I : I A M L30
  31. 31. Thanks 31
  32. 32. 硬體架構流程簡介 開源機房監控系統軟硬體基礎簡介 開源硬體監控服務組建 (Power Meter) 硬體監控服務整合 (Delta UPS + MQTT) 自我介紹與經歷簡介
  33. 33. 主講人 : 台中科大資訊工程系 - 鄭鍾翔 01 國立台中科技大學資訊工程系 應屆畢業生 02 03 04 05 開源 Github 網址 :https://github.com/j13tw 軟體研發 : Grafana / Icinga2 / MQTT / RTMP 研究方向 : OpenStack / Ceph / Docker 興趣方向 : 3D 物件設計、物聯網通訊整合 硬體研發 : MCU 設計 / 電路設計 / 介面整合
  34. 34. 開源機房硬體簡介 定義與分類 以物聯網的方向切入,設備端大致分為已可 聯網與尚未聯網設備,藉由通訊介面的轉換,可 拓展設備聯網需求,並透過納管的方式,實現相 關工業聯網規範。 單以大多數機房的現有設備之中,我們可再 分為環境、能源、控制、安全需求、機櫃主機群 等相關分類,並藉由現有工控聯網設備與需求性 開發的產品製作,達成通訊界面與功能項目整合 的聯網設備。 “ 性 需 求
  35. 35. 開源硬體監測設備 – Power Meter
  36. 36. 開源硬體設備 – Arduino MCU (1/3) 1. 開源硬體設計 (電路 / PCB / 芯片規劃 開源) 2. 提供多種載板方案 (UNO / Nano / Micro) 3. 開源 編譯 / 程式設計 軟體 4. 提供線上版 MCU 快速入門教程方案 5. 載板單價較為低廉 (約300 - 1500左右) 6. 擁有多種 擴充開發版 套件 7. 提供多種 第三方 Library 套件使用
  37. 37. 開源硬體設備 – Arduino MCU (2/3)
  38. 38. 開源硬體設備 – Arduino MCU (3/3) 技術規格: 1. Digital I/O 數字輸入/輸出端共 0~13。 2. Analog I/O 模擬輸入/輸出端共 0~5。 3 .支持USB接口協議及供電(不需外接電源)。 4. 支持單晶片TX/RX端子。 5. 支持USB轉TTL TX/RX端子。 6. 支持6組PWM端子(Pin11,Pin10,Pin9,Pin6,Pin5,Pin3)。 7. 輸入電壓:外部支持 7V~12V DC輸入。 8. 輸出電壓:5V DC輸出和3.3V DC輸出 和 外部電源輸入。 9. 採用用Atmel Atmega328P-PU單晶片。 10. Arduino大小尺寸:寬70mm X 高54mm。 Arduino UNO Rev3
  39. 39. 開源硬體設備 – 開口式比流器 1. 分為 電壓 / 電流 兩種輸出模式 2. 依造 測量線路 線徑 大小挑選 3. 依造 測量線路 流量 挑選測量器 (最大輸入電流 / 線圈閘數比 / 最大量測電壓) 4. 有劃分 電流 流向出入 方向 5. 需要優先確認規格後進行設備開發 (最大輸出電流 / 電壓 / 輸出信號轉換圖表)
  40. 40. 開源硬體設備 – 開口式比流器 規格簡介
  41. 41. 開源硬體監測設備 – 電路規劃與配置 參考連結 : https://learn.openenergymonitor.org/electricity-monitoring/ct-sensors/interface-with-arduino?redirected=true
  42. 42. 開源硬體監測設備 – 公式與數值計算 參考連結 : https://learn.openenergymonitor.org/electricity-monitoring/ct-sensors/interface-with-arduino?redirected=true 開口式比流器 : 輸入最大電流 : 100A 輸出電流 : 0~50mA CT閘數比 : 2000 : 1 假設資料建構 最大量測電流峰值 = (輸入最大電流 : 100A) * 1.414 = 141.4A 轉換電流輸出 = (最大量測電流峰值 : 141.4A) / (CT閘數比 : 2000 : 1) = 0.0707A Arduino 5V / 2 = 2.5V 測量電阻 = 2.5V / 0.0707A = 35.4 歐姆 Emonlib 誤差計算 = (CT閘數比 : 2000 : 1) / (測量電阻 = 35.4 歐姆) = 56.5 需求資料建構 開口式比流器 : 測量電阻 : ? Emonlib 誤差計算 : ? 公式代換計算
  43. 43. 開源硬體監測設備 – 量測數值 Arduino 計算套件 參考連結 : https://github.com/openenergymonitor/EmonLib
  44. 44. 開源硬體監測設備 – 量測數值 Arduino 計算與輸出 參考連結 : https://github.com/openenergymonitor/EmonLib/blob/master/examples/current_only/current_only.ino
  45. 45. 開源硬體監測設備拓展 – 冷氣致冷與耗電監測 參考連結 : https://github.com/adafruit/DHT-sensor-library 溫溼度感測功能模組 – DHT11
  46. 46. 開源硬體監測設備拓展 – 電源監測智慧電箱 參考連結 : https://www.taiwaniot.com.tw/product/arduino-nano-v3-%E7%BE%A9%E5%A4%A7%E5%88%A9/ MCU : Arduino Nano (8個 Analog In I/O)
  47. 47. 硬體設備服務建置 – 台達電 獅子座 UPS
  48. 48. UPS 不斷電系統聯網需求性質 電源輸入 資料 電源輸出 資料 系統狀態 資料 電源負載 資料 電池狀態 資料 UPS 備載電源
  49. 49. 硬體設備連線建置 – PC 端 通訊配置
  50. 50. 硬體設備連線建置 – PC 端 硬體實作設備 RS232 轉 USB 模組開源硬體 樹莓派 (Linux Base)
  51. 51. 硬體設備服務串接 – UPS溝通與服務架構
  52. 52. 硬體設備服務串接 – UPS溝通與指令概述_1
  53. 53. 硬體設備服務串接 – UPS溝通與指令概述_2
  54. 54. 硬體設備服務串接 – PC端 與 UPS溝通建構
  55. 55. 硬體設備服務串接 – UPS監控網頁組建
  56. 56. 硬體設備服務整合 – MQTT 套件介紹 參考網址 : https://pypi.org/project/paho-mqtt/
  57. 57. 硬體設備服務整合 – MQTT 套件使用 (1/3) 參考網址 : https://pypi.org/project/paho-mqtt/
  58. 58. 硬體設備服務整合 – MQTT 套件使用 (2/3) 參考網址 : https://pypi.org/project/paho-mqtt/
  59. 59. 硬體設備服務整合 – MQTT 套件使用 (3/3) 參考網址 : https://pypi.org/project/paho-mqtt/
  60. 60. 硬體設備服務整合 – MQTT 套件實做
  61. 61. 感謝大家的聆聽~ Design By : 國立台中科技大學 imac 團隊
  62. 62. A 1
  63. 63. •ET7044 •DL303 2
  64. 64. • -2 • 485 18 8 • / 75 2+0 0 • : 3 + • EP + + • W DV MI TC DS DMI T 3
  65. 65. ET-7044(1/4) 4
  66. 66. ET-7044(2/4) 5
  67. 67. ET-7044(3/4) 6
  68. 68. ET-7044(4/4) 7
  69. 69. • • C C D • 3 / - 3 / - -- 3 3032 8
  70. 70. DL-303(1/3) 9
  71. 71. DL-303(2/3) 10
  72. 72. DL-303(3/3) 11
  73. 73. NodeJS PythonMongoDB 12
  74. 74. NodeJS C E ) ( ( 13
  75. 75. Python F D 14
  76. 76. MongoDB - - 15
  77. 77. Protocol •MQTT •Modbus •Socket.io 16
  78. 78. MQTT(1/3) MQTT Broker Subscribed to “Temperature” topic Subscribed to “LED-Status” topic Subscribed to “LED-Status” topic Publish “on” to “LED-Status” topic Publish “on” to “LED-Status” topic Publish “on” to “LED-Status” topic Publish “28 C” to “Temperature” topic Publish “28 C” to “Temperature” topic 17
  79. 79. MQTT(2/3) Server Qos 0 Qos 1 Qos 2 Auth Bridge SSl Dynamic Topics Cluster Plugin System mosquitto ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✗ ✓ RabbitMQ ✓ ✓ ✗ ✓ ✗ ✓ ✓ JoramMQ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ supported ✗ not supported unknown 18
  80. 80. MQTT(3/3) MQTT Broker PUBLISH PUBLISH PUBACK PUBLISH PUBREL PUBREC PUBCOMP QoS 0 : At most once QoS 1 : At least once QoS 2 : Exactly once 19
  81. 81. Modbus . 2 4 S . 2 ) 1 / ( )3 S 4 ( )3 M 4 ( )3 ( )3 ) 1 / 20
  82. 82. Socket.io • • E • J • • 21
  83. 83. LineBot 22
  84. 84. A: P8 4 8 2 10 1I 2 3 L 5E N . I LINE-BOT 92% 27% 39% 22% 23
  85. 85. https://entry-at.line.me/ 24
  86. 86. 25
  87. 87. 26
  88. 88. 27
  89. 89. 28
  90. 90. 29
  91. 91. 30
  92. 92. 31
  93. 93. 32
  94. 94. 33
  95. 95. 34
  96. 96. LINE Developer https://hackmd.io/s/SkX8qy2rE 35
  97. 97. 1 1 Reply API Push API Developer Trial 50 1,000 ✓ ✗ ✓ ✓ ✓ ✓ 1,000 ✓ ✓ ✗ ✗ ✓ ✗ 36
  98. 98. Reply API vs Push API 37 Push API Reply API LINE LINE LINE 1.LINE
  99. 99. Text message • • • 38
  100. 100. Sticker message • • : - - / . . / . - 39
  101. 101. Image message • 10 • 2 • * • * 40
  102. 102. Video message • 4 • • • 1 0 • 1 41
  103. 103. Audio message • 4 1 • • • 0 • 0 42
  104. 104. Location message • • • 0 43
  105. 105. Imagemap message • • • 44
  106. 106. Buttons template • • : 4 0 2 14 4 45
  107. 107. Confirm template • • 46
  108. 108. Carousel template • • 47
  109. 109. Image carousel template • • 48
  110. 110. Flex Message 49
  111. 111. 50
  112. 112. httpSSS 51
  113. 113. 52
  114. 114. 53
  115. 115. Heroku 54
  116. 116. • 2 • 1 5 0 2 • 2 4 5 7 • = 2 3 5 55
  117. 117. Heroku Support https://devcenter.heroku.com/start 56
  118. 118. Heroku Install 57
  119. 119. https://devcenter.heroku.com/articles/getting-started-with-nodejs#set-up58
  120. 120. Push code 59
  121. 121. Web Dashboard 60
  122. 122. > = 1 : - $ < > 1 61
  123. 123. mLab 62
  124. 124. .. 50. 63
  125. 125. mLab(1/4) 64
  126. 126. mLab(2/4) 65
  127. 127. mLab(3/4) 66
  128. 128. mLab(4/4) 67
  129. 129. Highcharts https://www.highcharts.com.cn/demo/highcharts 68
  130. 130. Highcharts • : • - 3 / / - 3 3 3 . 3- .- 69
  131. 131. Highcharts • https://www.high charts.com.cn/de mo/highcharts/w ordcloud 70
  132. 132. highcharts 71
  133. 133. Thanks 72
  134. 134. 開源軟體簡介流程 開源視覺化 Grafana 專案組建與使用 Icinga2 簡介、監控服務設計、警告推播 Sigfox 通訊模組實作 - 警告系統服務 RTMP 視訊直播系統 (落地、轉發YT)
  135. 135. 開源機房軟體簡介 定義與分類 對於聯網設備需求性變動大,軟體變動與兼容性 質的提升,傳統軟硬體整合運營商,提供一套管理 軟體給使用者,而當多家廠商設備整合時,時常面 臨通訊架構、通訊指令、資料庫系統兼容等相關問 題,因此軟體設計架構與操作便利的程度,即造成 使用者是否願意使用這套軟體成敗關鍵,也因如此, 兼容多種資料庫查詢機制、貼近使用者操作、豐富 的顯示方式、 自適應的版面、提供多重部屬環境 的軟體,儼然成為機房監控的首選。 “性便 利
  136. 136. 傳統顯示板介面建置方案 資料庫 程式設計 顯示方式 版面規劃 平台整合 1 2 3 4 5 1. 尋找支持連線 登入的套件 2. 測試套件使用 3. 查詢語法與輸 出資料整理 1. 動態圖表? 2. 文字顯示? 3. 儀表指針顯示? 4. 顏色匹配? 5. 多重顯示圖表? 6. 比對形式的圖 表? 1. 選定開發程式 語言 2. 找個網頁工程 師來維護系統 與更新 3. 程式語言套件 版本 4. 外掛套件使用 1. 版面外型樣式 規劃 2. 跳轉頁面 3. 自動適應網頁 視窗大小 4. 圖表擺放方式 1. PC / NoteBook 顯示網頁 2. 不 同 瀏 覽 器 開 啟方式 3. 手 機 開 啟 網 頁 連線設定 4. 動態縮放識別
  137. 137. 傳統的介面安排與顯示方式
  138. 138. 傳統建置方案更新的痛苦 你我都是知道的QQ
  139. 139. 當改版已成為事實 剩下的 就是跟程式碼為伍的日子了
  140. 140. 重新看 Code 記憶恢復 新增功能調整排版? 新增資料庫查詢、頁面 快速修正調動圖表、排版 該如何實現開發上的版面調整呢?
  141. 141. 重新看 Code 記憶恢復 新增功能調整排版? 新增資料庫查詢、頁面 快速修正調動圖表、排版 該如何實現開發上的版面調整呢?
  142. 142. 選用好工具,快速達到你的需求
  143. 143. 01 PC Server 02 資料庫 欄位規劃 03 顯示板 規劃 Mac OSX Windows Linux (Ubuntu, Debian…..) Docker Envirment Graphite / Elasticsearch CloudWatch / InfluxDB OpenTSDB / Prometheus Loki / MySQL / Postgres SQL Microsoft SQL Server (MSSQL) 純數值顯示 動態圖表繪製 歷史紀錄顯示 動態網頁嵌入 告警功能推播 Grafana 視覺化部屬基礎要件
  144. 144. Grafana 究竟能在怎樣的平台運行呢? 參考鏈結 : https://grafana.com/grafana/download/6.0.0-beta3?platform=linux
  145. 145. Grafana 能支持查詢的資料庫架構呢? 參考鏈結 : https://grafana.com/plugins?type=datasource
  146. 146. MongoDB 能支持資料庫查詢嗎?
  147. 147. MongoDB 資料庫查詢支援套件 參考鏈結 : https://github.com/JamesOsgood/mongodb-grafana
  148. 148. MongoDB 資料庫查詢套件怎麼配置? 參考鏈結 : https://github.com/JamesOsgood/mongodb-grafana 1. 需求環境 Node.js / nvm / npm 2. 僅支援 MongoDB aggregate 查詢 3. Grafana 外掛套件路徑 (/usr/lib/grafana/plugins) 4. 安裝 Node Server 所需套件 5. 啟動 Node Server 環境 (127.0.0.1:3333) 6. 重新啟動 Grafana-server
  149. 149. Grafana DataSource 新增與配置
  150. 150. Grafana DataSocurce 使用與查詢 (1/2)
  151. 151. Grafana DataSocurce 使用與查詢 (2/2)
  152. 152. Grafana 顯示板的顯示方式選擇 參考鏈結 : https://grafana.com/plugins?type=datasource
  153. 153. Grafana 顯示板的顯示方式-動態圖表
  154. 154. Grafana 顯示板的顯示方式 - 文字型圖表
  155. 155. Grafana 顯示板的顯示方式 - 列表型顯示 (1/3)
  156. 156. Grafana 顯示板的顯示方式 - 列表型顯示 (2/3)
  157. 157. Grafana 顯示板的顯示方式 - 列表型顯示 (3/3)
  158. 158. Grafana 顯示板的顯示方式-Html / Markdown文字嵌入
  159. 159. Grafana 顯示板的顯示方式 - 圖片嵌入
  160. 160. Grafana 顯示板的顯示方式 - Youtube嵌入
  161. 161. Grafana 顯示板的顯示方式 - 階層式顯示板
  162. 162. Grafana 實作機房的顯示介面 - UPS服務
  163. 163. Grafana 實作機房的顯示介面 - 智慧電表服務
  164. 164. 滾動式輪巡播放 監控顯示頁面 ?
  165. 165. 需要劃分群組與使用者權限的需求?
  166. 166. 需要強而有力的版本管理與恢復功能?
  167. 167. 系統當機 / 服務壞掉 / 重建服務怎麼辦?
  168. 168. 豐富的外掛模組提供使用 官方套件網站: https://grafana.com/plugins
  169. 169. 自動化監控通報服務 - Icinga Web 2 簡介
  170. 170. 自動化監控通報服務 - Icinga Web 2 功能 Icinga WEB 2 Icinga 相依 Nagios 監控服務, 提供 TCP / SQL / Disk / ssh / snmp 等, 以選項與執行命令執行測試。 # 相同於 Librenms Service 監測功能 內建基礎監測 Plugin 服務監測 (Nagios) 主機監測服務建構 給予主機 IP / Port 可監測服務端狀態, 基於 Ping 功能的主機服務延伸, 針對伺服器異常/斷線等進行通知。 HOST IP 監測 內建服務 監測環境 自訂監測 腳本 利用 Icinga 固定時間自動執行技術, 系統組建 Python 編譯環境,解除SELinux , 撰寫 Python 功能型程式(資料撈取與接收), 新增 Plugin 掛載設定檔案(指令/服務/主機)。 自建基礎監測 Plugin 服務監測 (Python)
  171. 171. Icinga 告警服務 – Nagios 內建服務
  172. 172. Icinga 告警服務 – 自建服務設定規劃
  173. 173. Icinga 告警服務 – 自建監控服務規劃
  174. 174. Icinga 告警服務 – 自建監控服務功能設定
  175. 175. Icinga 告警服務 – 自建服務程式掛載設定 (1/3) 1. 建立 icinga2 系統指令呼叫模組 修改 /etc/icinga2/conf.d/commands.conf 參考資料 : https://icinga.com/docs/icinga2/latest/doc/03-monitoring-basics/
  176. 176. Icinga 告警服務 – 自建服務程式掛載設定 (2/3) 參考資料 : https://icinga.com/docs/icinga2/latest/doc/03-monitoring-basics/ 2. 建立 icinga2 監控服務 修改 /etc/icinga2/conf.d/services.conf
  177. 177. Icinga 告警服務 – 自建服務程式掛載設定 (3/3) 參考資料 : https://icinga.com/docs/icinga2/latest/doc/03-monitoring-basics/ 3. 建立 icinga2 主機節點 修改 /etc/icinga2/conf.d/hosts.conf
  178. 178. Icinga 告警服務 – 自建監控服務程式建構
  179. 179. Icinga 告警服務 – 監控服務程式 網頁設定 檢視自動檢查資料概況 檢查時間 檢查指令 最後檢查時間 下次檢查時間 系統端檢測執行方式選取 主動型定時檢測 被動型觸發檢測 系統型通知推播 事件觸發機制
  180. 180. Icinga 告警服務 – 推播警報監控服務 設定 Icinga 官方 內部通知警報型 觸發指令 參考資料 : https://icinga.com/2017/08/23/advisory-for-icinga-2-v2-7-update-and-mail-notification-scripts/
  181. 181. 開源硬體警報服務建置 – Sigfox 通訊模組 參考資料 : https://unabiz.github.io/unashield/
  182. 182. 開源硬體警報服務建置 – Sigfox 通訊架構 參考資料 : https://www.unabiz.com/
  183. 183. 開源硬體警報服務建置 – Sigfox 雲端服務 參考資料 : https://backend.sigfox.com/auth/login
  184. 184. 開源硬體 + Sigfox 警報服務 – UPS 警報串接
  185. 185. 開源硬體 + Sigfox 警報服務 – UPS 警報串接
  186. 186. 開源硬體 + Sigfox 警報服務 – 環境溫控警報 DHT 22 高精度溫溼度檢測模組
  187. 187. 開源硬體 + Sigfox 警報服務 – 環境溫控警報
  188. 188. 開源硬體 + Sigfox 警報服務 – Line 通知串聯
  189. 189. RTMP 直播視訊監控 – RTMP 技術簡介 參考資料 : https://ithelp.ithome.com.tw/articles/10206368 1. 基於 TCP 的雙向傳輸。 2. RTMP 串流目前只能由 Flash 播放器來播出 3. 默認 Port 為 1935。 4. 它可以使用 AMF 與 FLV 流容器。 5. 它可以支援聲音編碼主要的為 AAC、MP3。 6. 而支援的影像編碼為 H.264。 7. 它支援推流與拉流,也就是所謂的你可以推聲音到 Server,你也可以去 Server 將聲音拉回來。 8. 目前大部份的 PC / Browser 都有 Flash,但手機端就需要轉譯了。 9. 它的延遲時間大約 3 ~ 5 秒或更低,如果處理的好的話,這裡的延遲的意思就是主播說話後, 你大約 3 ~ 5 秒才能聽到。
  190. 190. RTMP 直播攝影機 – 群光 IPC-364 參考資料 : https://www.chundatw.com.tw/products-detail.php?Key=9
  191. 191. RTMP 直播攝影機 – 設備規格概述 參考資料 : https://www.chundatw.com.tw/products-detail.php?Key=9
  192. 192. RTMP 直播攝影機 – 官方設定控制畫面
  193. 193. RTMP 直播攝影機 – 抓取 RTMP 通訊方式
  194. 194. RTMP 直播攝影機 – 獲取 RTMP 通訊 URL
  195. 195. RTMP 直播攝影機 – 儲存 RTMP 影像碼流 參考資料 : https://en.wikipedia.org/wiki/RTMPDump
  196. 196. RTMP 直播攝影機 – RTMPdump 功能測試
  197. 197. RTMP 直播攝影機 – RTMP 影片轉存規則
  198. 198. RTMP 直播攝影機 – RTMPdump 影像轉存 參考資料 : https://blog.csdn.net/leixiaohua1020/article/details/14229047
  199. 199. RTMP 直播攝影機 – 儲存 RTMP 影像_1
  200. 200. RTMP 直播攝影機 – 儲存 RTMP 影像_2
  201. 201. RTMP 直播攝影機 – 儲存 RTMP 影像_3
  202. 202. RTMP 直播攝影機 – Youtbe 直播服務建立
  203. 203. RTMP 直播攝影機 – Youtbe 直播服務準備
  204. 204. RTMP 直播攝影機 – Youtbe 直播服務串流 Youtube RTMP Server URL : rtmp://a.rtmp.youtube.com/live2/xxxxxxxxxxxxx
  205. 205. RTMP 直播攝影機 – Youtbe 直播串流Demo 影片跳轉 : 請點此
  206. 206. 感謝大家的聆聽~ Design By : 國立台中科技大學 imac 團隊

×