DEV Community

loading...
Cover image for Serverless dengan Cloudflare Workers

Serverless dengan Cloudflare Workers

armedi profile image Armedi Updated on ・3 min read

It’s a movement that is defined by empowering developers to single-handedly build apps that handle production level traffic. They don’t have to actively manage scaling their infrastructure. They don't have to provision servers, or pay for resources that go unused. They can just focus on building. https://www.serverless.com/learn/manifesto/

Kalau bicara soal traffic handling, semua developer pasti kenal dengan nama Cloudflare. Misalnya untuk urusan CDN, data builtwith.com menunjukkan bahwa Cloudflare memegang market share terbesar dengan digunakan oleh 45,14% dari top 10k websites. Cloudflare sendiri mengklaim melayani lebih dari 25 juta internet properties.

Dalam bidang serverless computing Cloudflare memiliki Cloudflare Workers yang men-support secara penuh bahasa pemrograman javascript.
Dibandingkan dengan AWS Lambda, atau Google Cloud Functions, memang product yang ditawarkan oleh Cloudflare ini kalah populer.

Tapi ada keunikan sendiri yang membedakannya dengan AWS atau Google. Uniknya adalah code javascript tidak running diatas Node.js, tapi menggunakan V8 Isolates.

Dengan model ini tidak ada yang namanya cold start, yaitu ketika request pertama akan memperoleh response yang lambat karena instance membutuhkan waktu untuk "bangun" dari sebelumnya dalam kondisi "tidur" ketika tidak ada request yang masuk dalam rentang waktu tertentu. Dan juga tidak ada pemilihan lokasi seperti di AWS misalnya memilih lokasi ap-southeast-1 untuk data center Singapore.

Kenapa tidak perlu memilih lokasi? Karena code akan running di lokasi terdekat dengan user, atau biasa disebut dengan istilah Edge Computing. Misalnya jika user datang dari pulau Jawa, maka akan otomatis di-serve oleh data center Cloudflare yang ada di Jakarta.

Untuk artikel ini saya membuat ulang url-shortener yang telah saya buat dua minggu yang lalu dengan Netlify redirects.

Kali ini menggunakan Cloudflare Worker. Saya tambahkan juga user interface di website https://kuy.app sehingga sekarang bisa digunakan oleh siapa saja.

Setup

Dokumentasi lebih detil terdapat di Gettting Started resmi Cloudflare Workers.

   npm install -g @cloudflare/wrangler
Enter fullscreen mode Exit fullscreen mode
  • Buat project baru dengan template starter
   wrangler generate my-worker
   cd my-worker
Enter fullscreen mode Exit fullscreen mode

Di dalam folder my-worker akan terdapat file konfigurasi wrangler.toml untuk konfigurasi account_id. Dapatkan account_id kamu di dashboard Cloudflare, lalu update file wrangler.toml

   name = "hello"
   type = "javascript"
   account_id = "<your cloudflare account_id>"
   workers_dev = true
   route = ""
Enter fullscreen mode Exit fullscreen mode
  • Untuk menjalankan di environment development
   wrangler dev
Enter fullscreen mode Exit fullscreen mode

Development server akan berjalan default di http://localhost:8787

Menghandle Request dengan Cloudflare Worker

Menulis code javascript untuk Cloudflare Workers tidak sama dengan menulis code untuk Node.js, tapi seperti menulis code untuk Service Worker.

Request yang masuk ke workers akan diterima sebagai event fetch. Lalu untuk response yang dikirim ke user, dibuat menggunakan object Response standard dari Web API.

Hello World dengan Cloudflare Workers:

addEventListener('fetch', (event) => {
  event.respondWith(
    new Response('Hello world!', {
      headers: { 'content-type': 'text/plain' },
    })
  );
});
Enter fullscreen mode Exit fullscreen mode

Detil dari request terdapat pada properti event.request yang juga merupakan object Request standard dari Web API.

Jika body request yang masuk adalah berupa data JSON, bisa diparse dengan method .json()

addEventListener('fetch', (event) => {
  if (event.request.method === 'GET') {
    event.respondWith(
      new Response('Hello world!', {
        headers: { 'content-type': 'text/plain' },
      })
    );
  } else {
    event.request.json().then((body) => {
      // echo user request
      event.respondWith(
        new Response(JSON.stringify(body), {
          headers: { 'content-type': 'application/json' },
        })
      );
    });
  }
});
Enter fullscreen mode Exit fullscreen mode

Publish ke Cloudflare Workers

Untuk mem-publish gunakan command berikut

wrangler publish
Enter fullscreen mode Exit fullscreen mode

Nah untuk code yang berkaitan dengan metode url shortening bisa langsung dilihat saja di repository github berikut:

Untuk data persistence, di sini saya menggunakan faunaDB yang juga sangat cocok digunakan pada environment serverless.

Discussion (0)

pic
Editor guide