代码拉取完成,页面将自动刷新
主要技术栈: vue2.0 + ES6 + elementUI 等
uniapp + unicloud + uView 等
springboot + mybaits-plus + webSocket 等
linux + shell + ngnix + redis 等
python + openCV + 图像识别 等
c# + unity 等
1.测试和写文档完成了,然后简单介绍一下个个文件夹
这个文件夹NavigationView是app模拟驿站扫描枪扫码的
vue是管理员模块的
kesi_uniapp是用户模块的
springboot是后端
1.整体功能基本上实现了!!!
2.现在进入测试和写文档环节
1.客服联系功能已经实现了,应该没什么问题了。。。(之前写的,不能适应uniapp,所以重写了!可恶!)
1)已知bug,现在wx头像,不知道干嘛不能展示 ->已解决
2)还要区分一下客服上线的,现在是全部用户上线都展示在列表
3)管理员图片上传,默认图片报错,之前没事的
2.现在最后一步打算把快递订单物流实现了,然后再稍微完善一下页面就ok了
3.然后文档,可能要花个3-4天去写。。。如果20号之前项目能完工的话就没什么问题,如果不能的话,可能不能实现快递订单物流了,那就搞个虚假的订单信息先吧。
因为快要交货了,所以现在很急说实话!!!
1.wx支付是没有沙箱模拟的,只有支付宝才有,但是感觉在wx小程序里面塞一个支付宝支付挺蠢的,想了想先放着吧
2.然后接下来打算着重解决客服联系(socket)和快递订单物流获取这两个功能。。。感觉必须要在20号之前搞好,不然出大问题
3.redis还没学好。。。不然打算用redis实现socket。打算先把整体框架实现先。。。
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)修改,实现修改远程数据库等操作
1.wx授权登录实现了,获取对应用户的信息时无法获取openId(大概率是因为没有300元认证),我自己通过解密sessionKey获取openId并且往里面添加了openId,成功解决了这个问题。
2.接下来试一下用redis实现7天内自动登录的功能。。。
这几天打算搞那个wx小程序登录授权,用到redis了。。。所以去了解了一下,发现还挺难的。但是学完,感觉后续的项目很多功能都能通过redis实现。。。
因为快要交货了,所以打算最低限度的学一下先,后续在全面学习。。
1.发现一个bug,后台修改、新增用户时,要是不重新上传图片就报错
2.还有一个就是退出登录的时候,因为没有进聊天页面,报了一个退出socket失败的错误
3.修改用户头像如果是本人的话,页头的图像没变化
研究了好久登录、注册的问题,因为多平台,所以区别唯一性是十分重要的,现在稍微有点头绪,还没开始搞
多端登录解决方案(手机号一键登录只支持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区别唯一性)
(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)的效果
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.服务器过期了,考虑要不要再租一年(看看数据库能不能通过局域网使用吧)
1.unicloud实现手机号一键登录,但是还有很多复杂的逻辑没有写(只能app使用!但是有条件编译还行吧)
(1)unicloud有免费的服务器,但是我打算还是不用了,虽然我的服务器过期了,没什么时间再去研究
(2)重点:虽然一键登录需要unicloud,但并不是要求开发者把所有后台服务都迁移到unicloud
2.还不知道wx小程序,如何通过手机号获取用户信息(一条短信两分钱)
-> 单wx小程序的话,应该是很简单的,但是是多平台就可能需要在研究一下
3.我后端需要重新写多一个吗,还是说可以和后台的结合(我是希望可以结合的,不然我的socket连接(客服聊天的功能就实现不了了,早知道用nodeJs了,再接再厉吧))
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小程序登录?还是有什么代码可以区别登录?
后台前后端的功能基本上已经实现了,还有部分bug(非致命),并且已经想到相应解决方案,后续有时间在修复!
部分重复代码就没写,先放着!
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文件夹里面吗?
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里面,但是有点乱(有些东西,我也不知道自己写的什么)
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老是布局错乱真的很难顶。。。
用vue脚手架开发了pc端首页,使用了echarts和elementUI
vue的脚手架以及todolist案例是我随便拿来练手的,我也是才学vue不久...
当然你们可以去修改,em...慢慢来吧
测试了很多次,合并分支,总是会起一些莫名其妙的冲突,现阶段,无法解决
(有大神指导的话,可以先推荐一个适用于大伙的教学视频[自制/网络资源])
怕后续工作无法进行,所以先用着简单的上传,拉取
(大伙应该都接触的比较少,等技术成熟且需要时可以投票分支的使用与否)
可以先创建js,css,html三个单独的文件夹(或者别的框架,希望先互相沟通一下),
后期在封装,现在vue正在学习中(vue的使用也会在后期考虑)
后端框架打算是ssm,em...慢慢来吧
。。。
npm install
1.应该先打开redis,然后看看springboot配置文件,改对应的属性,然后再根据ip文档,修改对应的ip
2.uniapp直接用hbuildx打开就好了,也需要配置一些东西
3.vue的话。。。一时间想不起来了(看一下下面的启动)
npm run build
本地打开项目后 http://localhost:8080/#/ 点一下登录页面的home,跳转到首页,登录页还没写 教学 https://blog.51cto.com/u_15754099/5585334 npm install有点慢(最好就这样打开,你也可以看一下代码或者修改什么的)
或者直接看打包好的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} 开启成功!
))
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。