目录
版本说明：
该查询功能以查询http首部字段为目的实现的字段属性、字段内容的查询，以及对新字段信息的数据注册。
v1实现功能：
http字段查询、
新http字段相关内容的注册（添加）
实现环境（WAMP）：
windows11、Apache、MySQL、PHP8
数据库链接
查询页面
（忽略UI）
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>http报文查询</title>
<style>
/* 遮罩层样式 */
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: none;
/* 默认隐藏 */
}
/* 弹窗样式 */
.popup {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
padding: 20px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 5px;
display: none;
/* 默认隐藏 */
}
label {
width: 100px;
margin-bottom: 10px;
}
input[type="text"] {
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
font-size: 16px;
color: #555;
}
button {
padding: 5px 10px;
border-radius: 3px;
border: none;
background-color: #007bff;
color: #fff;
cursor: pointer;
}
button:hover {
background-color: #0069d9;
}
</style>
<script type="text/javascript" src="_JS/check_search.js"></script>
</head>
<body>
<form method="post">
<input type="text" name="query" placeholder="输入查询内容">
<input type="submit" value="查询" name="Http_query">
</form>
<button id="openBtn">点击按钮添加字段</button>
<div class="overlay" id="overlay"></div>
<div class="popup" id="popup">
<form method="post" onsubmit="return checkForm(this)">
<label>
字段名称：
</label>
<input type="text" value="" placeholder="注册字段名" name="key_name" /><br><br>
<label>
字段属性：
</label>
<input type="text" value="" placeholder="注册字段属性" name="key_team" /><br><br>
<label>
字段释义：
</label>
<input type="text" value="" placeholder="注册字段含义" name="key_mess"><br><br>
<bon id="closeBtn">放弃</bon>
<button type="submit" name="Http_add">添加</button>
</form>
</div>
<script>
const openBtn = document.getElementById('openBtn');
const closeBtn = document.getElementById('closeBtn');
const popup = document.getElementById('popup');
const overlay = document.getElementById('overlay');
openBtn.addEventListener('click', function() {
popup.style.display = 'block';
overlay.style.display = 'block';
});
</script>
</body>
</html>php处理逻辑
字段查询与添加：
php
<?php
//文件包含：数据库连接文件
include('mysql_connect.php');
if (!$conn) {
// 判断数据库连接状态
// die()，输出一条信息，然后退出脚本.
die('连接数据库失败！请检查数据库是否开启' . mysqli_connect_errno());
}
//请求传值
$query = $_POST['query'];
$queryHttp = strtolower($query);
//判断查询表单
if(isset($_POST['Http_query'])) {
# code...
$queryHttp = strtolower($_POST['query']);
$sql_search = "select * from info_search where http_headnam = '$queryHttp';";
$result = $conn->query(query: $sql_search);
//判断查询影响行数
if (mysqli_num_rows($result) > 0) {
$row = $result->fetch_assoc();
echo "<br>";
echo $queryHttp . "属性是：" . $row['http_info'] . "<br>";
echo $queryHttp . "意义是：" . $row['http_body'] . "<br>";
} else {
echo '<p>没有找到匹配结果或无此字段</p>';
return false;
}
}
//判断数据添加表单
if(isset($_POST['Http_add'])){
$key_name = ucwords(strtolower($_POST['key_name']));
$key_team = ucwords(strtolower($_POST['key_team']));
$key_mess = ucwords(strtolower($_POST['key_mess']));
$http_id = "select http_id from info_search;";
$now_id = mysqli_num_rows(mysqli_query($conn, $http_id));
$new_id = $now_id + 1;
$add_http = "INSERT INTO info_search VALUES ('$key_name','$key_team','$key_mess','$new_id');";
if (mysqli_query($conn, $add_http)) {
echo "<script>alert('注册成功')</script>";
mysqli_refresh($conn, MYSQLI_REFRESH_TABLES);
mysqli_close($conn);
return true;
} else {
echo "<script language='javascript'>alert('字段注册失败')</script>";
return false;
}
}
$conn->close();
?>字段添加
JS判空：只有三条内容都填写了才能添加成功。
javascript
//表单JS判断
function checkForm(form){
if(form.key_name.value == "" || form.key_name.value ==null){
alert('请输入添加字段名');
form.key_name.focus();
return false;
}
else if(form.key_team.value == "" || form.key_team.value ==null){
alert('请输入字段属性');
form.key_team.focus();
return false;
}
else if(form.key_mess.value == "" || form.key_mess.value == null){
alert('请填写字段含义');
form.key_mess.focus();
return false;
}
else{
return true;
}
}已知问题：
字段添加页面，返回button无效。
v1.1将解决！