Universitas ASA Indonesia

Program Studi: Teknologi Informasi
Mata Kuliah: Internet of Things
SKS: 3 (Tiga)
Dosen Pengampu: Istiqomah Sumadikarta, S.T., M.Kom.

Pertemuan 11: Protokol komunikasi HTTP Request dan Response

Tujuan Pembelajaran

• Memahami konsep dasar HTTP dan sejarah perkembangannya.
• Menjelaskan cara kerja HTTP dalam komunikasi client-server.
• Mengenali struktur HTTP Request dan Response.
• Mengimplementasikan HTTP Request sederhana dengan ESP32 di Wokwi.

1. Pengenalan HTTP

Hypertext Transfer Protocol (HTTP) adalah protokol komunikasi yang digunakan untuk mentransfer data antara client dan server di web. HTTP merupakan inti dari komunikasi internet modern, digunakan untuk memuat halaman web, API, dan layanan berbasis web lainnya.

2. Sejarah HTTP

HTTP pertama kali dikembangkan oleh Tim Berners-Lee pada tahun 1989 bersama World Wide Web. Versi pertama HTTP/0.9 sangat sederhana, hanya mendukung permintaan GET. Seiring perkembangan, HTTP/1.0 dan HTTP/1.1 menambahkan fitur seperti header, status code, dan persistent connection. Versi terbaru, HTTP/2 dan HTTP/3, menghadirkan efisiensi dan keamanan yang lebih baik.

3. Cara Kerja HTTP

HTTP bekerja dengan model client-server. Client (misalnya browser atau perangkat IoT) mengirimkan request ke server. Server memproses permintaan dan memberikan response yang berisi data yang diminta. Komunikasi ini biasanya menggunakan port 80 (HTTP) atau 443 (HTTPS).

HTTP membantu user dalam mengakses berbagai web resources seperti halaman website, dokumen, video, dll. pada web server. User menggunakan browser agar dapat mengakses berbagai macam resource di dalam web server dengan menggunakan URL. Protokol HTTP membantu koneksi yang membantu user untuk web server dengan URL tersebut.

Contoh penggunaan http adalah saat kita mengunjungi https://iot.iqscampus.com/tm11.html

Melalui URL tersebut, protokol HTTP bertugas untuk mengirimkan permintaan (request) dan memberikan respon (response) dari request URL yang diberikan. Contohnya seperti menghapus (deleted), memperbarui (update), atau mengganti (replace) file yang ada di dalam server.

4. HTTP Request dan Response

HTTP Request

HTTP request merupakan aktivitas dimana client meminta data kepada server melalui alamat URL tertentu. Biasanya proses request dilakukan oleh client melalui web browser seperti Chrome, Firefox, Safari, dll.

HTTP Response

Sistem HTTP Response merupakan sebuah aktivitas dimana server memberikan jawaban terhadap request yang dikirim oleh client sebelumnya. Respon yang diberikan oleh server setelah mengirimkan data yang diinginkan adalah mengirimkan status line atau response header.

Berikut ini adalah beberapa status header :
• 1xx, artinya request dari client diterima server, dan dilanjutkan dengan memberikan tindakan selanjutnya dari client
• 2xx, artinya server berhasil merespon permintaan client
• 3xx, artinya adanya redirection (pengalihan permintaan client)
• 4xx, artinya error pada client. Sehingga server tidak dapat membaca dan memproses permintaan client (kesalahan sintak HTML, atau sintak yang ditulis tidak full)
• 5xx, artinya terdapat kesalahan internal, biasanya berasal dari kesalahan pada database server.

5. Praktikum HTTP Request dengan Platform Blynk

Pada praktikum ini, kita akan membuat ESP32 melakukan request ke server menggunakan protokol HTTP.

Membuat Device dan Dashboard pada Platform Blynk

1. Buat akun di Platform Blynk, Sign in
2. Klik menu New Template
   
3. Isi dialog New Template
   
4. Membuat New Datastreams Virtual Pin
   
5. Isi dialog New Virtual Pin
   
6. Buat New Device
   
   
   
   
7. Device baru telah siap
   
8. Pilih device yang baru kita buat, kemudian pilih Edit Dashboard
   
9. Konfigurasi Dashboard dari Device kita:
   • Pilih Widget yang diinginkan, misal Gauge dan drag ke tengah.
   • Klik Setting pada Gauge yang ditambahkan.
     
   • Pilih Datastream yang sudah dibuat yaitu Suhu.
     
   • Klik Save.
   • Klik Save And Apply (pojok kanan atas).
   • Dashboard untuk Device berhasil dibuat
     

Membuat Simulasi ESP32 dan DHT22 di Wokwi

1. Buatlah rangkaian ESP32 dan DHT22 seperti berikut ini:
   
2. Buatlah kode program untuk melakukan koneksi WIFI dan pengiriman data ke Blynk

#define BLYNK_PRINT Serial
#define BLYNK_TEMPLATE_ID   "TMPL6U6c42CoJ"
#define BLYNK_TEMPLATE_NAME "DHT22"
#define LED 2

#include 
#include 
#include 
#include "DHTesp.h"

const int DHT_PIN = 15;
DHTesp dhtSensor;
char auth[] = "o6bjtKyM0SGQSl7lFN7_Tz_Rg5ztNW0b";
char ssid[] = "Wokwi-GUEST";
char pass[] = "";
BlynkTimer timer;

BLYNK_WRITE(V0)
{
 int pinValue = param.asInt();
 digitalWrite(LED,pinValue);
}

void sendSensor()
{
 TempAndHumidity  data = dhtSensor.getTempAndHumidity();
 Serial.println("Temp: " + String(data.temperature, 2) + "°C");
 Serial.println("Humidity: " + String(data.humidity, 1) + "%");
 Serial.println("---");
 Blynk.virtualWrite(V0, data.temperature); //mengirimkan data ke Virtual pin di Blynk Cloud
}

void setup()
{
  Serial.begin(9600);
  Blynk.begin(auth, ssid, pass);
  pinMode(LED, OUTPUT);
  dhtSensor.setup(DHT_PIN, DHTesp::DHT22);
  timer.setInterval(2000L, sendSensor);
}

void loop()
{
  Blynk.run();
  timer.run();
}
        

3. Tambahkan library Blynk dan DHT sensor library for ESPx
4. Jalankan simulator
   

6. Challenge

Tambahkan pembacaan kelembaban pada dashboard blynk.

Daftar Pustaka

1. Fielding, R. T. et al. (1999). Hypertext Transfer Protocol -- HTTP/1.1. RFC 2616.
2. MDN Web Docs: HTTP
3. Random Nerd Tutorials - ESP32 HTTP

Glosarium Istilah

HTTP

Protokol komunikasi client-server untuk web.

Request

Permintaan data yang dikirim client ke server.

Response

Balasan data yang dikirim server ke client.

HTTP Client

Komponen yang mengirim permintaan HTTP ke server.