wechat_h5plus

所属分类:android开发
开发工具:JavaScript
文件大小:408KB
下载次数:7
上传日期:2019-04-24 17:44:51
上 传 者jamesp
说明:  利用Html5Plus技术开发的类微信app,同时支持iOS和Android
(Using Html5Plus technology to develop a Wechat-like app, while supporting iOS and Android)

文件列表:
.project (778, 2018-10-20)
css (0, 2018-10-20)
css\common.css (1418, 2018-10-20)
css\mui.css (96870, 2018-07-13)
css\mui.min.css (75624, 2018-07-13)
css\mui.picker.min.css (5056, 2018-10-24)
fonts (0, 2018-10-10)
fonts\iconfont.css (2058, 2018-10-26)
fonts\iconfont.svg (26706, 2018-10-24)
fonts\iconfont.ttf (10240, 2018-10-27)
fonts\mui.ttf (29884, 2018-07-18)
images (0, 2018-09-05)
img (0, 2018-10-10)
img\avatar_def.png (19989, 2018-08-02)
js (0, 2018-10-20)
js\api.js (2381, 2018-09-21)
js\appconfig.js (9674, 2018-10-28)
js\libs (0, 2018-10-10)
js\libs\dateutils.js (3787, 2018-10-25)
js\libs\doT.min.js (3416, 2018-07-16)
js\libs\fx.js (4965, 2018-07-26)
js\libs\getscript.js (1567, 2018-08-16)
js\libs\lru.js (9271, 2018-09-07)
js\libs\mui.picker.x.js (34191, 2018-10-24)
js\libs\pack-loader.js (3644, 2018-09-10)
js\libs\pinyin_dict_firstletter.js (27952, 2018-08-02)
js\libs\pinyin_notone.js (28141, 2018-08-02)
js\libs\push-client-1.0.js (295586, 2018-08-14)
js\libs\push-sender.js (1630, 2018-10-04)
js\libs\sortable.1.7.0.min.js (15797, 2018-09-02)
js\libs\storagectx.js (4284, 2018-09-21)
js\libs\storageex.js (1922, 2018-09-07)
js\libs\zepto.min.js (26386, 2018-07-22)
js\mui.x.js (257853, 2018-10-13)
js\plugin (0, 2018-10-21)
js\plugin\ntextarea.js (737, 2018-10-21)
manifest.json (14278, 2018-10-28)
pages (0, 2018-10-20)
pages\auth (0, 2018-10-10)
... ...

