Scribd
Unggah
12 tayangan

Golang - Websocket

Diunggah oleh

Agus Wira Permana
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai DOCX, PDF, TXT atau baca online di Scribd
12 tayangan

Golang - Websocket

Diunggah oleh

Agus Wira Permana
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai DOCX, PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 8

Tutorial: Membangun Aplikasi Real-Time

dengan WebSockets menggunakan


Golang
Pendahuluan
Dalam dunia web development, aplikasi real-time semakin diminati
karena kemampuannya untuk memberikan pengalaman interaktif kepada
pengguna. Pengguna dapat melihat pembaruan data secara langsung
tanpa perlu melakukan refresh halaman. Salah satu teknologi yang
memungkinkan pengembangan aplikasi real-time adalah WebSocket.

WebSocket adalah protokol komunikasi dua arah yang memungkinkan


klien dan server untuk berkomunikasi secara asinkron dan real-time.
Dibandingkan dengan teknologi polling tradisional, WebSocket
mengurangi latensi dan overhead komunikasi.

Dalam tutorial ini, kita akan belajar bagaimana membangun aplikasi real-
time sederhana menggunakan WebSockets dengan bahasa pemrograman
Golang. Golang, atau sering disebut Go, adalah bahasa pemrograman
yang cepat, efisien, dan mudah dipelajari yang cocok untuk
pengembangan aplikasi real-time.

Dengan menggunakan Golang dan WebSockets, Anda akan dapat


membuat aplikasi yang dapat mengirim dan menerima data secara real-
time antara klien dan server. Aplikasi ini cocok digunakan untuk berbagai
kasus penggunaan, seperti aplikasi pesan instan, papan skor real-time,
atau pemantauan data secara langsung. Dengan demikian, mari kita
mulai membangun aplikasi real-time menggunakan Golang dan
WebSockets!

Langkah 1: Persiapan Lingkungan


Pengembangan
Sebelum kita mulai membangun aplikasi dengan Golang dan WebSockets,
pastikan Anda telah menyiapkan lingkungan pengembangan dengan
mengikuti langkah-langkah berikut:

1. Instalasi Golang
Pastikan Anda telah menginstal Golang di sistem Anda. Anda dapat
mengunduh dan menginstalnya dari situs web resmi
Golang: https://golang.org/dl/.
Setelah menginstal Golang, pastikan untuk mengatur variabel
lingkungan GOPATH dan PATH agar Golang dapat diakses dari mana saja
dalam sistem Anda.

2. Pengaturan Direktori Proyek


Buatlah sebuah direktori baru untuk proyek Anda. Direktori ini akan
menjadi tempat untuk menyimpan semua file yang terkait dengan aplikasi
real-time yang akan kita bangun.
mkdir websocket-app

cd websocket-app

Code language: Bash (bash)

3. Mengatur Dependency
Untuk proyek ini, kita akan menggunakan paket gorilla/websocket untuk
mengelola koneksi WebSocket. Anda dapat menginstalnya menggunakan
perintah berikut:
go get github.com/gorilla/websocket

Code language: JavaScript (javascript)


Setelah menginstal paket ini, kita siap untuk melangkah ke langkah
berikutnya dalam pembangunan aplikasi real-time dengan Golang dan
WebSockets. Dengan persiapan lingkungan pengembangan yang telah
dilakukan, Anda siap untuk mulai membangun aplikasi!

Langkah 2: Membuat Struktur Proyek


Setelah persiapan lingkungan pengembangan selesai, langkah
selanjutnya adalah membuat struktur proyek untuk aplikasi real-time kita.
Dalam struktur proyek ini, kita akan membuat dua file
utama: server.go untuk kode server Golang dan index.html untuk kode
klien HTML.

1. Buat Direktori Proyek


Buatlah sebuah direktori baru untuk proyek Anda. Anda dapat
memberinya nama apa pun yang Anda inginkan.
mkdir websocket-app

cd websocket-app
2. Buat File server.go
File server.go akan berisi kode server Golang yang akan menangani
koneksi WebSocket dari klien. Anda dapat membuat file ini dengan editor
teks favorit Anda dan menambahkan kode berikut:
package main

