Blynk 활용 1- Blynk에 라즈베리파이/ESP32 연결 및 센서값 원격 모니터링

시작하면서…

예전 글에서 라즈베리파이 피코 W 보드(이하 라즈베리파이 피코 또는 피코로 약칭)의 센서 측정 온도를 인터넷 웹브라우저에서 확인하고, 라즈베리파이에 연결된 장치들을 켜거나 끄는 방법을 소개한 바 있었다.

https://kongyine.com/223201526072

당시 소개한 방법은 웹 브라우저에 다음과 같이 일종의 웹서버를 만들고, 이 웹서버 페이지에 접속하면 원격지에 있는 라즈베리파이의 측정 결과를 살펴볼 수 있고, 해당 페이지에서 선택하는 버튼을 인식하여 동작하는 방식이었다.

이 방식으로도 원격지의 라즈베리파이에 연결된 센서 측정값을 확인할 수도 있고, 연결된 장치를 제어할 수 있지만, 일일이 개별적으로 웹서버 페이지를 직접 만들어주어야 하는 불편함이 있고, 사용자 인터페이스를 직접 디자인하는데 노력이 필요하기도 했다.

그런데, 기성 서비스 중에는 이런 기능을 좀 더 쉽게, 그리고 좀 더 예쁜 인터페이스로 제공해 주는 “IOT Platform”이란 서비스들이 있다. 대표적인 예로는 Blynk, 아마존의 AWS, 구글 IOT 등이 있다.

Blynk에 라즈베리파이 연결하기

본 글에서는 이런 IOT 서비스 중 많이 알려져 있는 Blynk라는 서비스를 이용하여, 매우 쉽게 원격지에 있는 라즈베리파이 피코 보드의 센서 측정값들을 PC나 스마트폰에서 모니터링하는 방법을 소개한다.

참고로, Blynk는 유료 서비스이지만, 하나의 계정당 최대 5개의 입출력 채널까지는 무료(최대 2개 장치 이내에서)로 사용이 가능하다. 유료 플랜의 경우는 이 글을 작성하는 2024년 5월 기준으로 매월 약 7USD인 Maker 플랜과, 매월 약 100USD인 Pro 플랜이 있다. Maker 플랜은 20개의 입출력 채널을, Pro 플랜은 500개까지의 입출력 채널을 제공한다.

Step 1 – 계정 만들기

이 서비스를 사용하려면, 우선 계정을 만들어야 하는데, 다음 링크를 통해 계정을 만들 수 있다.

https://blynk.io/

위의 화면에서 “START FREE”를 선택하면, 다음과 같은 화면이 나오며, 여기서 계정을 만들면 된다.

Step 2 – Blynk에 대시보드 만들기

계정을 만든 후, 위의 화면에서 로그인하면 다음과 같은 화면이 되는데,

피코 보드를 등록하려면 “New Device”를 선택해 준다.

그러면 다음과 같은 화면이 되며, 여기서 “From Template”를 선택한다.

그러면 다음과 같이 고유한 이름(여기서는 “Sample”)을 지정해 줄 수 있으며,

이름 지정 후, “Create” 버튼을 누르면 다음과 같이 지정한 이름의 장치가 등록이 된다.

이때 우측에 고유한 장치 번호가 생성되어 표시되는데, 이 부분은 라즈베리파이 피코에서 Blynk에 연결하는데 필요한 정보이므로 잘 복사해 기록해 둔다.

다음에는, Blynk에 연결될 라즈베리파이로부터 입력받아 표시할 정보를 표현하기 위하여, 대시보드를 구성해야 하는데,

다음 화면에서 “Edit“를 선택해 준다.

그러면 다음과 같은 화면이 되는데

먼저 “Web Dashboard”를 선택하고,
Widget Box에서 “Gauge”를 선택해 대시보드로 드래그한다. 이를 표시할 정보의 개수만큼 반복하면 된다.

만일 표시할 정보가 두 개라면 다음과 같이 2개의 Gauge가 드래그한 상태가 된다.

이제 이렇게 가져온 Gauge에 정보를 할당하기 위해, 다음 부분을 클릭해 준다.

그러면 이 Gauge에 표시할 정보 및 신호입력선, 표시 형태, 색상, 폰트, 이름 등의 세부사항을 지정할 수 있다.

위의 화면에서 “Create…” 부분을 누르면 … 다음과 같이 되는데, 여기서 “Virtual pin”을 선택한다.

Virtual Pin은 Blynk가 라즈베리파이와 신호를 주고받는 가상의 신호 입출력 채널을 의미하는데, 0부터 255까지 256개가 있다.

