Skip to content

Latest commit

 

History

History
85 lines (64 loc) · 3.39 KB

README.md

File metadata and controls

85 lines (64 loc) · 3.39 KB
Raw

LeanMessage WebApp

使用 LeanCloud 实时通讯搭建的聊天 WebApp。Live Demo

在找 iOS/Android Demo？iOS、Android。

功能

  • 登录
  • 聊天室、单聊、群聊
  • 系统对话实现的聊天机器人
  • 成员管理
    • 邀请、移除成员
    • 提升、撤销管理员
  • 群名称修改
  • 消息送达回执与已读回执
  • 未读消息
  • 「正在输入」状态
  • 消息撤回
  • 图片消息
  • 提及（@）对话成员
  • 表情
    • 小表情（Emoji）
    • 大表情（Sticker）

文档

即时通讯开发指南

本地开发、调试

  1. yarn
  2. yarn serve
  3. open http://localhost:3000/

部署

  1. 运行 yarn build 生成 dist 目录
  2. 将 dist 目录作为静态资源部署

实时通讯服务是通过校验 origin 来保证安全的，项目中默认的 AppID 是 LeanCloud 提供的测试 App 的 ID，仅允许 localhost:3000 来源的访问，当你需要在另外的域名上部署 LeanMessage WebApp 时，需要将 src/index.js 中的 appId 改为你的 LeanCloud 项目的 App ID，并且确认设置了你的域名为该项目的「安全域名」，更多关于安全方面的信息请参考 Web 安全域名。

代码结构与功能

src/
├── app
│   ├── components      // 组件
│   │   ├── message                 // 消息 directive
│   │   ├── reverse-infinite-list   // 向上滚动无限加载列表 directive
│   │   └── user                    // 用户相关 service
│   ├── conversation    // 会话 view，app 主界面
│   │   └── conversationMessage     // 消息 view，会话 view 的子 view
│   └── login           // 登录 view
├── index.html          // 页面入口，ui-view 容器
├── index.js            // js 入口，注册依赖模块，启动 app
├── index.run.js        // 启动 app 的代码
├── index.scss
└── routes.js           // 配置路由

leanmessage-views

index.js

js 入口，申明依赖模块，配置依赖模块，注册 components 与 views，启动 app。 依赖的 LeanCloud 模块有:

依赖的 angular 模块有：

routes.js

配置 ui.router

index.run.js

启动 app 的脚本，通过监听 ui.router 的 stateChangeStart 事件在视图切换时检查用户登录状态。

How to

实现用户系统

为了方便与其他系统对接，LeanMessage 服务没有内建用户系统，只有作为唯一标识的 clientId，你需要在你的用户系统中维护用户与 clientId 的关系。你可以使用 LeanStorage 提供的「用户系统」。 本 demo 中没有关联用户系统，可以用任何的 id 登录服务。