发送浏览器响应

Question

如何在浏览器页面上显示表单的输出，而不仅仅是在控制台上显示？

这里是我的代码：

var express = require('express') 
var bodyParser = require("body-parser"); 
var app = express() 
var http = require('http'); 

app.get('/', function(request, response, next) { 
    response.send("My Server"); 
}); 

app.use(express.static('public')) 


app.use(bodyParser.urlencoded({ extended: false })); 


app.post('/users', function (req, res, next) { 
    let username = req.body.name; 
    let password = req.body.password; 

    console.log("Just received POST data for users endpoint!"); 
    console.log(`Data includes: ${username}, ${password}`); 
}); 

Answer 1

假设你已经配置在服务器SISE这条路线：

app.post('/users', function (req, res, next) { 
    let _username = req.body.name; 
    let _password = req.body.password; 
    res.send({username: _username, pwd: _password}); 
}); 

而且，客户端女士，你使用jQuery和你做的异步请求到服务器这个HTML表单：

<form name="module"> 
    <p>Username</p> 
    <p><input type="text" name="username" id="username"></p> 
    <p>Password</p> 
    <p><input type="text" name="password" id="password"></p> 
    <input type="button" id="submit" value="Send"> 
</form> 

<div id="result"></div> 

你可以做一个POST请求，并解析第e以这种方式响应数据：

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#submit").click(function(){ 
    var _username= $("#username").val(); 
    var _password= $("#password").val(); 
    $.ajax({ 
     type: "POST", 
     url: "<YOUR_NODEJS_SERVER_URL>", 
     data: '{"username":_username, "password": _password}', 
     contentType: "application/json", 
     dataType: 'json', 
     success: function(response) 
     { 
     $("#result").html(response.username + "<br/>" + response.pwd); 
     }, 
     error: function(error) 
     { 
     alert(error); 
     } 
    }); 
    }); 
}); 
</script>