====== WebIM H5 Demo 介绍 ======

WebIM H5 Demo 支持移动设备布局 (WebIM 1.x 只支持PC浏览器)

GitHub 下载地址：https://github.com/easemob/webim

===== 版本支持 =====

WebIM H5 支持所有现代浏览器，支持手机微信和QQ。

目前暂不支持IE6-11，只支持Microsoft Edge。

注：所有开发调试环境均基于Mac。

===== 功能 =====

1.WebIM 1.x的所有功能

2.支持浏览器本地缓存(IndexDB)

3.配置文件是demo/src/config/WebIMConfig.js
===== Redux State =====


<code javascript>
{
	// ---------------------------------
	// 响应式断点
	// ---------------------------------
	//xs: "480px"
	//sm: "768px"
 	//md: "992px"
	//lg: "1200px"
	//xl: "1600px"
	breakpoint: {
		xs: false,
		sm: false,
		md: false,
		lg: false,
		xl: false
	},
	
	// ---------------------------------
	// UI相关
	// ---------------------------------
	common: {
		fetching: false,
		isGetGroupAlready: true,
		isGetChatRoomAlready: false,
		showGroupRequestModal: false   //群主管理加入群消息
	},
	
	// ---------------------------------	
	// 用户登录信息
	// ---------------------------------
	login: {
		username: 'sunylt',
		password: null,
		token: "YWMtZ0m-opwTEeeS-e0Ko59rsU1-S6DcShHjkNXh_7qs2vV",
		fetching: false,
		error: false
		isLogin: true,
	},
	
	// ---------------------------------
	// 多语言
	// ---------------------------------
	i18n: {
	
		// 已配置语言
		translations: {
			cn: {},
			us: {},
		},
		
		// 当前语言
		locale: "cn"
	},
	
	
	// 注册信息，没进行注册操作为{}
	register: {
		username: "123abcdbb",
		password: "123",
		fetching: false,
		registerError: null
	},
	
	// 预留 暂无用
	contacts: {}
	
	// 预留 暂无用
    im: {}

	// ---------------------------------	
	// 数据实体
	// ---------------------------------
	entities: {
	    // 好友
		roster: {
			byName: {
				name: { subscription,jid, ask, name, groups }
				...
			},
			names: ['lwz2' ...],
			// 好友列表在此，因为好友列表来源于roster，息息相关
			friends: [],
		},
		// 群组
		group: {
			loadingFailed: <Boolean>,
			isLoading: <Booleadn>,
			rightSiderOffset: <Number>, //控制右侧群组管理面板
			byId: {
				groupId: {groupid, groupname},
				....
			},
			names: [groupName_#-#_groupId, ....]
		},
		// 聊天室
		chatroom: {
			byId: {
				chatId: {chatId, name, owner, affiliations_count}
				...
			},
			names: [chatName_#-#_chatId, ....]
		},
		// 陌生人
		stranger: {
		},
		
		// 群组成员信息
		groupMember: {
			groupId: {
				muted: {byName: {}},//群主可见，禁言列表
				byName: {
					name: {name: <String: name>, affiliation: 'member'}
				},
				names: [],
				admins: [],  //群管理员可见
			},
			...
		}
		
		// 订阅通知
		subscribe: {
			byFrom: {}
		},
		
		// 黑名单列表
		blacklist: {
			byName: {}
			name: []
		},
		
		// 消息
		message: {
		
			// 所有消息
			byId: {
				mid: {"type":"chat|groupchat|chatroom|stranger|error", "chatId": <String: chatId>},
				...
			}
			
			// 单聊消息列表
			chat: {
				chatId: [
                         {message},
                         ...
                        ]
			},
			
			// 群组消息列表
			groupChat: {
				chatId: [
                         {message},
                         ...
                        ]
			},
			
			// 聊天室消息列表
			chatroom: {
				chatId: [
                         {message},
                         ...
                        ]
			},
			
			// 陌生人消息列表
			stranger: {
				chatId: [
                         {message},
                         ...
                        ]
			},
			
			// 预留 暂无用
			extra: {}
			
			// 未读消息记录
			unread: {
			    // 好友
				chat: {
					chatId: <Number: unreadNum>,
					...
				},
				// 群组
				groupchat: {
					chatId: <Number: unreadNum>,
					...
				},
				// 聊天室
				chatroom: {
					chatId: <Number: unreadNum>,
					...
				},
				// 陌生人
				stranger: {
					chatId: <Number: unreadNum>,
					...
				}
			}
			
			// 自己发的消息mid跟本地id对照
			byMid: {
				messageId: {id: <String: localId>},
				...
			},
		},
		
		// 加入群申请
		groupRequest: {
			byGid: {}
		}
	}
}
</code>

----
<WRAP group>
<WRAP half column>
上一章节：[[im:400webimintegration:10webimintro|Web IM SDK集成]]
</WRAP>

<WRAP half column>
下一页：[[im:react-native|React Native集成]]
</WRAP>
</WRAP>