Rumah  >  Artikel  >  hujung hadapan web  >  kaedah latar belakang panggilan javascript c

kaedah latar belakang panggilan javascript c

王林
王林asal
2023-05-12 13:58:071074semak imbas

Sebagai bahasa pengaturcaraan bahagian hadapan, JavaScript digunakan terutamanya untuk interaksi dan dinamik halaman web. Walau bagaimanapun, dengan perkembangan teknologi, JavaScript telah menarik lebih banyak perhatian daripada pembangun dari segi pengaturcaraan back-end Terutama selepas kemunculan Node.js, JavaScript telah menjadi bahasa pengaturcaraan penuh. Apabila membangunkan menggunakan JavaScript di latar belakang, memanggil kaedah latar belakang adalah fungsi penting Mari kita perkenalkan secara ringkas cara memanggil kaedah latar belakang dalam JavaScript.

1. Gunakan objek XMLHttpRequest untuk memanggil kaedah latar belakang

Objek XMLHttpRequest ialah objek yang biasa digunakan dalam JavaScript untuk bertukar data dengan pelayan Ia boleh mengemas kini halaman web tanpa memuatkan semula halaman.

1.1 Cipta objek

Apabila mencipta objek XMLHttpRequest, anda boleh menggunakan kod berikut:

var xhr = new XMLHttpRequest();

1.2 Nyatakan kaedah permintaan dan alamat permintaan

Apabila mencipta XMLHttpRequest Selepas objek, anda perlu menentukan kaedah permintaan dan alamat yang diminta. Kaedah permintaan boleh GET atau POST, dan alamat permintaan merujuk kepada alamat URL kaedah latar belakang. Ini dicapai melalui kod berikut:

xhr.open('GET', '/backend_method_url', true);

1.3 Hantar permintaan

Selepas menentukan kaedah permintaan dan alamat permintaan, hantar permintaan ke pelayan melalui kod berikut:

xhr.send();

1.4 Tetapkan fungsi panggil balik

Selepas permintaan dihantar, fungsi panggil balik perlu ditetapkan untuk mengendalikan status dan data respons permintaan. Ini dicapai melalui kod berikut:

xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && xhr.status === 200) {
        var responseText = xhr.responseText;
        console.log(responseText);
    }
}

Antaranya, xhr.readyState mewakili status objek XMLHttpRequest, dan nilai status adalah seperti berikut:

  • 0: Tidak dimulakan
  • 1: Sudah Kaedah terbuka dipanggil, kaedah hantar tidak dipanggil
  • 2: Kaedah hantar dipanggil dan permintaan sedang dihantar
  • 3 : Data yang dikembalikan oleh pelayan sedang diterima
  • 4: Semua data diterima , anda boleh menggunakan atribut responseText untuk mendapatkan semua data respons

xhr.status mewakili status HTTP Kod. Nilai kod status adalah seperti berikut:

  • 200: Permintaan berjaya
  • 404: Sumber yang diminta tidak wujud
  • 500: Ralat pelayan

1.5 Menghantar data

Selain mendapatkan data kaedah latar belakang, kami membuat permintaan kepada kaedah latar belakang , anda juga boleh menghantar beberapa data. Ini dicapai melalui kod berikut:

xhr.send('user_name=Tom&password=123456');

Parameter kaedah 'hantar' ialah data yang akan dihantar, yang boleh dalam bentuk rentetan atau data bentuk. Ia boleh diterima melalui parameter dalam kaedah latar belakang.

2. Gunakan fetch API untuk memanggil kaedah latar belakang

fetch API ialah API permintaan rangkaian baharu yang boleh digunakan untuk menggantikan objek XMLHttpRequest. Gunakan API pengambilan untuk membuat permintaan AJAX dan memproses data tindak balas dengan mudah.

2.1 Hantar permintaan

Cara menghantar permintaan menggunakan API pengambilan adalah seperti berikut:

fetch('/backend_method_url', {
    method: 'GET'
}).then(function (response) {
    return response.text();
}).then(function (data) {
    console.log(data);
});

Parameter pertama ialah alamat URL kaedah latar belakang, dan parameter kedua ialah permintaan yang mengandungi Objek yang mengandungi maklumat seperti kaedah, pengepala permintaan dan badan permintaan.

2.2 Memproses respons

Dari segi pemprosesan respons, data respons boleh diproses melalui kaedah itu. Dalam kaedah pertama kemudian, data tindak balas boleh ditukar kepada bentuk teks untuk pemprosesan yang mudah.

Berikut ialah contoh lengkap menggunakan API pengambilan untuk menghantar permintaan:

fetch('/backend_method_url', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json'
    },
    body: JSON.stringify({
        user_name: 'Tom',
        password: '123456'
    })
}).then(function (response) {
    return response.json();
}).then(function (data) {
    console.log(data);
}).catch(function (error) {
    console.log(error);
});

3 Gunakan rangka kerja jQuery untuk memanggil kaedah latar belakang

jQuery adalah yang biasa digunakan. Pustaka JavaScript yang menyediakan Banyak ciri yang dioptimumkan untuk memudahkan pengaturcaraan JavaScript. Apabila membuat permintaan AJAX, menggunakan jQuery boleh melengkapkan pemprosesan permintaan dan respons dengan lebih mudah.

3.1 Hantar permintaan

Apabila menggunakan jQuery untuk menghantar permintaan, anda boleh menggunakan kod berikut:

$.ajax({
    url: '/backend_method_url',
    type: 'GET'
}).done(function (data) {
    console.log(data);
}).fail(function (error) {
    console.log(error);
});

Atribut 'url' menentukan alamat URL latar belakang kaedah, 'type' Atribut menentukan kaedah permintaan.

3.2 Menghantar data

Apabila menggunakan jQuery untuk menghantar data, ia boleh dicapai melalui kod berikut:

$.ajax({
    url: '/backend_method_url',
    type: 'POST',
    data: {
        user_name: 'Tom',
        password: '123456'
    }
}).done(function (data) {
    console.log(data);
}).fail(function (error) {
    console.log(error);
});

Atribut 'data' menentukan data yang akan dihantar.

Di atas ialah cara menggunakan JavaScript untuk memanggil kaedah latar belakang Memandangkan JavaScript berinteraksi dengan latar belakang dengan cara yang lebih biasa, sintaks kod adalah lebih mudah dan hanya beberapa baris kod diperlukan untuk menyelesaikan operasi biasa. Sudah tentu, terdapat banyak butiran dan titik pengetahuan yang perlu kita fahami dan gunakan semasa menulis fungsi latar belakang Mujurlah, terdapat banyak tutorial dan kes yang sangat baik di Internet untuk kita pelajari dan rujuk. Semakin ramai pembangun memilih untuk menggunakan JavaScript untuk membangunkan bahagian belakang Ini juga kerana JavaScript mempunyai banyak kelebihan dari segi sintaks dan ciri-ciri saya harap kandungan di atas dapat membantu semua orang.

Atas ialah kandungan terperinci kaedah latar belakang panggilan javascript c. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn