ES6笔记六

最新推荐文章于 2024-09-26 17:12:37 发布

灯莘

最新推荐文章于 2024-09-26 17:12:37 发布

阅读量376

点赞数 9

文章标签： es6 笔记 okhttp

本文链接：https://blog.csdn.net/2201_75867247/article/details/135444031

版权

本文介绍了如何使用Express创建一个监听81端口的服务，解决跨域问题，托管名为es6的静态文件，并实现/login接口进行账号密码验证。同时，展示了如何使用jQuery的AJAX调用该服务并进行输入验证。

摘要由CSDN通过智能技术生成

一、
请使用express创建服务，端口号为81，需解决跨域问题，需托管静态文件名称为es6，创建一个get接口，接口名称为/login，接口中需要验证账号为admin密码123456,验证成功返回登录成功页面路径http://127.0.0:81/es6/day01.html，否则登录失败访问http://127.0.0:81/es6/day02.html，使用jq中ajax调取服务，需要验证输入不能为空

const express = require("express");
const cors = require("cors");
const app = express();
app.use("/es6",express.static("es6"))
app.use(cors());
app.get("/login",(req,res)=>{
    console.log(req.query);
    let data = req.query;
    if(data.userName=="admin"&&data.passWord=="123456"){
        res.send("http://127.0.0.1:81/es6/day01.html
");
    }else{
        res.send("http://127.0.0.1:81/es6/day02.html
");
    }
})
app.listen(81,()=>{
    console.log("express服务启动成功");
})

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    请输入账号：<input type="text" name="" id="" class="zh"><br>
    请输入密码：<input type="text" name="" id="" class="mm"><br>
    <button class="btn">登录</button>

</body>
<script src="../es6/jquery-1.8.3.js"></script>
<script>
    let base = "http://127.0.0.1:81";
    $(".btn").click(function(){
        let user = $(".zh").val();
        let pass = $(".mm").val();
        if(!user && !pass){
            console.log("请输入账号密码");
            return;
        }
        $.ajax({
            type:"get",
            url:`${base}/login`,
            data:{
                userName:user,
                passWord:pass
            },
            success:(req)=>{
                console.log(req);
location.href = req;

            }
        })
    })
</script>
</html>