Ajax --- Enviar datos POST al servidor

POST 请求 方式
xhr.setRequestHeader ('Content-type', 'application / x-www-form-urlencoded')
xhr.send ('name-zhangsan & age = 20');

Mensaje de solicitud
El bloque de datos transferido en el proceso de solicitud y respuesta HTTP se denomina mensaje, que incluye los datos que se transmitirán y alguna información adicional, que debe cumplir con el formato prescrito.

Instale body-parser, ingrese en el directorio raíz del proyecto: npm install --save body-parser  

análisis del cuerpo: https://blog.csdn.net/web_youth/article/details/80053187

.html

1  <! DOCTYPE html > 
2  < html lang = "en" > 
3  < head > 
4      < meta charset = "utf-8" >  
5      < title > Documento </ title > 
6  </ head > 
7  < body > 
8      < p > 
9          < input type = "text" id = "username"  > 
10      <
     );
20 //
         
     
     
         
     
     
         
                  Obtener cuadro de texto de nombre 
21          var username = document.getElementById ( ' nombre de usuario ' );
 22          // Obtener cuadro de texto de edad 
23          var age = document.getElementById ( ' edad ' );
 24          // Agregar evento de clic para el botón 
25          btn.onclick = function () {
 26              // Crear objeto ajax 
27              var xhr = new XMLHttpRequest ();
 28              // Obtener el valor ingresado por el usuario en el cuadro de texto 
29              var nameValue =username.value;
 30              var ageValue = age.value;
 31  
32              // parámetro de solicitud de empalme 
33              var params = ' username = ' + nameValue + ' & age = ' + ageValue;
 34  
35              // configure el objeto Ajax 
36              xhr.open ( ' post ' , ' http: // localhost: 3000 / post ' );
 37              
38              // Establezca el tipo de formato del parámetro de solicitud (se debe establecer la solicitud posterior) 
39              xhr.setRequestHeader ( 'Content-Type ' , ' application / x-www-form-urlencoded ' );
 40              // Enviar solicitud 
41              xhr.send (params);
 42              // Obtener datos de respuesta del servidor 
43              xhr.onload = function () {
 44                  console.log (xhr.responseText)
 45              }
 46          }
 47      </ script > 
48  </ body > 
49  </ html >

app.js

// Introducir el framework express 
const express = require ('express' ) 

// Introducir el módulo de procesamiento de ruta 
const path = require ('path' ) 
const bodyParser = require ('body-parser' ); 

// Crear un servidor web 
const app = express (); 

// Use bodyParser.urlencoded () para que el backend del nodo admita el primer tipo de cuerpo de solicitud. 
App.use (bodyParser.urlencoded ()); // extendido: verdadero 
// Use bodyParser.json () para hacer el nodo El segundo tipo de cuerpo de solicitud se admite en segundo plano. 
App.use (bodyParser.json ()); 

// Función de servidor de acceso a recursos estáticos 
app.use (express.static (path.join (__ dirname, 'public' ))) 


// correspondencia 04 Pasar la solicitud de post parámetros.html 
app.post ('/ post', (req, res) => {
    res.send (req.body); 
}) 


// Puerto de escucha 
app.listen (3000 ); 

// Salida de solicitud de 
consola console.log ('El servidor se inició con éxito 4')

Resultado de la operación:

 

 

Supongo que te gusta

Origin www.cnblogs.com/technicist/p/12740581.html
Recomendado
Clasificación