修改server.js

简介: 在 `server.js` 中新增分页查询API,支持按价格、外观、类别等条件筛选武器皮肤,实现前端分页与多参数过滤功能,提升数据加载效率与用户体验。

1.2 修改server.js
添加分页查询API的入口
JavaScript
运行代码
复制代码
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
// server.js - Web 服务器,提供静态文件服务
// 提供静态文件服务(CSS、JS、图片等)
app.use(express.static(path.join(__dirname, 'public')));

// 主页路由
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname, 'public', 'index.html'));
});

// API: 获取所有筛选选项
app.get('/api/filter-options', (req, res) => {
try {
const options = getAllFilterOptions();
res.json({
success: true,
data: options
});
} catch (error) {
res.status(500).json({
success: false,
message: '获取筛选选项失败',
error: error.message
});
}
});

// API: 分页查询武器皮肤
app.get('/api/weapon-skins', async (req, res) => {
try {
const {
page = 1,
pageSize = 12,
minPrice,
maxPrice,
appearance,
category,
quality,
isCollectible,
baseWeapon
} = req.query;

// 处理数组参数
const parseArrayParam = (param) => {
  if (!param) return [];
  if (Array.isArray(param)) return param;
  if (typeof param === 'string') {
    try {
      const parsed = JSON.parse(param);
      return Array.isArray(parsed) ? parsed : [parsed];
    } catch {
      return param.split(',').filter(Boolean);
    }
  }
  return [];
};

const options = {
  page: parseInt(page),
  pageSize: parseInt(pageSize),
  minPrice: minPrice || null,
  maxPrice: maxPrice || null,
  appearance: parseArrayParam(appearance),
  category: parseArrayParam(category),
  quality: parseArrayParam(quality),
  isCollectible: isCollectible !== undefined ? (isCollectible === 'true' || isCollectible === '1') : null,
  baseWeapon: parseArrayParam(baseWeapon)
};

const result = await weaponSkinModel.getWeaponSkinsWithPagination(options);
res.json(result);

} catch (error) {
res.status(500).json({
success: false,
message: '查询武器皮肤失败',
error: error.message
});
}
});

// 启动服务器
app.listen(PORT, () => {
console.log(服务器运行在 http://localhost:${PORT});
console.log('请在浏览器中打开上述地址查看页面');
});

相关文章
|
1月前
|
前端开发 JavaScript
修改index.html
本项目为“无畏契约皮肤商城”前端页面,包含左右广告栏、导航筛选、商品展示与分页功能,支持价格、外观、类别等多维度筛选,结构清晰,适配移动端,通过HTML、CSS与JS实现交互动态加载。
|
1月前
|
JavaScript 前端开发
修改weaponSkinModel.js
在 `weaponSkinModel.js` 中新增分页查询功能,支持按类别、品质、收藏状态、基础武器等条件筛选,返回数据列表及分页信息,提升查询效率与灵活性。
3.引入图片
本文介绍了HTML中引入图片的三种方式:使用在线URL、相对路径和绝对路径。通过创建项目文件夹并整理本地资源,演示了如何正确引用图片,并重点推荐使用便于迁移的相对路径。
|
1月前
|
SQL 存储
查找全部武器
本文介绍如何通过SQL分页查询“武器皮肤”表数据,包含建表语句、测试数据插入及字段说明,涵盖武器名称、价格、品质、图片等信息,适用于游戏商城或道具管理系统开发。
|
1月前
|
存储 前端开发 JavaScript
首页搭建
本项目为无畏契约皮肤商城首页搭建,包含HTML结构、CSS样式与JS交互逻辑。实现商品展示、多条件筛选及响应式布局,通过Node.js启动服务,构建完整前端页面。
C/C++ 关于double和float两种类型的区别
C/C++ 关于double和float两种类型的区别
1257 0
C/C++ 关于double和float两种类型的区别
|
数据可视化 定位技术
地图可视化开发技巧:geojson转svg后再转emf格式插入ppt实现编辑的解决方案
地图可视化开发技巧:geojson转svg后再转emf格式插入ppt实现编辑的解决方案
626 0
Cesium给物体添加贴图
这篇文章讲解了在Cesium中如何为3D模型添加贴图,并提供了具体的实现步骤和代码示例。
870 2
|
JSON 前端开发 数据格式
Cesium案例解析(十)——CZML点
Cesium案例解析(十)——CZML点
396 0