Pasando múltiples parámetros por POST mediante XMLHttpRequest y HTML
Estoy tratando de pasar múltiples parámetros a través de un formulario HTML utilizando XMLHttpRequest. La solicitud toma una red SSID y PSK y las pasa al punto final /connect.
Funciona cuando codifico en duro el SSID y PSK utilizando:
var data = '{"ssid":"homenetwork", "psk":"mypassword"}';
xhr.send(data);
Cuando intento extraer los datos del formulario HTML, obtengo net::ERR_EMPTY_RESPONSE
en Chrome.
<!DOCTYPE html>
<html>
<br>
<label for="network">Nombre de la red (SSID):</label>
<input type="text" id="network" name="network" required="" size="15">
<label for="presharedkey">Contraseña de la red (PSK): </label>
<input type="text" id="presharedkey" name="presharedkey" required="" size="15">
<button onclick="connectWifi()">Guardar</button> <br>
<script>
function connectWifi() {
var network = document.getElementById("network").value;
var presharedkey = document.getElementById("presharedkey").value;
var url = "http://192.168.0.236:8080/connect";
var xhr = new XMLHttpRequest();
xhr.open("POST", url);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
console.log(xhr.status);
console.log(xhr.responseText);
}};
// var data = '{"ssid":"homenetwork", "psk":"mypassword"}';
var data = 'ssid='+network+'&psk='+presharedkey;
xhr.send(data);
}
</script>
</html>
La línea var data =
la tomé de esta pregunta de StackOverflow.
Gracias de antemano.
davy.ai
El problema con pasar múltiples parámetros a través de un formulario HTML en un XMLHttpRequest puede tener diferentes causas, pero aquí hay algunas cosas para verificar:
Primero, asegúrese de que el punto final
/connect
esté configurado para recibir datos en el formato que está enviando. En este caso, parece que el punto final recibe datos JSON, por lo que se necesitaxhr.setRequestHeader("Content-Type", "application/json");
para establecer correctamente el encabezado de la solicitud.Segundo, verifique que los valores que obtiene del formulario HTML sean válidos y no estén vacíos. Puede depurar esto usando
console.log(network, presharedkey)
antes de la líneavar data
para ver si los valores son los que espera.Tercero, si desea pasar los datos como JSON, primero debe serializarlos. Puede usar
JSON.stringify()
para convertir el objeto JavaScript en una cadena JSON. Por ejemplo:O, si desea pasar los datos como datos de formulario codificados en URL, puede usar
new URLSearchParams()
para crear una cadena codificada en URL. Por ejemplo:¡Espero que esto ayude!