14. Flutter - HTTP, REST API, JSON Part - 1

HTTP, REST API, JSON

Pada umumnya project yang dibuat dengan Flutter akan berkomunikasi dengan API pada sebuah server, dan kebanyakan API ini dibuat dengan desain REST dan data akan ditampilkan dalam format JSON.

Pada tutorial kali ini kita akan belajar tentang HTTP, APIs, REST dan JSON.

Komunikasi Asynchronous

Ketika aplikasi yang kita buat berkomunikasi ke / dari remote server menggunakan HTTP, hal tersebut dilakukan secara asynchronous, aplikasi tersebut tidak akan berhenti setelah mengirim request ke server tersebut, Bahasa Dart mendukung penuh pemrograman asynchronous, termasuk Futures, Paket flutter yang menggunakan Future memungkinkan developer untuk melakukan komunikasi melalui HTTP secara asynchronous, setiap kita berkomunikasi dengan server menggunakan HTTP, kita tidak akan berhenti melakukan sesatu di aplikasi tersebut, tetapi kita akan memproses success atau error dari response yang kita terima.

HTTP

Hypertext Transfer Protocol dirancang untuk memungkinkan client dan server saling berkomunikasi. HTTP bekerja dengan protokolrequest - response antara client dan server, Protokol menggambarkan bagaimana mesin berkomunikasi satu dengan lainnya menggunakan pesan, dan protokol tersebut mendefenisikan format dari pesan yang digunakan.

Request

Request adalah permintaan yang kita kirim ke server. Perhatikan contoh request berikut:

Response

Response adalah balasan yang diberikan server yang sesuai dengan permintaan kita.

Methods

Metode - metode yang terdapat pada HTTP adalah POST, GET, PUT, PATCH, dan DELETE. Metode GET yang paling sering digunakan, karena kita akan lebih sering mengakses data dari pada merubah data yang ada pada server. Metode GET digunakan untuk melakukan request data dari server sedangkan metode POST digunakan untuk mengirim data ke server, untuk mengupdate atau menyimpan data, metode PUT digunakan untuk melakukan update pada server, dan metode DELETE digunakan untuk melakukan penghapusan data pada server.

URI

Ini adalah alamat dari request dengan path dan server yang spesifik.

Contohnya: 

https://www.cnn.cm/2019/03/16/politics/beto-orourke-campaigning-while-driving/index.html

Query Parameters.

HTTP mengizinkan kita untuk memberikan/melewatkan informasi ke server pada URL menggunakan Query Parameters.

Contohnya:

http://localhost:4200/sockjs-node/info?t=1498649243238

Matrix Parameter

HTTP mengizinkan kita untuk memberikan/melewatkan informasi ke server pada URL menggunakan matrix parameter,

Contohnya:

http://localhost:4200/sockjs-node/info;t=1498649243238

Matrix parameter mirip dengan query string tetapi menggunakan pattern yang berbeda. Matrix parameter juga berbeda karena tidak memiliki ‘?’ dan matrix parameter dapat di cache.

Path Parameter.

HTTP mengizinkan kita untuk memberikan/melewatkan informasi ke server pada URL menggunakan Path parameters.

Contohnya:

http://localhost:4200/api/badges/9243238

URI Encoding

Ada beberapa karakter yang tidak dapat disertakan pada URL (sebagai contoh adalah spasi) dan beberapa karakter yang mempunyai arti khusus pada URL. Untuk mengatasi hal ini, sintak pada URL pada parameter akan di encoding untuk memastikan bahwa URL yang akan di request adalah valid.

Contohnya: karakter 'spasi' antara Atlantic dan City di encoded menjadi %20

https://trailapi-trailapi.p.mashape.com/?q[city_cont]=Atlantic%20City

Status

Status adalah bagian dari response, status menandakan apakah request berasil di proses atau tidak. Berikut adalah beberapa status kode dari HTTP:

Code		Name	Deskripsi
1xx		Informational
2xx		Success
	200	OK
3xx		Redirect
	301	Moved Permanently
	302	Moved Temporarily
4xx		Request Error
	400	Bad request	Request tidak dapat dimengerti oleh server.
	403	Forbidden	User tidak memiliki hak untuk melakukan operasi request.
	404	Not Found	Resource yang di request pada URi tidak dapat ditemukan.
	405	Method not allowed	Metode request tidak diizinkan pada resource tertentu.
5xx		Server error
	500	Internal server error	Terjadi kesalahan ada server, request tidak dapat dilakukan.
	503	Service unavailable	Server tidak tersedia, biasanya karena overload atau maintenence

Header

