Friday, November 22, 2019

GET Response Header 'Date'

Sistem kami (HTML/Javascript) ingin mengetahui kapan terakhir sebuah file diperbaharui, jika lebih dari misalkan 15 detik, maka ada proses yang akan ditrigger. Untuk mendapatkan waktu terakhir sebuah file diperbaharui kami memanfaatkan AJAX JQuery, Anda juga bisa menggunakan alternatif selain JQuery, yaitu Fetch API.



Berikut contoh dengan menggunakan JQuery:

header_check = $.ajax({
    type: 'HEAD',
    url: 'https://hls.net/index.m3u8,
    success: function() {
        d = new Date(header_check.getResponseHeader("Last-Modified"))
        console.log(d)
    },
    error: function() {
        console.log('Error');
    }
});

Perintah console.log(d) akan mengeluarkan informasi waktu kapan terakhir file index.m3u8 itu diperbaharui.

Untuk mendapatkan gap/selisih waktu maka kami memerlukan informasi waktu sekarang, agar perbandingan sesuai yang diinginkan maka sistem perlu tahu waktu server dimana file index.m3u8 tersebut berada dan kami tidak ingin membuat Endpoint API untuk mendapatkan waktu server.

Tentu sangat mudah untuk mendapatkannya walau tanpa API, iya kan?! Pada saat itu kami berpikir itu sangat mudah karena jika Anda mengaktifkan Developer Tools pada browser, Anda bisa melihat data Response Headers pada sebuah file yang didownload pada halaman HTML tersebut. Contoh seperti gambar di bawah:

















Nah, jadi kami cukup menambahkan script yaitu:

current = new Date(header_check.getResponseHeader("Date"))

Maka kami akan langsung mendapatkan waktu server. Namun kenyataannya tidak semudah itu hehe...

Hasil dari variabel current itu adalah null/undefined/unknown/kosong/tidak bernilai. Kami coba untuk menampilkan semua Response Header yang ternyata hanya memunculkan 3 value, yaitu:

  • Content-Length
  • Content-Type
  • Last-Modified

Karena data response header dikeluarkan dari Web Server, kami berharap ini bisa solved dengan mengotak-atik Web server yang kita gunakan adalah Nginx. Sambil cari-cari referensi mengenai directive pada konfigurasi Nginx yang bisa menambahkan Date pada response header, alhamdulillaah kami mendapatkan Access-Control-Expose-Headers, untuk memunculkannya kami menambahkan baris kode berikut ke dalam konfigurasi Nginx.

add_header 'Access-Control-Expose-Headers' 'Date';

Setelah Nginx direstart, alhamdulillaah sudah bisa muncul nilai variabel current yang mengambil variabel Date pada response header, lihat gambar di bawah:





No comments: