Express(06):参数处理-ajax测试

  • 处理JSON
  • juery测试调用

引入jquery

位置:./public/jquery.js

测试

  • server.js
/*
    参数处理
 */

const express = require('express');
const app = express();
const bodyParser = require('body-parser');

//挂载内置中间件
app.use(express.static('public'));

//挂载参数处理中间件(post)
//parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }));
// parse application/json  处理JSON
app.use(bodyParser.json());

//内置处理get参数
app.get('/login',(req,res)=>{
    let data = req.query;
    console.log(data);
    res.send('get data');
});

//处理post提交参数
app.post('/login',(req,res)=>{
    let data = req.body;
    // console.log(data);
    // res.send('ok');
    if(data.username === 'admin' && data.password === '123'){
        res.send('success');
    }else{
        res.send('failure');
    }
});

app.put('/login',(req,res)=>{
    res.end('put data');
});

app.delete('/login',(req,res)=>{
    res.end('delete data');
});

app.listen(3000,()=>{
    console.log("服务启动……");
});

  • login.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="./jquery.min.js"></script>
    <script type="text/javascript">
        $(function (){
            $('#btn').click(function (){
                var obj = {
                    username: $('#username').val(),
                    password: $('#password').val()
                }
                $.ajax({
                    type:'delete',
                    // url:'http//localhost:3000/login',
                    url:'/login',
                    contentType:'application/json',
                    dataType:'text',
                    // data:$('form:eq(0)').serialize(),
                    data: JSON.stringify(obj),
                    success:function(data){
                        console.log(data);
                    }
                });
            });
        });
    </script>
</head>
<body>
    <form action="http://localhost:3000/login" method="post">
        用户名:<input type="text" name="username" id="username"><br/>
        密码:<input type="password" name="password" id="password"><br/>
<!--        <input type="submit">-->
        <input type="button" id="btn" value="提交">
    </form>
</body>
</html>
posted @ 2020-10-20 10:35  mrtransition  阅读(100)  评论(0)    收藏  举报