HTTP Header mengizinkan client dan server untuk melewatkan beberapa informasi dengan request atau response. Header pada request terdiri dari pasangan key dan value, key bersifat cas insensitive. 

Contoh:

Body

HTTP body mengizinkan client dan server untuk melewatkan informasi tambahan dengan request atau response setelah header.

body pada request tidak selalu diminta karena informasi pada body tidak selalu dibutuhkan. Request HTTP dengan metode GET, DELETE biasanya tidak memerlukan body, sedangkan pada request HTTP dengan metode POST, PUT dan PATCH memerlukan informasi ini.

body pada response digunakan untuk mengembalikan informasi dan itu bisa sangat besar, dengan jumlah data yang besar.

API

Ketika seseorang membuat API nya tersedia ke internet, mereka menulis code untuk API tersebut dan mempublishnya ke server HTTP mereka. APIs juga dikenal sebagai web services.

Kebanyakan API menggunakan arsitektur REST, yang mana itu adalah bentuk bagaimana kamu akan berkomunikasi dengan server melalui HTTP. API yang sesuai dengan arsitektur REST kebanyakan bekerja dengan cara yang sama, dengan alamat web (URIs) dan metode HTTP yag sama, kemiripan ini sangat membantu ketika kita akan bekerja dari satu API ke lainnya.

REST

REST merupakan singkatan dari Representational State Transfer. REST memberikan kita panduan desain tingkat tinggi dan kita hanya akan memikirkan bagaimana kita mengimplementasikannya.

REST APIs harus stateless.

Dahulu kala, aplikasi web digunakan untuk menyimpan data session untuk user. Sebagai contoh, user akan melakukan login dan hal ini akan memulai session dan informasi bisa disimpan pada session ini sampai user melakukan logout, data pada session ini bisa berupa informasi user tersebut, hak akses apa yang dia punya dan informasi lain yang diperlukan.

Sekarang, dengan API dan REST yang lebih modern, akses ke server dikontrol melalui token atau api keys. Juga, setiap pemanggilan API bersifat stateless - setiap request dari client ke server bersifat mandiri dan berisi semua data yang diperluan untuk mengidentifikasi siapa yang membuat request dan semua data request itu sendiri untuk melakukan operasi.

Menentukan User - Siapa yang membuat request ke API ?

Tokens

Pada aplikasi dengan halaman login, ketika user login terjadi, user diberikan token sementara untuk akses, Token ini dienkripsi dan berisi informasi tentang user dan token tersebut (misalnya kapan token akan berakhir/expires). Token ini dapat diperbaharui (refresh) setiap waktu yang ditentukan (misalnya 10 menit). Kapan pun API dipanggil dari beberapa perangkat ke server, token tesebut harus disertakan pada request header disetiap request ke server yang terjadi, jika token tidak tersedia atau tidak sah (invalid) maka server akan mengembalikan error code (biasanya kode HTTP 401 atau 403). Jika token valid maka server tahu bahwa user yang sah sedang menggunakan apikasi tersebut, server memiliki info tetang user dari token dan API  dapat melakukan operasi yang diminta.

API Keys

Jika user tidak perlu melakukan login setiap kali aplikasi digunakan, API key memungkinkan user yang terdaftar (misalnya CAT API user) untuk diidentifikasi pada header HTTP sebagai user yang sah pada setiap request yang terjadi ke server. Sama seperti Token, ini juga akan dilakukan validasi dan server akan mengembalikan kode error jika terjadi masalah.

No User Identification.

Terkadang orang mem-publish API dimana untuk mengaksesnya tidak diperlukan informasi dari user yang mengakses.

Bagaimana REST menggunakan URLs

Pada REST, URL digunakan untuk menentukan resource apa yang akan digunakan.

Base URL

Base URL adalah bagian pertama dari API, tanpa bagian dari REST. Baigan dari REST ada setelah base URL. Base URL biasanya sebagai berikut:

- Domain, contohnya: www.google.com, www.facebook.com, dll

- Optional sufix ‘api’ untuk mengindikasikan bahwa path ini hanya untuk API

- Optional sufix untuk nama dari aplikasi, API yang ditulis untuk aplikasi tersebut.

- Optional versi dari API

Sebagai contoh:

www://dummy.restapiexample.com/api/v1

URL & Paths

URL dari REST API bisa disusun dari beberapa bagian path, contohnya: http://www.example.com/customers/1234/orders/821/lineitem

Artinya:

- Pergi ke customer 1234

- kemudian order 821 untuk customer tersebut

- kemudian pergi ke line item 1 untuk order tersebut.

Bagaiana REST meenggunakan metode HTTP

