Stuur gegevens van NodeJS terug naar dezelfde html-pagina na indiening van het formulier

Je kunt geen gegevens naar een HTML-pagina sturen. HTML is een statisch bestandsformaat en kan zelf geen gegevens ontvangen. Een server kan dat wel, maar een HTML-bestand niet.

Wat u echter wel kunt doen, is uw postverzoek aan de clientzijde onderscheppen en naar de client verzenden met behulp van XHR en de gegevens opnieuw aan de clientzijde ontvangen, doe dan wat je wilt wanneer het script datos ontvangt . Eigenlijk gebeurt alles tussen het JavaScript-gedeelte van de pagina en de Node-server die POST-gegevens ontvangt en datos terugstuurt .

Hier is een eenvoudig voorbeeld van hoe u het POST-verzoek aan de clientzijde kunt onderscheppen:

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:het bovenstaande fragment zal mislukken met een netwerkfout omdat alleen het script aan de clientzijde aanwezig is - er draait niets op https://your-domain.com/path/to/api , maar je hebt de juiste servercode al in je vraag opgenomen. Beëindig het serverscript met res.send(datos) .