微信小程序实现:流动图书馆借阅系统

0 下载量 41 浏览量 更新于2024-08-26 收藏 217KB PDF 举报
“微信小程序实战--流动图书馆”是一个利用微信小程序技术构建的图书分享与借阅平台,通过MINA框架、Flex布局、Express、WebSocket和Mongoose等技术实现。该应用旨在促进图书共享,连接有相同兴趣爱好的用户。 在这款流动图书馆小程序中,主要采用了以下几个关键技术: 1. **MINA框架**:微信小程序的基础框架,它是一个响应式的数据绑定框架,将应用程序分为视图层(View)和逻辑层(App Service)。这种分层设计有利于提高性能,使开发者能够更专注于业务逻辑和用户体验。 2. **Flex布局**:在小程序的界面设计中,使用Flex布局可以灵活地调整元素在容器中的排列方式,适应不同屏幕尺寸,确保界面在多设备上具有良好的适配性。 3. **Express**:作为HTTP服务框架,Express用于搭建后端服务器,处理HTTP请求,提供数据接口给前端调用,支持图书的发布、查询、借阅等相关操作。 4. **WebSocket**:实现前后端的实时通信,当图书状态发生变化时,如借阅、归还等,可以通过WebSocket推送给用户,保持数据的即时同步。 5. **Mongoose**:作为MongoDB的驱动库,Mongoose用于操作数据库,管理图书信息、用户数据等,支持数据的增删改查,确保数据的安全存储和高效检索。 6. **PM2**:在服务端部署时,采用PM2作为进程管理工具,确保服务的稳定运行,即使在服务器重启或异常情况下,也能自动恢复服务,避免服务中断。 7. **客户端代码结构**:每个小程序页面由.js、.json、.wxml和.wxss四部分组成,分别负责页面逻辑、配置、结构和样式。通过封装HTTP请求函数,添加sessionId到请求头,解决小程序无Cookie情况下维持会话的问题。 8. **WebSocket连接**:通过`wx.connectSocket`方法建立WebSocket连接,传递sessionId以识别用户身份,`wx.onSocketOpen`、`wx.onSocketClose`和`wx.onSocketMessage`事件监听WebSocket的打开、关闭和接收到的消息,实现实时通信功能。 流动图书馆微信小程序集成了多种技术,构建了一个功能完备的图书分享平台,不仅提供了图书漂流和借阅的功能,还通过实时通信增强了用户体验。开发者通过这个项目可以学习到微信小程序开发的完整流程,以及如何运用相关技术实现一个完整的线上服务。
2019-09-23 上传
流动图书馆是一个图书漂流和借阅工具,旨在共享闲置图书,并链接趣味相投的小伙伴。预览链接技术栈小程序MINA框架: 一个响应的数据绑定框架。分为两块视图层(View)和逻辑层(App Service)Flex:flex弹性布局Express : http服务框架websocket: 前后端消息的实时推送mongoose: 操作mongodb数据库pm2: 服务端使用pm2部署,常驻进程截图首页借阅书架发布的图书借阅的图书客户端代码结构微信小程序中每个页面会有四个文件 .js .json .wxml .wxss js文件中是页面的逻辑,json文件是页面的一些配置,wxml是小程序的页面结构,wxss为页面的样式。封装http请求const request = (obj) => {   if(obj.header){     obj.header.sessionId = session.sessionId;   }else{     obj.header = { sessionId: session.sessionId};   }   wx.request(obj); }在请求头中手动加上sessionId,因为小程序没有cookie。websocket//连接websocket wx.connectSocket({   url: 'wss://liudongtushuguan.cn/socket?sessionId='\u00a0 \u00a0session.sessionId,\r\n});\r\n\r\nwx.onSocketOpen(function(res){\r\n\r\n});\r\nwx.onSocketClose(function(res){\r\n\u00a0\u00a0console.log('websocket closed'); }); wx.onSocketMessage(function(res){  //收到消息的回调   let msg = JSON.parse(res.data);   let msgs = that.data.borrowMessage;   msgs.unshift(msg);   that.setData({ borrowMessage: msgs}); });//发送socket消息   let data = JSON.stringify({     targetId: bookData.ownerId,     nickName: APP.globalData.userInfo.nickName,     bookName: bookData.title,     time: new Date().toLocaleString(),     bookId: bookId,     wxNum: wxNum,     phoneNum: phoneNum,     msg: msg,   });   wx.sendSocketMessage({     data: data,   });服务端代码目录Express框架实现http服务const https = require('https'); const fs = require('fs'); const express = require('express') const cookieParser = require('cookie-parser'); const bodyParser = require('body-parser'); const app = express(); const queryString = require('querystring'); const URL = require('url'); const socket = require('./service/socket'); const router = require('./routes/router').router; //获取认证证书 var key = fs.readFileSync('./key/2_www.liudongtushuguan.cn.key'); var cert = fs.readFileSync('./key/1_www.liudongtushuguan.cn_bundle.crt'); var options = { key : key, cert : cert, }; app.use(cookieParser()); app.use(bodyParser.json()); con