Cara menggunakan GETASYNC pada JavaScript

Pada tahap ini kita akan menambahkan proses untuk pengambilan data artikel dari DB pada router yang sudah dibuat. Jika kamu masih ingat pada part sebelumnya tentang Dasar Router ada 2 endpoint yang digunakan untuk pengambilan data. Pertama untuk membaca semua data dan yang kedua untuk mengambil spesifik data berdasarkan ID yang ditentukan.

+-----------------------------------+------------+--------+
| Operasi                           | API Route  | Method |
+-----------------------------------+------------+--------+
| Mengambil semua artikel           | /posts     | GET    |
+-----------------------------------+------------+--------+
| Mengambil artikel berdasarkan ID  | /posts/:id | GET    |
+-----------------------------------+------------+--------+

Mengambil Semua Data

Pertama kita perlu mengimport models ke dalam router. Buka file routes/posts.js, dan tambahkan baris kode berikut:

routes/posts.js

import express from 'express'
//tambahkan baris kode ini untuk import models
const models = require['../models/index'];

Selanjutnya fokus pada bagian baris kode ini:

routes/posts.js

// Route untuk mengambil semua data artikel
router.get['/', function[req, res, next] {
  res.send['router posts'];
}];

Ubah bagian tersebut menjadi seperti kode di bawah ini:

routes/posts.js

/**
 * Route untuk mengambil semua data artikel
 */
router.get['/', async function[req, res, next] {
  try {
    //mengambil semua data
    const posts = await models.posts.findAll[{}];
    
    if [posts.length !== 0] {
      res.json[{
        'status': 'OK',
        'messages': '',
        'data': posts
      }];
    } else {
      res.json[{
        'status': 'EMPTY',
        'messages': 'Data is empty',
        'data': {} 
      }];
    }
  } catch [err] {
    res.status[500].json[{
      'status': 'ERROR',
      'messages': 'Internal Server Error'
    }]
  }
}];

Sedikit penjelasan dari kode di atas

const posts = await models.posts.findAll[{}];

Baris kode di atas digunakan untuk mengambil semua data artikel dari tabel posts. posts sendiri adalah nama model yang merepresentasikan nama tabel dan findAll adalah method yang digunakan untuk mengambil semua data. Jika ditulis ke dalam query MySQL kira-kira akan seperti ini:

SELECT * FROM posts

Untuk mengecek apakah kode sudah benar kita bisa mencoba mengakses API kita menggunakan POSTMAN atau bisa menggunakan CURL dengan mengetikkan perintah ini di terminal:

curl -X GET //localhost:3000/posts

Kalau benar seharusnya outputnya akan seperti ini:

{"status":"OK","messages":"","data":[{"id":1,"title":"Hello World","content":"Lorem ipsum dolor sit amet, consectetur adipisicing elit.","tags":"hello,world","published":false,"created_at":"2020-01-27T23:13:30.000Z","updated_at":"2020-01-27T23:13:30.000Z"},{"id":2,"title":"Lorem Ipsum","content":"Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.","tags":"lorem,ipsum","published":false,"created_at":"2020-01-27T23:13:30.000Z","updated_at":"2020-01-27T23:13:30.000Z"}]}

Mengambil Data berdasarkan ID

Selanjutnya untuk router yang menangani pengambilan data berdasarkan ID maka kita perlu mengubah baris kode pada bagian ini:

routes/posts.js

/**
 * Route untuk mengambil artikel berdasarkan ID
 */
router.get['/:id', function[req, res, next] {
	  
}];

Lakukan perubahan menjadi seperti ini

routes/posts.js

/**
 * Route untuk mengambil artikel berdasarkan ID
 */
router.get['/:id', async function[req, res, next] {
  try {			
    //mengangkap param ID
    const id = req.params.id;
    const post = await models.posts.findByPk[id];		
		
    if [post] {
      res.json[{
        'status': 'OK',
        'messages': '',
        'data': post
      }];
    } else {
      res.status[404].json[{
        'status': 'NOT_FOUND',
        'messages': 'Data not found',
        'data': null 
      }];
    }
  } catch [err] {		
    res.status[500].json[{
      'status': 'ERROR',
      'messages': 'Internal Server Error'
    }]
  }
}];

Pada proses ini kita perlu menangkap parameter ID dengan perintah ini:

const post = models.posts.findByPk[id];

Kalau data ditemukan maka API akan mengembalikan response data itu sendiri dengan status OK dan sebaliknya kalau data tidak ditemukan maka akan mengembalikan response status 404 [Data not found].

Oke coba kita test lagi menggunakan CURL. Pertama kita akan mengetes menggunakan ID yang valid.

curl -X GET //localhost:3000/posts/1

Jika data ditemukan akan menghasilkan response seperti ini:

{"status":"OK","messages":"","data":{"id":1,"title":"Hello World","content":"Lorem ipsum dolor sit amet, consectetur adipisicing elit.","tags":"hello,world","published":false,"created_at":"2020-01-27T23:13:30.000Z","updated_at":"2020-01-27T23:13:30.000Z"}}

Kedua kita coba menggunakan ID yang tidak valid

curl -X GET //localhost:3000/posts/999

Seharusnya responsenya seperti di bawah ini. statusnya akan NOT_FOUND

{"status":"NOT_FOUND","messages":"Data not found","data":null}

Untuk mendownload atau melihat full source code pada tahap ini, silahkan kunjungi repo github //github.com/sakukode/simple-restapi/tree/v0.4

Artikel ini dibaca sebanyak 2.085 kali

Kapan kita menggunakan asynchronous?

Proses asynchronous sering digunakan untuk komunikasi data, karena data menjadi bagian inti dari sebuah aplikasi maka konsep asynchronous sangat penting untuk dipahami.

Apa itu fetch dalam JavaScript?

Fetch merupakan cara baru dalam melakukan network request. Pada dasarnya fungsi fetch memanfaatkan sebuah Promise, sehingga untuk menggunakan nya pastikan browser sudah mendukung ECMAScript 6 atau biasa disebut ES6. Good news! Karena kebanyakan browser sekarang sudah mendukung ES6 ini.

Apa itu Await di JS?

Keyword await membuat JavaScript menunggu sampai promise tersebut selesai dan mengembalikkan hasilnya.

Apa itu callback function JavaScript?

Callback pada Javascript adalah sebuah fungsi yang dikirimkan sebagai parameter fungsi lainnya. Fungsi diatas adalah sebuah contoh callback yang berjalan secara Synchronous karena fungsi callback langsung dieksekusi pada sebuah proses fungsi yang memiliki sifat synchronous.

Bài mới nhất

Chủ Đề