创建一个study数据库 包含字段 id(自动递增),username,password (加密) ,course(成绩)里面有student数据表 2.使用express创建服务器 定义两个接门"/updata” : 添加学生成绩 请求方式: post参数: username,course"/course”:查询成功 请求方式: get : username, password 3.前端 (通过ajax请求后端数据) 页面1: 添加信息页面 输入账号和成绩,点击添加按钮,添加一个学生成绩 页面2: 输入账号和密码,点击查询,显示成绩
时间: 2023-06-05 12:07:10 浏览: 121
好的,让我来回答您的问题。
1. 创建一个study数据库,包含字段id(自动递增)、username、password(加密)、course(成绩),里面有student数据表。
请问您需要的是SQL语句还是整个数据库的设计方案呢?针对这个问题,我需要更多的信息才能给您一个准确的回答。
2. 使用Express创建服务器,定义两个接口:"/update" 添加学生成绩(请求方式:POST 参数:username、course);"/course" 查询成功(请求方式:GET 参数:username、password)。
好的,接口的设计方案如下:
【接口一】 添加学生成绩:
接口地址:http://xxx.xxx.xxx.xxx/update
请求方式:POST
请求参数:{
"username": "XXX", // 学生账号
"course": "XXX" // 成绩
}
【接口二】 查询成功:
接口地址:http://xxx.xxx.xxx.xxx/course?username=XXX&password=XXX
请求方式:GET
请求参数:{
"username": "XXX", // 学生账号
"password": "XXX" // 学生密码
}
3. 前端页面(通过AJAX请求后端数据)
页面1:添加信息页面。用户输入账号和成绩,点击添加按钮即可添加一个学生成绩。
页面2:用户输入账号和密码,点击查询,页面会展示学生成绩。
好的,接下来我来为您提供两个简单的前端页面设计方案。
【页面一】 添加信息页面:
页面包括两个输入框(学生账号和成绩),一个提交按钮。用户输入完学生账号和成绩后,点击提交按钮即可将数据提交到后台。接下来是HTML和JavaScript代码:
<!-- HTML代码 -->
<input type="text" id="username" placeholder="请输入学生账号">
<input type="text" id="course" placeholder="请输入成绩">
<button id="submit">提交</button>
<!-- JavaScript代码 -->
<script>
document.getElementById("submit").onclick = function() {
// 从输入框中获取数据
var username = document.getElementById("username").value;
var course = document.getElementById("course").value;
// 发送AJAX请求
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://xxx.xxx.xxx.xxx/update", true);
xhr.setRequestHeader("Content-type", "application/json");
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
alert("添加成功!");
}
}
var data = JSON.stringify({
"username": username,
"course": course
});
xhr.send(data);
}
</script>
【页面二】 查询信息页面:
页面包括两个输入框(学生账号和密码)、一个查询按钮和一个展示成绩的区域。用户输入完学生账号和密码后,点击查询按钮即可将数据提交到后台进行查询,并在页面上展示查询结果。接下来是HTML和JavaScript代码:
<!-- HTML代码 -->
<input type="text" id="username" placeholder="请输入学生账号">
<input type="password" id="password" placeholder="请输入学生密码">
<button id="query">查询</button>
<div id="result"></div>
<!-- JavaScript代码 -->
<script>
document.getElementById("query").onclick = function() {
// 从输入框中获取数据
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
// 发送AJAX请求
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
// 将查询结果展示在页面上
document.getElementById("result").innerHTML = xhr.responseText;
}
}
xhr.open("GET", "http://xxx.xxx.xxx.xxx/course?username=" + username + "&password=" + password, true);
xhr.send();
}
</script>
以上是我对您问题的回答,希望能够解决您的疑问。如果您有任何其他问题或需要进一步的帮助,请随时联系我。