FIXME resend会导致chat的msg list丢消息(只剩下resend的了) ## 微弟弟定位 聊天+GTD,效率工具 社会化任务管理系统,适用于家庭,学生,团队,工作。。 3项功能:待办管理,文档建设(文档生命期演化问题),共识沟通 一个基本会话消息由: 文音图视(tspv), 时间因子, 相关人员流程, 构成 ## 流程 ### 聊天流程 等同微信 #### 通讯录 #### 聊天记录 1. 本地记录 2. 同步远程记录 ### GTD流程 列出事项, 评估耗时 设置时间要求,重复方式 也就是设置提醒时间 安排优先级 责任人(可无,单个,多个(限定人数与否);可指定到人(列出,全部+排除),可自行认领) 附加信息(地点,资料) 提醒方式:时间/地点提醒 自动帮你安排执行 各种带开始时间,最后期限,时长的小程序 每个小组可以有一个进度 人的维度,有个完成率(权限? hash视图# at参与@ --and类型& issue转proj ### GTD 首先是聊天,在聊天中做事, First is communicate(means emotion/coop exchange) second is organize(issues/contents) third is context(team/loc/conversation...) factors: priority/importance/scores non-personal(every issue to group, every body see it) 一个项目,team,完成一个目标 涉及到各种交流协作,任务分解,事务流转,计划依赖,监督check/review-情感互动,内容整理(引用) 第一:直观:缓解拖延压力(事情摆在那) 第二:方便:all are chat 第三:social:watch/coop 第四:依赖,人之间,issues之间 issues:today/upcoming,anytime,someday locationed anytime,someday咋显示,定期review/太老发话(一批老人出来发话) 做好一件事,是否主动通知所有人 ### 认证 服务端无session状态,客户端根据加密的_authtoken(uid)随时调用。 每一个uid/topic都是加密过的token=md5(uid/topic, id, ts, salt) #### push.imid push目标是imid:topic/uid, 同一个目标imid,不同用户拿到的都是加密过的,pushserver会解密再push #### 远程数据同步问题 FIXME 每次登录后,将远程需要同步的数据(联系人,组成员,todos等)时间戳下发,本地校验决定是否要刷新本地 ### 加好友/邀请 0 刚注册的时候,自动列出那些已上传我手机号的好友 1 扫码加好友 直接扫码 2 添加手机联系人 -》上传通讯录找朋友 3 输入手机号搜索-》邀请/添加 4 由微信邀请,发送url邀请 发给个人或群 对方打开,可直接注册与我会话,更进一步,请下载app。。。!! 邀请加好友/邀请进群 ### 抄送server 某些消息(例如加好友消息)需要抄送server.uid, ### 消息体 ```javascript // TODO 防止恶意篡改数据(理论上他可以任意改自己的信息,所以没必要check真实性,只过滤禁止内容即可 // 严格不能改的数据,做个签名即可,例如id,type // https://crackstation.net/hashing-security.htm // https://github.com/bitwiseshiftleft/sjcl { // push: 的detail "msg": { // 若有chat,则此msg入chat queue "id", "t", // msgt;不同chat type下的msgt会有限制,要检查 "a", // 可选,action不同msgt可能有多个动作 "am", // action msg, 用于显示 "d", // data {'id'/*若存在,则为有状态的实体数据*/, 'merged'/*是否已被合并*/} "s", // 私语消息 "ts", // 时间戳 "p", // push状态:true未发成功 "f": { // from 消息来自哪个user, "id", "m", // 是否我自己 "imid":{"uid"}, // imid为uid的签名,无法伪造。(最严格可以搞个内容签名 "a", // avatar "n", // name "d", // address "s", // 个人签名 "f", // 好友状态: undefined:未知, -2:他拒绝;-1:我拒绝;0:我待定;1互好友;2我过期;3我等他答复 } }, "chat":{ // 可选,一个会话就是一个msg queue,null则msg不入queue "id", "t", // type: chat, team, vote, ... "imid":{"uid/topic"}, // imid和对应的id/type一定要检查,这个无法伪造(最严格可以搞个内容签名 "a", // avatar "n", // name, "l", // lastMsg(NOTE: 需要escape html),由chatt和msgt共同生成l "ts", // 时间戳 "h", // hidden }, "to":{ // 发消息时必填,收消息时无此字段 "uid/topic", "nonotif", // 是否不推送notification, 默认false, FIXME pushserver改造 "cc2AppServer" // 是否抄送给app server,例如加好友, 默认false FIXME pushserver改造 } // 其他字段都可选 } ``` 其中,puser server会对uid/topic加密转换; 某些msgt会走notifi,有些不走 ### chat.id和msg.id生成 由from.id和ts拼成,能保证唯一(因为同一个人不能同时搞2个chat或msg) 若有发送者恶意构造相同id咋办:自承担重复的影响 ### msgt msg type, 简称msgt,表示各种消息类型 一个msgt打一个包,包含如下要素: 1. ininput模板(创建后先进input box,再发送 1. inchat模板(chat消息必选 2. inchat操作(可选 3. clickview模板(可选 4. clickview操作(可选 5. onpush(msg, showing, data)处理(可选,专处理push来的一刻,showing:当前chat是否正打开 6. mergeMe(可选,将传入msg合并给ininput内的消息 7. merge2me(可选,将ininput内的消息合并给传入msg ### mapp 一个小程序对应并创建一个msgt ### ininput的组合消息 例如发一个任务,组合地址,组合@某人 #### 组合原则 1 插入前向前获取吸附,直到无法吸附停止, 2 插入后,向前1个被吸附--如何显示?加一节模式 #### 组合消息流程 1 调用mapp,传入当前的ininput,供mapp处理 2 mapp执行后,返回新的msgs数组 3 msgs更新ininput 4 发送ininput的msgs ### chatt chat type, 表示各种chat类型 1. chats item模板 某类chat一个item vs 某个msg一个item 默认只显示最多4个将要的msg,往上可以查看当天要做的,以及pin的 item可以拖动,未完成的挤占普通chat,一根now线 2. chat.menu 3. chat.bottom 5. chat.top bar 4. msg.onpush ### 小组创建/邀请 1 from:invitor to:team lead, msgt:teaming, data:invitee, chat:team 2 (if accept)from:lead, to:team, msgt:teamed, data:invitees/invitor, chat: team 3 from:lead, to:invitees, msgt:teamed, data:invitees/invitor, chat:team,ccApp 4 invitee sub topic 第2步只能lead发,成员发的无效 members信息在app server 5 from x, to y, chat team的限制: x非lead时,y只能是lead;x lead时不限制(appServer检查) ### 各种小程序 #### 待办(TODO)设计 ##### 时间因子 包括stime, etime, sday, eday, repeat, _roundStart, _roundEnd, tz 全部缺失,表示无时间因子 缺失的需要自动补齐,补齐属性前加_, 例如stime的补齐属性为_stime ###### 时区 转换公式:gmt-local=tz 注意Date.parse('2018-09-09 00:00')得到local的ts Date.parse('2018-09-09')得到的是gmt的ts ##### 本地保存 所有公共的待办,每人都保存一份 ##### server配合 提醒工作由server端完成,服务端只根据create时间和start时间的时长,来设置提醒(避免手机时间时差等各种误差) 所有待办,server端都保存 #### 课程表? TODO #### 任务 ##### msg.d结构 ```javascript msg.a: // 对task的操作:create,edit,own,watch,,, msg.d: { id, // taskId v, // version: server端发现version不最新的话,就拒绝消息,并帮发送者更新到最新版 cid, // chat id, 创建后不可改,可null(表示私有待办),分享后的待办只读(不能执行) cday, // 创建日期 ctime, // 创建时间 n, // 标题 eday, // 结束日期 etime, // gmt结束时间 spin, // start time pin epin, // deadline duration, // 评估时长 repeat, // 周重复位 single, // 重复一次? owner, // 指派给 creater, watchs, // 关注人 comments, // 评论(图文 loc // 地址 } ``` 有大致时间安排的正事, 创建时:name,endtime(pin),预估时间,重复周期组成 编辑时可以,评论附件,关注, 进input框,发送时生成 最后期限的,会主动闹钟提醒 #### 定时闹钟 #### 倒计时 #### 正计时秒表 #### 事件,开始/结束时间 ### 主要围绕gtd来做 围绕一个团体,若干项目各项事宜的开展,来提供便利的工具 #### 事务,安排,todo ##### 有无时间点 ##### 周期性 #### 资料,共享,记录,整理,文档空间(文档附件归入空间,预览评论版本管理。。),图文音视... #### 沟通,协商,表决,共识 #### 时间视角,项目视角, 更进一步的扩展消息类型,受chats/chat之外的其他view关心, 某些特殊类型的消息,要抄送服务器 ### socket.io push js集成 1. 利用js来维护online的透传 2. 集成native sdk(已做到华为,小米,友盟,谷歌,苹果集成),只负责拿到deviceToken(需要与js的uid对应) 4. deviceToken交给js,js来注册(@see SocketIOProxyClient.sendTokenToServer) 5. FIXME 离线时,notification推送,并激活相应的h5 page 6. 回到1 #### app启动顺序 1. local显示(所有上次disconnect之前的) 2. push listener启动,pushClient启动(必须listener好了之后再开client),接受push 3. remote获取并显示 ### socket.io push sdk集成?? 1. sdk集成 2. js api提供status,send,on push,notification唤起页面等 3. native如何推送给js? ### socket.io 改造 1. 某些消息要抄送app 2. imid加解密 3. team chat from/to检查(至少有一个是lead) 4. msgt=='teamed'时,msg.d.users.imid需要过滤 5. ttlService.maxTllPacketPerTopic: 表示最多存多少条消息,TODO 目前是最后10条 ### TODO #### input输入框不支持自动换行咋办 #### pushid/uid/topic加密,防止陌生人乱发消息 #### 做一个html合并工具:当js/css只被引入一次,则合并进html,否则保留 #### push.io 改需求: 不论pushid或topic/tag, receiver在线就push,否则就notify(无device也push) 现有行为是: push的必走push(有ttl) notify的:无device注册就放弃;无device.token就push;mi/huawei/apn/google必走;umeng的push+noti FIXME, cleanInput(lastMsg) FIXME 离线的话,消息待发 FIXME 发送失败/超时,重发,没回车的内容放txtbox FIXME inviteUrl邀请页面h5 FIXME 发短信api写到 app server,根据imid流控 TODO 头像缓存本地 FIXME secretmsg样式 FIXME emoji兼容问题 FIXME 通讯录加我自己为好友 FIXME 用户改自己属性咋通知大家, 发消息时? TODO 所有msg右边加个爱心 TODO 个人页面:显示签到,等级,等统计信息 TODO 大厅概念,PK概念 FIXME 重新show的msg没变成resend;to==null的本地消息不需要resend FIXME 组人数太多,就显示昵称在头像边上 FIXME 我发给他的chatId=-meId, 他发给我的是-heId,成2个chat了咋办 FIXME 删除chat item需要确认一下 FIXME 从消息添加生成的mapp,要提供回到消息上下文的功能 ### 代码 MUI项目中touchend事件在某些时候不触发 示例图 如图所示,在iphone6, 系统ios9.3上,在以下情况中touchend事件不触发: 1. 向上划出屏幕时,touchend事件不触发; 2. 在当前webview中append一个底部有空间的webview,从append的webview中开始滑动, 滑动到外层webview,以及划出屏幕时,均不触发touchend事件。 解决方案: 根据手指触摸位置,判断是否接近屏幕外部,手动触发toucend需要处理的业务逻辑。 参考mui里scroll控件的部分hack代码 var detail = e.detail; if (this.options.scrollY || detail.direction === 'up' || detail.direction === 'down') { //如果是竖向滚动或手势方向是上或下 //ios8 hack if ($.os.ios && parseFloat($.os.version) >= 8) { //多webview时,离开当前webview会导致后续touch事件不触发 var clientY = detail.gesture.touches[0].clientY; //下拉刷新 or 上拉加载 if ((clientY + 10) > window.innerHeight || clientY < 10) { this.resetPosition(this.options.bounceTime); return; } } } ### wdd架构 app由3个基础场景构成: 1. index.html, 所有msg receive(pushClient)的中心 订阅topics维护 兼负责auth/storageCtx安全会话维护 2. chats.html msg预处理onpush chat对象以及链表维护保存 链表显示操作 3. chat.html msg队列维护保存 msg显示操作 chat view维护 new msg send(pushSender)操作 4. 消息流程 index.msg->chats.onpush->chats.save->chats.show->chat.save->chat.show->chat.pushSender.send 5. 待办 TODO 下拉界面,进入搜索和标签切换 ### 设计模式 标准的前端app,由entry event(打开网址)触发,做如下事情: 1. init doms 2. init data doms from templates 3. bind handlers to events(dom events & server events & storage events ...) 类负责: 1. model lifecycle 2. template 3. event handler ### 关于类 因为chat相关数据维护太分散(team:topic,members..),不同类型处理方式要重写,所以用类; msg数据很集中(就一条),维护流程很单一,所以不建类

近期下载者

相关文件


收藏者