MongoDB
 sql >> Teknologi Basis Data >  >> NoSQL >> MongoDB

Kirim data dari NodeJS kembali ke halaman html yang sama setelah pengiriman formulir

Anda tidak dapat mengirim data ke laman HTML. HTML adalah format file statis dan tidak dapat menerima data dengan sendirinya. Server bisa, tapi bukan file HTML.

Namun apa yang dapat Anda lakukan, adalah mencegat permintaan posting Anda di sisi klien, mengirimkannya ke klien menggunakan XHR dan menerima kembali data di sisi klien lagi, lalu lakukan apa pun yang Anda inginkan ketika skrip menerima datos . Pada dasarnya segala sesuatu terjadi antara bagian JavaScript halaman dan server Node yang menerima data POST dan mengirimkan kembali datos .

Berikut adalah contoh sederhana bagaimana Anda dapat mencegat permintaan POST di sisi klien:

document.querySelector('form').onsubmit = evt => {

  // don't submit the form via the default HTTP redirect
  evt.preventDefault();
  
  // get the form values
  const formData = {
    name1: document.querySelector('input[name=name1]').value,
    name2: document.querySelector('input[name=name2]').value
  }
  console.log('formData:', formData);
  
  // send the form encoded in JSON to your server
  fetch('https://your-domain.com/path/to/api', {
    method: 'POST',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify(formData),
  })
  
  // receive datos from the server
  .then(resp => resp.json())
  .then(datos => {/* do what you want here */})
  
  // catch potential errors
  .catch(err => console.log('an error happened: '+err));
  
}
<form>
  <input name="name1" value="value1">
  <input name="name2" value="value2">
  <button type="submit">Submit</button>
</form>

PS:Cuplikan di atas akan gagal dengan kesalahan jaringan karena hanya skrip sisi klien yang ada - tidak ada yang berjalan di https://your-domain.com/path/to/api , tetapi Anda sudah menyertakan kode server yang tepat dalam pertanyaan Anda. Cukup akhiri skrip server dengan res.send(datos) .




  1. Redis
  2.   
  3. MongoDB
  4.   
  5. Memcached
  6.   
  7. HBase
  8.   
  9. CouchDB
  1. MongoDB - Cara melakukan kueri pada banyak atribut dalam suatu objek dan mengelompokkan hasilnya

  2. Kesalahan saat menginstal driver mongo untuk PHP di amazon linux

  3. MongoDB - Gunakan kerangka kerja agregasi atau mapreduce untuk mencocokkan array string dalam dokumen (pencocokan profil)

  4. Kesalahan otentikasi saat mengakses mongodb melalui aplikasi Spring Boot

  5. MongoDb Streaming Keluar Data yang Dimasukkan secara Real-time (atau mendekati real-time)