Pada REST, metode HTTP digunakan untuk menggambarkan apa yang kita kerjakan. Mengambil data, post data baru (menciptakannya), mengirim data (update) dan menghapus data.

Mengakses data dengan REST API

• URI
• Tentukan data yang akan kita akses.
• daftar item-item.
• base url + nama resource
• Contohnya: www.example.com/products, biasanya ini akan mengembalikan berbagai jenis product.
• daftar item bisa jadi milik entity lainnya,
• Contohnya:
• http://www.example.com/customers/1234/orders/, Akan mengembalikan daftar order untuk customer 1234
• http://www.example.com/customers/1234/orders/123/lineItems, Akan mengembalikan line items untuk order 123 dari customer 1234
• Daftar item yang dicari
• URLnya mirip dengan cotoh yang sebelumnya, ditambah dengan informasi tambahan pada akhir untuk menentuan pencarian.
• informasi tambahan
• kita dapat menambahkan query string atau matrix / path parameter pada akhir url. Contohnya:
• http://www.example.com/products?name=mark
• kita bisa menambahkan ‘/search’ dan kriteria pencarian pada akhir URL. Contohnya:
• http://www.example.com/products/search/name/mark, yang akan mencari products dengan nama mark
• Item tunggal
• URL mirip dengan contoh sebelumnya ditambah slash kemudian identifier untuk mengidentifikasi item tersebut. Contohnya:
• http://www.example.com/products/66543, akan mengembalikan product 66543
• Item tunggal juga bisa menjadi milik entity lainnya, contohnya:
• http://www.example.com/customers/3324/orders/8769, yang akan mengembalikan item tunggal order 8769 untuk customer 3324
• HTTP Method
• kita harus menggunakan metode HTTP GET untuk mengakses data melalui REST API

• HTTP Body
• tidak digunakan

Insert DATA dengan REST API

• URI
• Tentukan data apa yang akan kita masukkan.
• ini akan sama dengan URL sebelumya. Contohnya:
• http://www.example.com/products
• http://www.example.com/customers/33245/orders/
• Atau http://www.example.com/ordres (implementasi terbuka)

• HTTP Method
• Kita harus menggunakan metode HTTP GET untuk memasukkan (menciptakan) data melalui REST API
• HTTP Body
• umumnya kita meletakkan data yang dierlukan untuk dimasukkan kedalam request body.

Update Data dengan REST API

• URI
• Identifikasi data apa yang kita update
• ini akan sama dengan URL sebelumnya untuk mengakses item tunggal. Contohnya:
• http://www.example.com/products/66432
• http://www.example.com/customers/33245/orders/8769
• HTTP Method
• kita menggunakan metode HTTP PUT untuk mengupdate data melalui REST API
• HTTP body
• umumnya kita meletakkan data yang dierlukan untuk dimasukkan kedalam request body.

Menghapus Data dengan REST API

• URI
• Identifikasi data apa yang akan kita hapus
• ini akan sama dengan URL sebelumnya untuk mengakses item tunggal. Contohnya:
• http://www.example.com/products/66432
• http://www.example.com/customers/33245/orders/8769
• HTTP Method
• kita harus menggunakan metode HTTP DELETE untuk menghapus data melalui REST API
• HTTP Body
• tidak digunakan.

JSON

JSON merupakan singkatan dari JavaScript Object Notation. JSON adalah format yang digunakan untuk melewatkan data antara client dan server (kedua arah, sever ke client, client ke server),JSON juga format data yang sama yang digunakan oleh javascript, menggunakan coma ‘,’ untuk memisahkan item-itemnya dan colon “:” untuk memisahkan property nama dan property datanya, JSON menggunakan tanda kurung yang berbeda untuk menentukan object dan array.

JSON untuk melewatkan data sebagai object.

Tandan kurung ‘{‘ dan ‘}’ digunakan untuk menunjukkan awal dan akhir dari suatu objek.

{“name”:”John”, “age”: 31, “City”: “Indonesia”}

JSON untuk melewatkan array

Tanda kurung ‘[‘ dan ‘]’ digunakan utuk menunjukkan awal dan akhir dari array.

[“Ford”, “BMW”, “Fiat”]

JSON untuk melewatkan array dari beberapa objek.

Tanda kurung dikombinasian untuk menciptakan object car, yang mempunyai dua properti ‘Nissan’ dan ‘Ford’, dimana setiap properti memiliki model-model yang tersusun dalam array.

{

  “cars”: [

    {“model : “Sentra”, “doors”:4”}, {“model”: “Maxima”, “doors”:4}

  ],

  “Ford”: [

    {“model”: “Taurus”, “doors”: 4}, {“model” : “Escort”, “doors”:4 }

  ]

}