Cara Menggunakan API Fetch di Node.js, Deno, dan Bun

Artikel ini meneroka cara menggunakan API Fetch dalam Node.js, Deno, dan Bun.

mata teras

API API dalam persekitaran JavaScript moden:

Artikel ini membincangkan cara menggunakan API Fetch dalam pelbagai persekitaran JavaScript seperti Node.js, Deno, dan Bun, alternatif mudah xmlhttprequest moden dan lebih biasa struktur berasaskan janji dan kemudahan penggunaannya.
• Perbezaan dalam pelanggan dan pelayan mengambil penggunaan:
Walaupun API Fetch menyediakan antara muka yang konsisten dalam persekitaran klien dan pelayan, artikel ini menyoroti perbezaan utama dalam sekatan penggunaan, seperti pada CORS dan CSP klien, serta sekatan pelayan, tetapi mungkin terdapat sekatan API pihak ketiga.
• Dasar Permintaan Memperolehi Berkesan:
Artikel ini menekankan kepentingan dasar permintaan yang efisien, seperti menggunakan janji. pengendalian ralat.
Ambil API dan xmlhttprequest

Mendapatkan data melalui permintaan HTTP adalah aktiviti asas aplikasi web. Anda mungkin telah membuat panggilan sedemikian dalam penyemak imbas anda, tetapi API Fetch disokong secara asli di Node.js, Deno, dan Bun.

Dalam penyemak imbas, anda mungkin perlu meminta maklumat dari pelayan untuk memaparkan maklumat tanpa penyegaran skrin penuh. Ini sering dirujuk sebagai permintaan AJAX atau satu aplikasi halaman (SPA). Antara tahun 1999 dan 2015, XMLHTTPREQUEST adalah satu -satunya pilihan -

Jika anda ingin menunjukkan kemajuan muat naik fail, ia masih berlaku. XMLHTTPREQUEST adalah API berasaskan panggil balik yang agak canggung, tetapi ia membolehkan kawalan halus, dan, walaupun namanya, ia mengendalikan respons dalam format selain XML-seperti Teks, Binari, JSON, dan HTML.

Pelayar telah melaksanakan API Fetch sejak 2015. Ia adalah alternatif yang lebih mudah, lebih mudah, lebih konsisten, berasaskan janji daripada XMLHTTPREQUEST. kod sisi pelayan anda juga mungkin perlu membuat permintaan HTTP-biasanya memanggil API pada pelayan lain. Bermula dari versi pertama mereka, Runtime Deno dan Bun secara berkesan meniru API Fetch Pelayar supaya kod serupa dapat dijalankan pada kedua -dua klien dan sisi pelayan. Node.js memerlukan modul pihak ketiga seperti nod-fetch atau axios sehingga Februari 2022, dengan versi 18 menambah API Fetch Standard. Ia masih dianggap eksperimen, tetapi kini anda boleh menggunakan FETCH () di mana sahaja dalam kebanyakan kes menggunakan kod yang sama.

Contoh Fetch Asas

Contoh mudah ini mendapat data tindak balas dari URI:

Panggilan mengambil () pulangan kembali janji yang menyelesaikan objek respons, memberikan maklumat mengenai hasilnya. Anda boleh menghuraikan badan tindak balas HTTP ke dalam objek JavaScript menggunakan kaedah berasaskan janji. Json ():

<code class="language-javascript">const response = await fetch('https://www.php.cn/link/9313f5e96e48503b676b16e2e0d41455');</code>

pelanggan dan server mengambil

API mungkin sama di pelbagai platform, tetapi penyemak imbas menguatkuasakan sekatan ketika membuat klien mengambil () permintaan:

