# 思科科技-快递取件平台 **Repository Path**: lujinbin_2/cisco-express-pickup-system ## Basic Information - **Project Name**: 思科科技-快递取件平台 - **Description**: 仿菜鸟裹裹的多平台快递取件系统，通过手机代替驿站扫描枪，实现低成本、快速扫码取件 - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 14 - **Forks**: 8 - **Created**: 2022-09-01 - **Last Updated**: 2025-02-26 ## Categories & Tags **Categories**: Uncategorized **Tags**: Vue, uni-app, SpringBoot, Hutool, WebSocket ## README # 思科科技-快递取件系统 #### 介绍 主要技术栈： vue2.0 + ES6 + elementUI 等 uniapp + unicloud + uView 等 springboot + mybaits-plus + webSocket 等 linux + shell + ngnix + redis 等 python + openCV + 图像识别 等 c# + unity 等 #### 第十九次记录 date:11.23 ``` 1.测试和写文档完成了，然后简单介绍一下个个文件夹 这个文件夹NavigationView是app模拟驿站扫描枪扫码的 vue是管理员模块的 kesi_uniapp是用户模块的 springboot是后端 ``` #### 第十八次记录 date:11.20 ``` 1.整体功能基本上实现了！！！ 2.现在进入测试和写文档环节 ``` #### 第十七次记录 date:11.18 ``` 1.客服联系功能已经实现了，应该没什么问题了。。。（之前写的，不能适应uniapp，所以重写了！可恶！） 1）已知bug，现在wx头像，不知道干嘛不能展示 ->已解决 2）还要区分一下客服上线的，现在是全部用户上线都展示在列表 3）管理员图片上传，默认图片报错，之前没事的 2.现在最后一步打算把快递订单物流实现了，然后再稍微完善一下页面就ok了 3.然后文档，可能要花个3-4天去写。。。如果20号之前项目能完工的话就没什么问题，如果不能的话，可能不能实现快递订单物流了，那就搞个虚假的订单信息先吧。 ``` #### 第十六次记录 date:11.16 ``` 因为快要交货了，所以现在很急说实话！！！ 1.wx支付是没有沙箱模拟的，只有支付宝才有，但是感觉在wx小程序里面塞一个支付宝支付挺蠢的，想了想先放着吧 2.然后接下来打算着重解决客服联系（socket）和快递订单物流获取这两个功能。。。感觉必须要在20号之前搞好，不然出大问题 3.redis还没学好。。。不然打算用redis实现socket。打算先把整体框架实现先。。。 ``` #### 第十五次记录 date:11.14 ``` 1.redis实现7天内自动登录的功能已经实现了。。。 2.还弄了JWT token认证，登录拦截器，UserThreadLocal（难点，现在还不懂） 3.尝试写了自定义注解NoAuth，忽略登录拦截器的注解 4.现在wx授权登录，已经实现了，但是还是无法和app登录结合起来，就是app是手机号一键登录 （1）wx登录没有企业认证是不能获取用户手机号的，打算手机号登录时，查一下数据库看看手机号存不存在，存在直接登录，不存在随机生成用户名什么的，然后登录，但是openId是null （2）wx授权登录后，应该检查一下手机号是否为空，要是是空的话应该跳转到手机号短信认证，设置用户的手机号。酱紫手机号登录就可以获取到对应用户信息（h5短信认证） （3）上面是用户先wx登录再手机app登录的前提下！此时逻辑合理 （4）要是先手机号一键登录，此时是没有openId,只能记录手机号和随机用户名、头像等信息。。。所以我们是不能太依赖openId，但是我发现token是通过唯一主键id加密生成的所以问题应该不大，我后续再试试吧。。。 （5）h5是手机短信认证的话，手机能成功，那h5一样能成功 5.要是登录实现了，后续打算试一下 （1）wx支付（用户寄件时是要收费的）：这个功能不知道能不能免费实现，不能的话可能要用沙箱，自己骗自己了。。。 （2）快递订单物流获取（获取不到地图，只能获取简单的json数据）：获取地图的话是要收费的，我打算最后再弄，打算能不花钱解决办法（方法大概想到了，我应该弄一个画布canvas 里面放中国地图 获取对应的物流信息，然后在地图上标点在连接起来。。。应该挺难的，但是可以试一下），不能一遇到问题就想花钱解决！ 6.我们的服务器过期了，我稍微学了一下计算机网络，了解了一下，我们不需要花钱租服务器了，到时候如果条件允许的话，我们应该通过局域网，多台电脑连接同一个wifi，然后再把对应的主机号（localhost）修改，实现修改远程数据库等操作 ``` #### 第十四次记录 date:11.13 ``` 1.wx授权登录实现了，获取对应用户的信息时无法获取openId（大概率是因为没有300元认证），我自己通过解密sessionKey获取openId并且往里面添加了openId，成功解决了这个问题。 2.接下来试一下用redis实现7天内自动登录的功能。。。 ``` #### 第十三次记录 date:11.11 ``` 这几天打算搞那个wx小程序登录授权，用到redis了。。。所以去了解了一下，发现还挺难的。但是学完，感觉后续的项目很多功能都能通过redis实现。。。 因为快要交货了，所以打算最低限度的学一下先，后续在全面学习。。 1.发现一个bug，后台修改、新增用户时，要是不重新上传图片就报错 2.还有一个就是退出登录的时候，因为没有进聊天页面，报了一个退出socket失败的错误 3.修改用户头像如果是本人的话，页头的图像没变化 ``` #### 第十二次记录 date:11.8 研究了好久登录、注册的问题，因为多平台，所以区别唯一性是十分重要的，现在稍微有点头绪，还没开始搞 多端登录解决方案（手机号一键登录只支持app，wx小程序一键授权在研究一下吧！） https://zhuanlan.zhihu.com/p/499667770 教程: https://blog.csdn.net/qq_45481971/article/details/127104056?spm=1001.2101.3001.6661.1&utm_medium=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7EYuanLiJiHua%7EPosition-1-127104056-blog-112800077.pc_relevant_3mothn_strategy_recovery&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7EYuanLiJiHua%7EPosition-1-127104056-blog-112800077.pc_relevant_3mothn_strategy_recovery&utm_relevant_index=1 简书： https://www.jianshu.com/p/99a9f1ffc324 unicloud开发者中心 https://dev.dcloud.net.cn/pages/uniLogin/invoke unicloud一键登录官网 https://uniapp.dcloud.net.cn/uniCloud/univerify.html 一键登录成功后页面跳转失败，但是用了 uni.reLaunch（关闭所有页面，打开到应用内的某个页面）就行了 wx小程序授权登录 https://blog.csdn.net/qq_43432157/article/details/122454699 微信小程序个人开发者获取手机号，需要认证要300块钱！ https://blog.csdn.net/wjh_monkey/article/details/119820116 微信小程序登录和授权（加密、解密？？） https://www.cnblogs.com/niufang/p/15927864.html 好像有解决办法了： UnionID 机制说明： 如果开发者拥有多个移动应用、网站应用、和公众帐号（包括小程序），可通过 UnionID 来区分用户的唯一性，因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号（包括小程序），用户的 UnionID 是唯一的。换句话说，同一用户，对同一个微信开放平台下的不同应用，UnionID是相同的。 https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/union-id.html 1.实现wx小程序，wx授权认证(但是因为获取手机号现在不对个人开发者开放，除非花300块钱认证才能正常使用) （1）所以我们后续可能要换一种方式了，不能通过唯一的手机号，去登录、注册！ （2）但是目前还没想到，除了手机号还有什么好的办法！ -> 想了想方法(date 11.4) 1) 微信先授权获取昵称等信息，然后再通过手机短信认证（注册时一定要手机短信认证，防止有人乱填），判断唯一性 1.1）不可取，因为可能存在昵称一样的wx用户 1.2）先查询是否重复昵称，没有直接进入，有的话，再让用户输入绑定手机号，并提醒昵称重复，建议改wx昵称 1.3）逻辑合理了，但是对于用户来说不太友好，要不然就每次登录都要输入绑定手机号，要不然改wx昵称 1.4）或许可以尝试手机号用windowSession存两个月 ->或许可以研究一下openid？(date 11.5) 1.5）要是用户在注册之后修改昵称，那我们数据库就获取不到了！ 微信小程序登录和授权（加密、解密？？） https://www.cnblogs.com/niufang/p/15927864.html 2）直接手机短信登录或者账号密码登录 2.1）可行，但不合理，酱紫wx小程序显得很多余，每次开小程序都要手机短信登录 3）这样想，最优解或许还是花300块钱认证 多平台登录的最优解： 前期我们可以通过openid或者手机号区别用户的唯一性： 后期要是小程序平台更多了（目前只用了h5，安卓，wx小程序），可以用unionId（联合id） https://www.bilibili.com/video/BV17y4y1L78u/?spm_id_from=333.788.video.desc.click&vd_source=7e3d4b8394f5414129f1a77d9c885eb1 微信小程序官网： https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/signature.html 其中手机号一定要短信认证，防止有人乱添。。。 然后要区分nicheng 和 username 目前打算，安卓用手机号一键登录，h5用短信认证登录，wx用微信小程序授权登录（通过openId区别唯一性） #### 第十一次记录 date:11.5 （1）前端ui基本上实现了，现在想想怎么结合springboot 一个参考的开源项目(了解前后端整合uniapp+springboot)： https://gitee.com/virus010101/linfeng-community/tree/master/src/main/resources/static/linfeng-community-uniapp-ky 视频： https://www.bilibili.com/video/BV1Ag411f7Bz?p=5&vd_source=7e3d4b8394f5414129f1a77d9c885eb1 看了一下别人写的代码，想了想后续的学习方法可能需要改变了，因为基础知识不够牢固，所以有很多技术都看不太懂 打算沉静在知识的海洋，多看点书和技术论坛以及官方文档。。。少敲点代码，或许可以看到一个觉得不错的知识点就往项目里面添加！ 达到理论和实践相结合(1+1>2)的效果 ​ #### 第十次记录 date:11.3 1.实现wx小程序，wx授权认证(但是因为获取手机号现在不对个人开发者开放，除非花300块钱认证才能正常使用) （1）所以我们后续可能要换一种方式了，不能通过唯一的手机号，去登录、注册！ （2）但是目前还没想到，除了手机号还有什么好的办法！ -> 想了想方法(date 11.4) 1) 微信先授权获取昵称等信息，然后再通过手机短信认证（注册时一定要手机短信认证，防止有人乱填），判断唯一性 1.1）不可取，因为可能存在昵称一样的wx用户 1.2）先查询是否重复昵称，没有直接进入，有的话，再让用户输入绑定手机号，并提醒昵称重复，建议改wx昵称 1.3）逻辑合理了，但是对于用户来说不太友好，要不然就每次登录都要输入绑定手机号，要不然改wx昵称 1.4）或许可以尝试手机号用windowSession存两个月 2）直接手机短信登录或者账号密码登录 2.1）可行，但不合理，酱紫wx小程序显得很多余，每次开小程序都要手机短信登录 3）这样想，最优解或许还是花300块钱认证 2.服务器过期了，考虑要不要再租一年(看看数据库能不能通过局域网使用吧) #### 第九次记录 date:11.2 1.unicloud实现手机号一键登录，但是还有很多复杂的逻辑没有写（只能app使用！但是有条件编译还行吧） （1）unicloud有免费的服务器，但是我打算还是不用了，虽然我的服务器过期了，没什么时间再去研究 （2）重点：虽然一键登录需要unicloud，但并不是要求开发者把所有后台服务都迁移到unicloud 2.还不知道wx小程序，如何通过手机号获取用户信息(一条短信两分钱) -> 单wx小程序的话，应该是很简单的，但是是多平台就可能需要在研究一下 3.我后端需要重新写多一个吗，还是说可以和后台的结合（我是希望可以结合的，不然我的socket连接(客服聊天的功能就实现不了了，早知道用nodeJs了，再接再厉吧)） #### 第八次记录 date:10.30 1.uniapp前端页面基本实现，em。。。多终端开发还是限制比较多的，兴高采烈做完一个功能，发现另一个平台不适应的痛！ -> 最近很喜欢电锯人，所以我们的用户端主题风格改为了偏向二次元的 -> 当然我们的后台还是很老实的 2.比如，随便说两个，还有一时想不起来，有点困了 （1）uniapp的icon太少了，但是要用阿里巴巴icon图库，要转换为base64格式 （2）uniapp不能用$refs 而且不能用dom元素！ 3.对于uniapp后端的使用抛出以下提问： （1）多平台，后端需要写多个一一对应吗？ （2）假如是听音乐的缓存，app端应该是放在指定app文件夹里面，小程序端应该放在wx文件夹里面，那h5呢？放在别人哪个盘哪个文件？ （3）登录、注册的问题，目前我觉得最合理的登录应该是手机登录（适应多平台），然后在通过手机号绑定对应的qq和微信之类的？ 但是短信是要钱的，目前测试不了，然后我们的项目是wx小程序登录，那我难道要先打包出来在用wx小程序登录？还是有什么代码可以区别登录？ ​ #### 第七次记录 date:10.27 后台前后端的功能基本上已经实现了，还有部分bug(非致命)，并且已经想到相应解决方案，后续有时间在修复！ 部分重复代码就没写，先放着！ #### 第六次记录 date:10.23 1.这次我们通过webSocket实现了实时聊天(用户与客服聊天)的功能, 然后学习过程和实现过程，我写到word并上传了，这里只贴疑问 1.1：如果我在后端存session，但是前端又存了sessionstorage，资源占用率会不会很高？ （1）我后续的用户应该会存到localStorage，然后定期清除，达成自动登录的效果？ （2）Session可以存多个键值对吗？ 1.2：如果我用sessionStorage用户信息传给后端的user实体类，那我后续关闭页面时，数据会消失吗（不消失的话，会一直占用资源，是很不合理的）->应该不占资源，只是返回给前端的作用 （1）后续思考了一下，感觉不需要设置实体类，只需要，选中聊天用户用ajax通过toName去获取数据库用户信息展示即可 -> 不知道这样执行速度快不快。。。不快后续在加实体类返回吧 1.3：区分 用户和管理员？要是他们都是一个user表的话，通过flag会很方便，但是我们分开建了两个表，分别是user和admin，所以后续可能还要判断是用户登录还是管理员登录 ->目前是合成了一个表，不然工作量太大了！ 1.4：用uniapp做好用户端，之后是直接塞到vue文件夹里面吗？ ​ ​ #### 第五次记录 date:10.16 1.苦练了一段时间的java基础，然后直接开始搞springboot + mybaits-plus 了(我以前是学过ssm的，所以可以直接上手，虽然也学的很差（基本上都忘记了）。。。 所以现在java基础和springboot都很差) 2.用户界面的增删改查和登录（注册我在考虑后续微信小程序的注册会不会不太一样所以先放着）、文件上传等已经完成， 目前出了很多不致命的bug，后续可以通过不断的迭代进行修改 3.注意事项：批量删除功能目前实现不了。。。然后登录限制，目前是只有request返回才能执行，这是两个目前比较小的问题 4.我觉得比较严重的问题 (1):springboot 登录时，mybaits-plus的selectOne 能获取到sql，但是res.data返回了null！->已解决 (2):vue 自定义插件，全局方法的this指向导致无法调elementUI的message方法问题 导致了，很多重复代码，没有封装好！ 5.总结： (1):springboot + mybaits-plus 大量简化了程序员的代码量，但是不遵守其中的约定，会出现很多难以解决的问题(springboot文档是英文的这件事我一直耿耿于怀！) (2):我把我学习记录的文档也放在了gitee里面，但是有点乱（有些东西，我也不知道自己写的什么） #### 第四次记录 date:10.6 1.pc端后台页面前端基本上已经完成了，还有部分交互没写（先放着） 2.这个src/pages/Manage.vue 是主要页面 3.commponents主要 是Manage的组成部分 以及index首页的echarts图 4.pages放的是路由，目前是分成一个一个文件夹，也不知道这样写好不好。。。 但是我感觉挺好的，暂时这样先 5.然后现在存在的问题： (1):侧边栏展开和隐藏会产生布局bug (因为全局事件总线去控制div宽度导致的div布局bug，我个人感觉响应式布局还是通过css的媒体查询会好一些，用js的话总是乱飞。。。也可能是我太菜了) 目前想到的解决办法：让侧边栏的宽度过渡时间为0s (2):文字省略bug，因为文字省略必须要限定width，但是我一般都是用%去设置宽度(可以通过vue的计算属性去设置准确的宽度) 目前想到的解决办法：通过媒体查询，去设置不一样设备宽度 (3):还有留言管理的输入框，一输入文字就挤掉整个div的bug，目前是用一样的背景色去让别人看不出来，其实已经超了范围 (4):路由的缓存问题，首先要考虑什么页面需要缓存，什么页面不需要，我现在觉得就是用户的新增和修改等不需要，因为我把他们两个写在同一个路由里了， 导致缓存的话，点了修改用户获取了值后，点新增用户对应的值还存在 (5):还有其它的后续再看。。。一个好的项目是需要不断迭代的 6.个人感觉的难点: (1):echarts中国地图！因为echarts5以上已经删掉了中国地图，但是我们项目又需要这个功能， 所以我使用的是echarts4.9，但是4.9没有按需引入，导致打包会加大大概1mb的大小！ (2):elementUI的使用！这个其实还好，就调API，然后改参数，但是有时候改不动的时候会很难顶 (3):关于按需引入!或许应该有什么自动引入的插件?我感觉写一个引入一个一点麻烦。。。 (4):路由的使用，以及头部面包屑的更新，这个是通过route的meta属性去实现的 (5):vue-twemoji-picker表情包的使用！em...其实这个不会很难，主要是文档是全英文的，看不太懂，很多都是猜的，所以浪费了很多时间 (6):页面设计以及布局，我觉得对于前端工程师来说，可能最难的应该就是页面设计和布局。。。我经常看着页面大半天，在想要怎么做才好看，又不偏离主题。 而且div老是布局错乱真的很难顶。。。 #### 第三次记录 date:9.23 用vue脚手架开发了pc端首页，使用了echarts和elementUI #### 第二次记录 date:9.5 vue的脚手架以及todolist案例是我随便拿来练手的,我也是才学vue不久... 当然你们可以去修改,em...慢慢来吧 #### 第一次记录 date:9.2 测试了很多次，合并分支，总是会起一些莫名其妙的冲突，现阶段，无法解决 (有大神指导的话，可以先推荐一个适用于大伙的教学视频[自制/网络资源]) 怕后续工作无法进行，所以先用着简单的上传，拉取 (大伙应该都接触的比较少，等技术成熟且需要时可以投票分支的使用与否) 可以先创建js，css，html三个单独的文件夹(或者别的框架，希望先互相沟通一下)， 后期在封装，现在vue正在学习中(vue的使用也会在后期考虑) 后端框架打算是ssm，em...慢慢来吧 #### 软件架构 。。。 #### 安装教程 ## 项目安装 ``` npm install ``` ### 项目运行 ``` 1.应该先打开redis，然后看看springboot配置文件，改对应的属性，然后再根据ip文档，修改对应的ip 2.uniapp直接用hbuildx打开就好了，也需要配置一些东西 3.vue的话。。。一时间想不起来了(看一下下面的启动) ``` ### 项目打包 ``` npm run build ``` #### 使用说明（忽略，好久以前的了，写完再看看要不要搞一个完整版） 1. 本地打开项目后 http://localhost:8080/#/ 点一下登录页面的home，跳转到首页，登录页还没写 教学 https://blog.51cto.com/u_15754099/5585334 npm install有点慢(最好就这样打开，你也可以看一下代码或者修改什么的) 2. 或者直接看打包好的dist文件夹 https://www.bilibili.com/video/BV1Zy4y1K7SH?p=133&vd_source=7e3d4b8394f5414129f1a77d9c885eb1 从9:30开始看 server.js 直接改port就好了 8089 const express = require('express') const app = express() const port = 8089 // 自定义端口号（不要与已存在端口冲突） app.use(express.static(__dirname+'/static')) // dist 是项目的打包资源路径 app.listen(port, () => console.log(`服务器 ${port} 开启成功!`)) #### 参与贡献 #### 特技