import (

"fmt"

"net/http"

"github.com/gorilla/websocket"

var upgrader = websocket.Upgrader{

ReadBufferSize: 1024,

WriteBufferSize: 1024,

func main() {

// Handle WebSocket connections

http.HandleFunc("/ws", handleWebSocket)
// Start the server

fmt.Println("Server started on port 8080")

http.ListenAndServe(":8080", nil)

func handleWebSocket(w http.ResponseWriter, r *http.Request) {

// Upgrade HTTP connection to WebSocket

conn, err := upgrader.Upgrade(w, r, nil)

if err != nil {

fmt.Println("Error upgrading to WebSocket:", err)

return

defer conn.Close()

// Infinite loop to read messages from client

for {

// Read message from client

_, message, err := conn.ReadMessage()

if err != nil {

fmt.Println("Error reading message:", err)

break
}

fmt.Printf("Received message: %s\n", message)

// Echo message back to client

err = conn.WriteMessage(websocket.TextMessage, message)

if err != nil {

fmt.Println("Error writing message:", err)

break

Code language: JavaScript (javascript)


Kode di atas membuat server HTTP sederhana yang mendengarkan
koneksi WebSocket di /ws dan menangani pesan yang dikirim oleh klien.

3. Buat File index.html


File index.html akan menjadi halaman web klien yang akan terhubung ke
server WebSocket. Buatlah file ini dalam direktori proyek Anda dan
tambahkan kode berikut:
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>WebSocket Client</title>
</head>

<body>

<h1>WebSocket Client</h1>

<input type="text" id="messageInput" placeholder="Enter message">

<button onclick="sendMessage()">Send</button>

<div id="messageContainer"></div>

<script>

const socket = new WebSocket("ws://localhost:8080/ws");

socket.onmessage = function(event) {

const messageContainer = document.getElementById("messageContainer");

messageContainer.innerHTML += "<p>" + event.data + "</p>";

};

function sendMessage() {

const messageInput = document.getElementById("messageInput");

const message = messageInput.value;

socket.send(message);

messageInput.value = "";

}
</script>

</body>

</html>

Code language: HTML, XML (xml)


File HTML di atas berisi elemen-elemen HTML sederhana dan skrip
JavaScript untuk mengatur koneksi WebSocket ke server dan mengirim
pesan ke server saat tombol diklik.

Setelah langkah ini selesai, struktur proyek Anda telah selesai dan Anda
siap untuk menjalankan aplikasi real-time Anda dengan Golang dan
WebSockets!

Langkah 3: Menjalankan Aplikasi


Setelah semua langkah persiapan dan pembangunan selesai, saatnya
untuk menjalankan aplikasi real-time Anda dengan Golang dan
WebSockets. Berikut langkah-langkahnya:

1. Jalankan Server Golang


Buka terminal atau command prompt, dan arahkan ke direktori proyek
Anda di mana file server.go disimpan. Kemudian, jalankan perintah
berikut untuk menjalankan server Golang:
go run server.goCode language: CSS (css)
Anda akan melihat pesan “Server started on port 8080” yang
menandakan bahwa server Golang telah berhasil dijalankan.

2. Buka Halaman Klien


Buka browser web Anda dan navigasikan ke http://localhost:8080. Anda
akan melihat halaman web klien dengan input teks dan tombol Kirim.

3. Uji Aplikasi
Sekarang, Anda dapat menguji aplikasi real-time Anda:

 Ketik pesan dalam input teks dan klik tombol Kirim.


 Anda akan melihat pesan yang Anda kirim muncul di bawah input
teks.

Anda juga dapat membuka beberapa tab browser untuk melihat efek real-
time dari koneksi WebSocket, di mana pesan yang dikirim dari satu tab
akan ditampilkan di semua tab yang terbuka.
Dengan itu, Anda telah berhasil menjalankan aplikasi real-time Anda
menggunakan Golang dan WebSockets! Anda sekarang dapat
melanjutkan dengan mengembangkan fitur tambahan atau menyesuaikan
aplikasi sesuai kebutuhan Anda. Selamat mengoding!
Related

Anda mungkin juga menyukai