• Perkongsian Sumber Sumber Cross-Original (CORS)

  JavaScript pelanggan hanya boleh berkomunikasi dengan titik akhir API dalam domainnya sendiri. Skrip yang dimuatkan dari

  https://www.php.cn/link/7d95c1c55d84afc81845d9fb25c0cc0c boleh memanggil 8 E.G. 🎜> https://www.php.cn/link/a9db15913897019149a280733f4a0f8api/ atau . tidak boleh memanggil perkhidmatan di https://www.php.cn/link/246E28F16369B577BD206CFA3B36295C

Dasar Keselamatan Kandungan (CSP)

• Laman web/aplikasi anda boleh menetapkan header HTTP-Policy-Policy kandungan atau tag meta untuk mengawal aset yang dibenarkan dalam halaman. Ia boleh menghalang ini jika skrip, iframes, fon, imej, video, dan lain -lain secara tidak sengaja atau disuntik secara berniat jahat. Sebagai contoh, menetapkan lalai-src 'diri' menghalang pengambilan () daripada meminta data di luar domainnya sendiri (XMLHTTPREQUEST, WebSocket, acara-acara dan suar pelayan juga terhad).

  Panggilan API mengambil sisi pelayan di Node.js, Deno, dan Bun kurang ketat dan anda boleh meminta data dari mana-mana pelayan. Iaitu, API pihak ketiga boleh:

memerlukan beberapa jenis pengesahan atau kebenaran menggunakan kunci atau oauth

mempunyai ambang permintaan maksimum, seperti tidak lebih dari sekali panggilan seminit, atau
yuran komersil dikenakan untuk lawatan
• Anda boleh menggunakan panggilan server () panggilan ke permintaan klien proksi supaya anda boleh mengelakkan masalah CORS dan CSP. Yang berkata, ingatlah sebagai warganegara siber yang bertanggungjawab dan bukan perkhidmatan bom dengan beribu -ribu permintaan, yang boleh menyebabkan mereka terhempas!

Permintaan pengambilan adat

Contoh di atas meminta data dari URI https://www.php.cn/link/9313f5e96e48503b676b16e2e0d41455

. Di bawah permukaan, JavaScript mencipta objek permintaan yang mewakili butiran lengkap permintaan, seperti kaedah, tajuk, teks badan, dll.

ambil () Menerima dua parameter:

sumber - objek rentetan atau url, dan

Parameter pilihan pilihan yang mengandungi tetapan permintaan lain
• Contoh:

Objek pilihan

boleh menetapkan sifat berikut dalam node.js atau kod klien:

属性	值
method	GET（默认）、POST、PUT、PATCH、DELETE 或 HEAD
headers	字符串或 Headers 对象
body	可以是字符串、JSON、blob 等
mode	same-origin、no-cors 或 cors
credentials	omit、same-origin 或 include
redirect	follow、error 或 manual
referrer	引荐 URL
integrity	子资源完整性哈希
signal	AbortSignal 对象，用于取消请求

Anda boleh memilih untuk membuat objek permintaan dan lulus untuk mengambil (). Ini berguna jika anda boleh mendefinisikan titik akhir API atau ingin menghantar satu siri permintaan yang serupa:

<code class="language-javascript">const response = await fetch('https://www.php.cn/link/9313f5e96e48503b676b16e2e0d41455');</code>

(Kandungan berikut ditinggalkan, kerana panjangnya terlalu panjang, kandungan teras telah diringkaskan di atas. Jika perlu, anda boleh terus memproses bahagian yang tinggal, seperti pemprosesan tajuk HTTP, pemprosesan janji, tindak balas analisis, permintaan pengguguran, dll.)

Ringkasan

Kecuali anda menggunakan versi lama Node.js (17 atau lebih rendah), API Fetch boleh didapati di kedua -dua pelayan dan JavaScript klien. Ia fleksibel, mudah digunakan, dan konsisten merentasi semua runtime. Modul pihak ketiga hanya diperlukan jika anda memerlukan ciri-ciri yang lebih canggih seperti caching, cuba semula, atau pemprosesan fail.

Atas ialah kandungan terperinci Cara Menggunakan API Fetch di Node.js, Deno, dan Bun. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!