Edge Security Acceleration：Fetch API

Definisi metode Fetch API

Fetch sepenuhnya asinkron dan tidak memblokir eksekusi skrip kecuali jika Anda menggunakan await. Anda dapat mengirim hingga empat subpermintaan sekaligus. Lapisan dasar menggunakan koneksi persisten, sehingga Anda tidak perlu mengelola kolam koneksi.

Fetch mendukung permintaan HTTP atau HTTPS. Setiap redirect dihitung sebagai satu permintaan, dan setiap permintaan fetch mendukung maksimal 12 operasi redirect.

• Definisi metode

  fetch(arg, init). Untuk informasi lebih lanjut, lihat dokumentasi MDN untuk WorkerOrGlobalScope.fetch().

• Batasan metode

  • Fetch API hanya mendukung nama domain, bukan alamat IP. Port default untuk permintaan HTTP adalah 80, dan port default untuk permintaan HTTPS adalah 443.

  • Properti credentials, referrer, referrerPolicy, cache, dan integrity dari parameter init tidak berpengaruh.

  • Nilai default untuk redirect adalah follow, yang berarti fetch mengikuti respons 3xx dari server origin. Untuk mencegah fetch mengikuti respons 3xx, atur redirect ke manual.

  Catatan

  • Berbagai mode Fetch yang tersedia di browser tidak berlaku. Misalnya, pada CDN, DCDN, atau ESA, Anda dapat menggunakan CROS fetch untuk mengambil data dari server origin mana pun.

  • Untuk mengirim empat atau lebih subpermintaan, kirim tiket untuk meminta peningkatan kuota.

  • Panjang total URL permintaan tidak boleh melebihi 4 KB.

  • Sumber daya yang dikompresi Gzip yang diambil fungsi menggunakan Fetch secara default didekompresi. Untuk mencegah dekompresi default, tambahkan parameter manual. Untuk informasi lebih lanjut, lihat bagian Dekompresi.

• Mengatur periode timeout

  • Fungsi timeout

    /**
     * Implementasi kontrol timeout permintaan
     *
     * @param {Number} timeout Periode timeout, dalam ms
     * @param {Object} config Konfigurasi timeout
     *   - @param {Object|Funtion} handler Nilai yang dikembalikan saat timeout
     * @returns
     */
    const RequestTimeout = (timeout, config) => {
      return new Promise((resolve) => {
        const { handler = null } = config;
        let timer = setTimeout(() => {
          clearTimeout(timer);
          timer = null;
    
          const defaultRes = (typeof handler === 'function' ? handler() : handler) || {};
          resolve(defaultRes);
        }, timeout);
      });
    };

  • Contoh pemanggilan

    const KV_TIMEOUT = 1000;
    let edgekv = new EdgeKV({
      namespace: KV_NS,
    });
    
    let kvRequest = edgekv.get(key, getType);
    let timeoutPromise = RequestTimeout(KV_TIMEOUT, {
      handler: {
        res: {},
        errorMessage: `kv request timeout (${KV_TIMEOUT}ms)`,
      }
    });
    
    let resp = await Promise.race([
      kvRequest,
      timeoutPromise,
    ]);
    
    if (resp === undefined) {
      return "kv not found, key = " + key;
    } else {
      return resp;
    }

Redirect

Dekompresi

content-length

Header

• Definisi

  Untuk informasi lebih lanjut tentang objek Headers, lihat Headers.

• Batasan

  Header mencatat jumlah sumber daya memori yang dikonsumsi. Ukuran maksimum objek Headers adalah 8 KB. Jika melebihi batas ini, pengecualian JavaScript akan dilemparkan.

• Blacklist

  Fetch API menggunakan blacklist header. Jika Anda mencoba membaca atau menulis header yang termasuk dalam blacklist, pengecualian akan dilemparkan. Tabel berikut menjelaskan header yang termasuk dalam blacklist.

  • expect

  • te

  • trailer

  • upgrade

  • proxy-connection

  • connection

  • keep-alive

  • dnt

  • host

  • Header yang dicadangkan

Request

• Definisi

  Untuk informasi lebih lanjut, lihat dokumentasi MDN untuk Request.

• Batasan

  Properti-properti berikut dari objek Request tidak diimplementasikan dan tidak berlaku dalam konteks CDN, DCDN, atau ESA:

  • context

  • credentials

  • destination

  • integrity

  • mode

  • referrer

  • referrerPolicy

  • cache

• Penggunaan umum

  • Ambil metode permintaan: request.method.

  • Ambil URL permintaan: request.url.

  • Ambil header permintaan: request.headers.

  • Ambil muatan permintaan: request.body. Badan ini merupakan objek ReadableStream.

  • Ambil JSON: await request.json().

  • Ambil data formulir: await request.formData().

  • Ambil string UTF-8: await request.text().

  Antarmuka Request merupakan perluasan dari standar dan memungkinkan Anda mengabaikan badan permintaan sekaligus memastikan aliran badan sepenuhnya dibaca dari soket dasar. Badan tidak dimuat ke dalam memori mesin virtual JavaScript, sehingga menghindari penundaan pengumpulan sampah (GC). Jika Anda tidak perlu membaca badan permintaan Fetch, panggil request.ignore, misalnya await request.ignore(). Hal ini meningkatkan performa karena runtime secara otomatis mengembalikan koneksi ke kolam koneksi untuk digunakan kembali setelah badan sepenuhnya dibaca.

Response

• Definisi

  Untuk informasi lebih lanjut, lihat dokumentasi MDN untuk Response.

• Batasan

  Properti useFinalURLS dan error dari objek Response tidak diimplementasikan dan tidak berlaku dalam konteks CDN, DCDN, atau ESA.

• Penggunaan umum

  • Ambil kode respons: response.status.

  • Ambil frasa alasan respons: response.statusText.

  • Ambil header respons: response.headers.

  • Ambil URL respons: response.url. Ini adalah URL akhir setelah semua redirect.

  • Ambil daftar semua URL redirect (non-standar): response.urlList. Objek Response mengimplementasikan mixin badan, mirip dengan objek Request. Anda dapat menggunakan metode serupa untuk mengambil objek badan.

FormData

• Definisi

  Untuk informasi lebih lanjut tentang operasi FormData, lihat FormData.

• Batasan

  Operasi FormData mirip dengan operasi Headers dan membatasi ukuran header. Jika ukuran header melebihi batas atas, pengecualian akan dilemparkan. Jika Anda mengirim FormData sebagai badan permintaan HTTP, content-type secara default diatur ke form-data/multipart.

URLSearchParams

• Definisi

  Untuk informasi lebih lanjut tentang operasi URLSearchParams, lihat URLSearchParams().

• Batasan

  Jika Anda mengirim URLSearchParams sebagai badan permintaan HTTP, content-type secara default diatur ke application/x-www-form-urlencoded. Ukuran data tidak boleh melebihi 1.000 byte.

Blob dan File

• Definisi

  • Untuk informasi lebih lanjut tentang operasi Blob, lihat Blob.

  • Untuk informasi lebih lanjut tentang operasi File, lihat File.

• Batasan

  ER mendukung kelas Blob dan File sesuai standar. Namun, ER tidak dapat membaca atau menulis file. Anda dapat meneruskan objek Blob dan File yang didukung ER ke badan respons. Nilai header content-type akan sama dengan tipe MIME yang ditentukan dalam operasi Blob atau File.