ichat-web

ichat聊天软件Web端

效果图

功能列表

• 登录
• 注册
• 自动登录
• 忘记密码
• 会话列表

• 置顶会话
• 静音会话
• 删除会话

• 创建群组
• 添加好友
• 好友请求
• 收藏夹
• 联系人列表

• 搜索好友
• 修改备注
• 发送消息
• 删除好友

• 个人信息

• 修改头像
• 修改昵称
• 退出登录

• 聊天窗口

• 文字消息
• 图片消息
• 接收语音消息
• 发送语音消息
• 视频消息
• 位置消息
• 文件消息
• 包含链接的消息
• 语音通话
• 视频通话
• 发送Emoj
• 发送自定义表情
• 文件拖拽发送
• 右键菜单

• 消息转发
• 消息收藏

• 图片查看上一张、下一张
• 查看历史消息
• 个人会话&群组会话

• 清空消息历史
• 删除会话
• 静音
• 置顶聊天

• 群组会话

• 修改群组名称
• 修改群组头像
• 修改群组简介
• 管理员管理
• 邀请新成员
• 解散群组
• 成员管理
• 群组成员信息查看
• 添加群组成员为好友
• @群组成员
• 分组查看群分享

• 图片
• 视频
• 语音
• 文件
• 链接

• 图片裁剪、放大缩小
• 消息声音提醒
• 多设备同步
• 多语言
• Chrome桌面通知

使用教程

1. 在开始之前，请确保你的开发环境中包括 Node.js和 npm 包管理器。Angular 需要 Node.js 版本 10.9.0 或更高版本。

2. 安装Angluar CLI npm install -g @angular/cli@8.2.1。

3. 下载项目用Visual Studio Code打开

4. 在终端输入npm install自动安装项目需要的包

5. 修改src/environments/目录下的environment.ts文件与environment.prod.ts文件

   environment.ts文件是本地运行配置文件

   environment.prod.ts文件是编译之后配置文件

   export const environment = {
       production: false,
       apiBaseUrl:"https://localhost:44353/api/",
       chatUrl:"http://localhost:49782/ChatServer",
   };
   

   把apiBaseUrl跟chatUrl修改成你的服务器地址

6. 运行项目:在终端输入 ng serve

   等待编译完成，会输出

   ** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
   i ｢wdm｣: Compiled successfully.
   

   在浏览里打开上述地址就可以正常访问

7. 部署到服务器:在终端输入ng build --prod

   把输出目录（默认为 dist/）下的每个文件都复制到到服务器上的某个目录下

8. 关于更多Angular的问题，请访问Angular中文官方文档 Angular中文文档

更新日志

• 2020.04.24 项目上传

捐赠

微信	支付宝