他的回复:
华为云ID:hw65146943ajax登录页面案例pug模版引擎h1 登录华为帐号 div 华为帐号: input(type="text" id="account" value="rocky") div 帐号密码: input(type="password" id="pwd" value="123") button(type="button" id="btn" ) 登录 script(src="/js/login.js")前端 ajax 登录设置// alert(666);var btn = document.querySelector("#btn");var account = "";var pwd = "";btn.onclick = function() { account = document.querySelector("#account").value; pwd = document.querySelector("#pwd").value; ajax({ type: "post", url: "/login", data: { account, pwd }, success(data) { alert(data); } });}function ajax(opts) { var defaultParam = { type: "get", url: "#", data: {}, async: true, success(data) { console.log("从服务器返回的数据为:" + data); } } // 新参数覆盖代替默认参数 for(var k in opts) { defaultParam[k] = opts[k]; } var xhr = null; // ajax浏览器兼容问题 if(window.XMLHttpRequest) { xhr = new XMLHttpRequest(); }else { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } // 对象 到 queryString 字符串 var paramStr = ""; for(var k in defaultParam.data) { paramStr += k + "=" + defaultParam.data[k] + "&"; } paramStr = paramStr.substring(0, paramStr.length - 1); // get or post 请求,其他请求暂且不管 if(defaultParam.type === "get") { var requestUrl = defaultParam.url + "?" + paramStr; xhr.open("get", requestUrl, defaultParam.async); xhr.send(); }else { xhr.open("post", defaultParam.url, defaultParam.async); // post 请求 设置 默认queryString 请求头 xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.send(paramStr); } xhr.onreadystatechange = function() { if(4 === xhr.readyState) { if(200 === xhr.status) { defaultParam.success(xhr.responseText); } } }}后端路由设置app.use(async function(ctx, next) { if(ctx.path === "/login") { // console.log(ctx.request.body); // 假设 与数据库的存储数据做匹配 if(ctx.request.body.account === "rocky" && ctx.request.body.pwd === "123") { ctx.body = "success 登录成功!!"; }else { ctx.body = "fail 登录失败!!"; } }});