作者：Sro
博客：http://www.imgeek.org/people/Sro
本文来自环信稿酬计划：环信稿酬计划，你写作我付钱，让知识创造价值。
我是用think PHP做的项目，我们的需求是用IM跟他人聊天并且保存聊天记录到本地。我把整个环信文件下载了下来放在了项目的js文件里。并且没有做单独的页面渲染直接用的环信原来的页面，所以大部分功能都写在了控制器里最后跳转到IM的页面。
第一步，IM集成
这个可以参照文档，但是这个文档好像是过时的，如果集成失败可以上官方登陆页面 http://webim.easemob.com/ 把页面加载的文件抄下来。
第二步，自动登陆和他人聊天
此步要先把网站上的用户注册一个环信账号,然后自动登陆跳过环信的登陆页面，然后把对方加为好友(此步如果对方没有环信账号也需要把好友注册一个环信账号)。上代码
逻辑是这么实现的，因为在控制器里做的操作，所以登陆信息要保存在cookie里。里面的方法都可以在http://api-docs.easemob.com/%2 ... token这个环信的服务器端集成Swagger文档里找到，然后用Curl调用，或者一个更简单的方法，有一个完整的类可以用，链接在此https://github.com/easemob/emc ... t.php，简单的curl是这么用的
好此步就此完成
第三步，头像、昵称 渲染
这步我的处理方法是把你网站用户的头像和昵称查出来然后存在cookie里，然后在demojs文件里进行调用，这步主要麻烦的地方是需要在demo.js的文件里找到页面渲染的地方，大约有8个地方(23288，27321，29764，29862，30101，31211，31360，31465)
这三步完成基本就完成了IM整合进项目了，还有一个保存聊天记录到本地，我没有用官方的接口来下载历史记录，听说下载下来是一个包，而且数据还会有丢失，所以我的做法是每次发送消息调用自己的Ajax来进行保存数据库操作，然后新在打开聊天的时候请求后台获得聊天记录。
好，我在demojs里找到了2个发送消息时候的方法，一个是发送文字和表情，一个是发送图片。sendText(27399)这个方法是发送文字和表情的
msg.boy里面可以获得到你需要保存在数据库里的所有信息，chat_time是因为聊天记录的时间格式是2018/4/9 上午9:53:03这种的所以我自己加上去的。
pictureChange(22977)这个方法是发送图片的，这里的url非常重要，而且在msg.set在外面拿不到所以我放在了方法里面调用的Ajax，这个url 是
https://a1.easemob.com/1110170 ... 79a8b
这样的二进制一会需要下载到本地或者上传到你需要的图片存储空间，我放在了七牛上。
保存文字信息非常简单，就像下图一样就可以了，下面的做的判断是当消息类型是图片的时候调用一下图片上传方法
这个图片是图片上传方法，我在后台用CURL进行了上传操作，最开始我先把图片保存在了本地然后再上传，后来我找了二进制可以上传，改成了这个样子，值得注意的是我用CURL调用的url返回的值会有一个红色的符号，所以我用substr给它截掉了，之前没发现怎么都找不到图片。这里的接口就是一个普通的上传方法然后返回的是图片名称。这样聊天记录也保存完毕了。
表结构
下一步是读取聊天记录releaseChatRecord这个方法是demojs每次你点击聊天窗口都会触发的方法，我把ajax放在这这里。
图片里的targetId就是你当天聊天的好友id,自己的id怎么得到不需要说了吧，你肯定是在登陆状态才能聊天。Demo.chatRecord这个就是需要替换的聊天记录，Ajax请求后台
这里注意的是要获得聊天记录需要进行红圈里的判断，来分别你给我发的消息和你给我发的消息，我之前犯得错误没判断最后只获得了我给他人发的消息记录。。。循环里的是构造demojs需要用的json数据。这个对象结构可以在releaseChatRecord方法里console.log()出来然后自己拼装。
这样已经基本完成了最后上成功后的图片
还有个问题没处理就是未送达那个文字，因为我构造的数据里没有加上read=true.你可以选择把IM里这个功能关闭或者在数据里加上去。
这样保存聊天记录的方式是每次发送都进行保存如果人数太多或太频繁可能会出现问题，以后可能会换成调用官网的获得历史记录的接口。
