Tutorial ini adalah panduan langkah demi langkah untuk membangun Web Server mandiri pada ESP32 atau ESP8266 NodeMCU yang menampilkan pembacaan sensor suhu DS18B20 menggunakan firmware MicroPython. Kami akan membuat Web Server di ESP32/ESP8266 yang responsif di perangkat seluler dan dapat diakses oleh perangkat apa pun yang memiliki browser dalam jaringan lokal Anda.
Mengenal Sensor Suhu DS18B20
Sensor suhu DS18B20 adalah sensor digital satu-kawat (one-wire). Artinya, ia hanya memerlukan satu jalur data (ditambah GND) untuk berkomunikasi dengan ESP32 atau ESP8266 Anda.
Sensor ini dapat dialiri daya dari catu eksternal, atau dapat mengambil daya dari jalur data itu sendiri (disebut mode "parasite"), sehingga menghilangkan kebutuhan akan catu daya eksternal.
Komponen yang Diperlukan
Untuk mengikuti tutorial ini, Anda memerlukan komponen-komponen berikut:
- ESP32 atau ESP8266 (baca: [Perbandingan ESP32 vs ESP8266](tautan))
- Sensor suhu DS18B20 (satu atau beberapa sensor) – versi waterproof
- Resistor 4.7k Ohm
- Kabel jumper
- Papan breadboard
Skematik – ESP32
Jika Anda menggunakan ESP32, ikuti diagram berikut.
Skematik – ESP8266
Jika Anda menggunakan ESP8266, ikuti diagram skematik berikut.
Catatan: Dalam tutorial ini kami menghubungkan jalur data DS18B20 ke GPIO 4, namun Anda dapat menggunakan GPIO lain yang sesuai.
Kode Web Server – Pembacaan Suhu DS18B20
Untuk contoh ini, Anda membutuhkan dua file:
1. boot.py: Dijalankan saat perangkat dinyalakan dan mengatur beberapa opsi konfigurasi seperti kredensial jaringan, mengimpor pustaka, mengatur pin, dll.
2. main.py: Ini adalah skrip utama tempat kita akan menangani web server. Skrip ini dieksekusi segera setelah `boot.py`.
Catatan: Adalah praktik yang baik untuk menyertakan file `boot.py` dan `main.py`. Namun, jika Anda lebih suka, Anda dapat menggabungkan semua kode dalam satu file `main.py`.
boot.py (Web Server DS18B20)
Buat file baru di IDE Anda dengan nama `boot.py` dan salin kode berikut.
try:
import usocket as socket
except:
import socket
from time import sleep
from machine import Pin
import onewire, ds18x20
import network
import esp
esp.osdebug(None)
import gc
gc.collect()
ds_pin = Pin(4)
ds_sensor = ds18x20.DS18X20(onewire.OneWire(ds_pin))
ssid = 'REPLACE_WITH_YOUR_SSID'
password = 'REPLACE_WITH_YOUR_PASSWORD'
station = network.WLAN(network.STA_IF)
station.active(True)
station.connect(ssid, password)
while station.isconnected() == False:
pass
print('Connection successful')
print(station.ifconfig())
File ini mengimpor pustaka yang diperlukan, menyiapkan sensor DS18B20, dan menghubungkan ESP ke jaringan Anda.
Di sini, kami mengatur pin data DS18B20 pada GPIO 4, tetapi Anda dapat menggunakan pin lain yang sesuai:
ds_pin = Pin(4)
ds_sensor = ds18x20.DS18X20(onewire.OneWire(ds_pin))
Anda harus memasukkan kredensial jaringan Anda ke dalam variabel berikut agar ESP dapat terhubung ke jaringan Wi-Fi Anda.
ssid = 'REPLACE_WITH_YOUR_SSID'
password = 'REPLACE_WITH_YOUR_PASSWORD'
main.py (Web Server DS18B20)
Di dalam file `main.py` inilah kita akan membuat web server dan menangani permintaan (requests). Salin kode berikut ke file `main.py` Anda.
def read_ds_sensor():
roms = ds_sensor.scan()
print('Found DS devices: ', roms)
print('Temperatures: ')
ds_sensor.convert_temp()
for rom in roms:
temp = ds_sensor.read_temp(rom)
if isinstance(temp, float):
msg = round(temp, 2)
print(temp, end=' ')
print('Valid temperature')
return msg
return b'0.0'
def web_page():
temp = read_ds_sensor()
html = """<!DOCTYPE HTML><html><head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<style> html { font-family: Arial; display: inline-block; margin: 0px auto; text-align: center; }
h2 { font-size: 3.0rem; } p { font-size: 3.0rem; } .units { font-size: 1.2rem; }
.ds-labels{ font-size: 1.5rem; vertical-align:middle; padding-bottom: 15px; }
</style></head><body><h2>ESP with DS18B20</h2>
<p><i class="fas fa-thermometer-half" style="color:#059e8a;"></i>
<span class="ds-labels">Temperature</span>
<span id="temperature">""" + str(temp) + """</span>
<sup class="units">°C</sup>
</p>
<p><i class="fas fa-thermometer-half" style="color:#059e8a;"></i>
<span class="ds-labels">Temperature</span>
<span id="temperature">""" + str(round(temp * (9/5) + 32.0, 2)) + """</span>
<sup class="units">°F</sup>
</p></body></html>"""
return html
s = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
s.bind(('', 80))
s.listen(5)
while True:
try:
if gc.mem_free() < 102000:
gc.collect()
conn, addr = s.accept()
conn.settimeout(3.0)
print('Got a connection from %s' % str(addr))
request = conn.recv(1024)
conn.settimeout(None)
request = str(request)
print('Content = %s' % request)
response = web_page()
conn.send('HTTP/1.1 200 OK\n')
conn.send('Content-Type: text/html\n')
conn.send('Connection: close\n\n')
conn.sendall(response)
conn.close()
except OSError as e:
conn.close()
print('Connection closed')
Membaca Sensor DS18B20
Kode dimulai dengan membuat fungsi bernama `read_ds_sensor()` yang mengambil suhu dari sensor DS18B20. Jika Anda telah mengikuti bagian sebelumnya, Anda seharusnya sudah familiar dengan metode yang digunakan di sini.
def read_ds_sensor():
roms = ds_sensor.scan()
print('Found DS devices: ', roms)
ds_sensor.convert_temp()
for rom in roms:
temp = ds_sensor.read_temp(rom)
if isinstance(temp, float):
temp = round(temp, 2)
print('Valid temperature')
return temp
return '0'
Halaman Web
Fungsi `web_page()` mengembalikan halaman HTML yang berisi pembacaan suhu terbaru.
Membuat Web Server
Setelah itu, lakukan prosedur standar untuk membuat server socket.
while True:
try:
if gc.mem_free() < 102000:
gc.collect()
conn, addr = s.accept()
conn.settimeout(3.0)
print('Got a connection from %s' % str(addr))
request = conn.recv(1024)
conn.settimeout(None)
request = str(request)
print('Content = %s' % request)
response = web_page()
conn.send('HTTP/1.1 200 OK\n')
conn.send('Content-Type: text/html\n')
conn.send('Connection: close\n\n')
conn.sendall(response)
conn.close()
except OSError as e:
conn.close()
print('Connection closed')
Untuk penjelasan mendetail tentang prosedur ini, lihat kembali tutorial yang telah disebutkan.
Pada dasarnya, ketika ESP menerima sebuah permintaan, kami mengirimkan halaman web dengan pembacaan terbaru sebagai respons:
response = web_page()
conn.send('HTTP/1.1 200 OK\n')
conn.send('Content-Type: text/html\n')
conn.send('Connection: close\n\n')
conn.sendall(response)
Demonstrasi Web Server
Setelah mengunggah file `boot.py` dan `main.py` ke papan Anda, tekan tombol RST pada ESP untuk menjalankan kode.
Kemudian, buka browser dan ketikkan alamat IP ESP. Anda dapat mengakses halaman web yang menampilkan pembacaan sensor terbaru dalam satuan Celsius dan Fahrenheit:
Siap Untuk Membuat Proyek Impianmu Menjadi Kenyataan?
Klik di sini untuk chat langsung via WhatsApp dan dapatkan dukungan langsung dari tim ahli kami!
0 on: "Tutorial MicroPython ESP32 - Web Server Sensor Suhu DS18B20 untuk Monitoring Suhu"