다음 표시된 항목들을 선택하거나, 지정해 주고, 저장해 준다. 모든 값의 설정이 끝나면, “Save”버튼을 눌러주어야 한다. 여기서 PIN은 위에서 지정해 준 Virtual Pin 번호이다.

대시보드의 편집이 완료되면, 다음과 같이 “Save and Apply”를 눌러준다.

그러면 다음과 같이, 라즈베리파이에서 보내오는 센서 값을 표시할 대시보드가 다음과 같은 형태로 완성된다.

라즈베리파이 PICO W를 등록한 경우

ESP32를 등록한 경우

Step 3 – 라즈베리파이에서 Blynk에 연결하기

라즈베리파이 피코 보드에서 위에서 만든 Blynk 계정에 실제로 연결하기 위해서는, 다음 2가지 사항이 포함된 마이크로파이선 코드를 실행해 주어야 한다.

* blynklib 라이브러리를 추가해 주어야 하며, (Source : https://github.com/vshymanskyy/blynk-library-python/blob/master/BlynkLib.py 에서 다운로드 가능)

* 위에서 Blink 대시보드 생성과정에서 복사해 둔 Blynk_TOKEN을 넣어주어야 한다.

(기본적으로 복사해둔 값들은 C언어 형태이므로, 마이크로 파이썬에서 사용할때는 변수값 지정을 위해 다음처럼 “=” 부호를 중간에 넣어주어야 한다.)

그리고 당연하게도 Wifi 네트워크 연결을 위한 코드들도 다음과 같이 포함시켜주어야 한다.

그런데, 만일 라즈베리파이 피코 보드 대신 ESP32를 사용하는 경우라면….

위의 코드와 동일하되, Wifi 접속확인을 위한 값만 다음과 같이 1010으로 다르게 지정해 주어야 한다. 그 외에는 모두 동일함

이러한 사항을 반영하여…

온도 및 습도를 측정하는 센서인 AHT10을 이용하여, 온도 및 습도 측정한 후, 위에서 생성한 Blynk 대시보드에 표시하는 예제(피코보드 기준)를 만들었는데, 소스 코드는 다음과 같다. 만일 ESP32라면, 위에 설명한대로, Wifi 접속확인 값만 1010으로 다르게 지정해 주면 된다.

참고로, AHT10 온습도 센서 사용방법에 대해서는 별도의 이전 글(https://kongyine.com/223240132657)을 참조하고, 라즈베리파이 피코의 네트워크 연결에 대해서는 별도의 글(https://kongyine.com/223199089617)을 참고하길 바란다.

from machine import Pin, I2C
import utime
import sys
from aht10 import *

import network
from blynklib import Blynk

BLYNK_TEMPLATE_ID= "TMPL6e-jVFU0N"
BLYNK_TEMPLATE_NAME= "Quickstart Template"
BLYNK_AUTH_TOKEN= "_hK63KEb4cI_A6nOifmWlnwippRdVLM6"
BLYNK = Blynk(BLYNK_AUTH_TOKEN)

wlan = network.WLAN(network.STA_IF)
wlan.active(True)
SSID = "각자의 SSID"
PASSWORD = "각자의 PASSWORD"
wlan.connect(SSID, PASSWORD)
while not wlan.isconnected() and wlan.status() >= 0:
    print("Waiting to connect:")
    utime.sleep(1)
if wlan.status() != 3:
    raise RuntimeError('network connection failed')
else:
    print("Wifi is connected == ", wlan.isconnected())
    print( "Status =", wlan.status())
    print( "ip =", wlan.ifconfig())
    print( "SSID", wlan.config('ssid'))
    print( "Channel :", wlan.config('channel'))
    
i2c = machine.I2C(0, scl=machine.Pin(1), sda=machine.Pin(0), freq=400000)

# continuous reading
while True:
    detect_sensor(i2c)
    reading=convert(i2c)
    Temp=reading[0]
    Humidity=reading[1]
    print('------------------------------------')
    print("Temperature       (AHT10) :  ",Temp, " °C")
    print("Relative Humidity (AHT10) :  ", Humidity, "  %")
    BLYNK.virtual_write(7, Temp)
    BLYNK.virtual_write(8, Humidity)
    BLYNK.run()
    utime.sleep(0.5)

위의 코드를 실행하면서, Blynk 대시보드와 비교한 동영상은 다음과 같은데,

오른쪽 PC 화면에서 보이는 센서 측정값이 그대로, 화면 왼편의 Blynk 대시보드에서 표시되는 것을 볼 수가 있다.