HTTP GET request di JavaScript?
Saya perlu melakukan HTTP GET permintaan dalam JavaScript. Apa's cara terbaik untuk melakukan itu?
Aku harus melakukan ini di Mac OS X dashcode widget.
747
26
Saya perlu melakukan HTTP GET permintaan dalam JavaScript. Apa's cara terbaik untuk melakukan itu?
Aku harus melakukan ini di Mac OS X dashcode widget.
Browser (dan Dashcode) memberikan XMLHttpRequest object yang dapat digunakan untuk membuat permintaan HTTP dari JavaScript:
Namun, sinkron permintaan berkecil hati dan akan menghasilkan peringatan di sepanjang baris:
Anda harus membuat permintaan asynchronous dan menangani respon dalam sebuah event handler.
Di jQuery:
Banyak saran di atas, namun tidak dapat digunakan kembali, dan terlalu sering diisi dengan DOM omong kosong dan lain bulu yang menyembunyikan kode mudah.
Berikut ini's Javascript kelas kami diciptakan's reusable dan mudah untuk digunakan. Saat ini hanya memiliki metode GET, tapi itu bekerja untuk kita. Menambahkan POSTING seharusnya't pajak orang's keterampilan.
Menggunakan hal ini sebagai mudah sebagai:
Baru
jendela.ambil
API adalah cleaner pengganti untukXMLHttpRequest
yang membuat penggunaan ES6 menjanjikan. Ada's nice penjelasan di sini, tetapi itu bermuara (dari artikel):Dukungan Browser sekarang baik dalam rilis terbaru (bekerja di Chrome, Firefox, Edge (v14), Safari (v10.1), Opera, Safari iOS (v10.3), browser Android dan Chrome untuk Android), namun IE akan kemungkinan besar tidak mendapatkan dukungan resmi. GitHub memiliki polyfill tersedia yang dianjurkan untuk mendukung browser lama sebagian besar masih di gunakan (esp versi Safari pra Maret 2017 dan mobile browser dari periode yang sama).
Saya menebak apakah ini lebih nyaman dari jQuery atau XMLHttpRequest atau tidak tergantung pada sifat proyek.
Berikut ini's link ke spec https://fetch.spec.whatwg.org/
Edit:
Menggunakan ES7 async/menanti, hal ini menjadi cukup (berdasarkan ini Gist):
Versi tanpa callback
Berikut ini adalah kode untuk melakukannya secara langsung dengan JavaScript. Tapi, seperti yang disebutkan sebelumnya, anda'a akan jauh lebih baik dengan JavaScript library. Favorit saya adalah jQuery.
Dalam kasus di bawah ini, halaman ASPX (yang's melayani sebagai orang miskin's SISANYA service) sedang dipanggil untuk mengembalikan JavaScript JSON object.
Pendek dan bersih:
const http = new XMLHttpRequest()
http.terbuka("MENDAPATKAN", "https://api.lyrics.ovh/v1/toto/africa") http.mengirim()
http.onload = () => console.log(http.responseText)
IE akan cache Url dalam rangka untuk membuat loading lebih cepat, tapi jika anda're, mengatakan, polling server pada interval mencoba untuk mendapatkan informasi baru, YAITU akan cache URL tersebut dan kemungkinan akan kembali data yang sama membuat anda've selalu memiliki.
Terlepas dari bagaimana anda melakukan GET request - vanilla JavaScript, Prototype, jQuery, dll - pastikan bahwa anda menempatkan mekanisme di tempat untuk memerangi caching. Dalam rangka untuk memerangi itu, menambahkan token unik ke akhir URL anda're akan memukul. Hal ini dapat dilakukan dengan:
Ini akan menambahkan timestamp yang unik ke akhir URL dan akan mencegah caching terjadi.
Prototype membuatnya mati sederhana
I'm tidak akrab dengan Mac OS Dashcode Widget, tetapi jika mereka membiarkan anda menggunakan JavaScript perpustakaan dan dukungan XMLHttpRequests, I'd gunakan jQuery dan melakukan sesuatu seperti ini:
Salah satu solusi yang mendukung browser lama:
Mungkin agak berlebihan, tapi anda pasti pergi aman dengan kode ini.
Penggunaan:
Bagi mereka yang menggunakan AngularJs, it's
$http.dapatkan
:Untuk melakukan ini, Mengambil API adalah pendekatan yang disarankan, menggunakan JavaScript Menjanjikan. XMLHttpRequest (XHR), IFrame objek atau dinamis <script> kategori yang lebih tua (dan clunkier) pendekatan.
Berikut adalah besar fetch demo dan MDN docs
Cara terbaik adalah untuk menggunakan AJAX ( anda dapat menemukan tutorial sederhana di halaman ini Tizag). Alasannya adalah bahwa teknik lain yang dapat anda gunakan membutuhkan lebih banyak kode, hal ini tidak dijamin untuk bekerja lintas browser tanpa mengolah dan mengharuskan anda menggunakan lebih banyak klien memori dengan membuka halaman tersembunyi di dalam frame yang lewat url parsing data mereka dan menutup mereka. AJAX adalah cara untuk pergi dalam situasi ini. Yang saya dua tahun javascript berat perkembangan berbicara.
Di widget anda's Info.plist, don't lupa untuk mengatur
AllowNetworkAccess
kunci untuk benar.Anda bisa mendapatkan permintaan HTTP MENDAPATKAN dalam dua cara:
xmlhttp.terbuka("MENDAPATKAN","URL",true); xmlhttp.send();
$("btn").click(function() { $.ajax({url: "demo_test.txt", sukses: function_name(hasil) { $("#innerdiv").html(hasil); }}); });
Hal yang sama dapat dilakukan untuk posting permintaan juga.
Silahkan lihat di link ini https://stackoverflow.com/questions/133925/javascript-post-request-like-a-form-submit
Sederhana async permintaan:
Ajax
Anda'd menjadi yang terbaik dari menggunakan perpustakaan seperti Prototype atau jQuery.