继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

微信语音在网页端播放

niunan
关注TA
已关注
手记 63
粉丝 20
获赞 97

微信语音在网页端播放

做的一个项目,需要个功能,微信公众号里点菜单进去一个网页后能和后台客服人员在线聊天,而且还能发送语音,
后台客服人员在电脑PC端上登录网页也能和用户进行在线聊天,并且能听到语音。

制作思路:
文字聊天功能用最简单的方式,客户聊天页/user/chat, 后台聊天页/admin/chat,数据库聊天表chat,
聊天页里文本框,发送按钮,点了就把文本框里的内容存到数据库聊天表中,
然后在聊天页用js的setinterval定时从数据库里取出数据显示;

发送语音功能,用户聊天是在微信里聊天的,可以使用微信的JSSDK来发送语音(https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html),发送语音后会有个本地localid, 还需要用那个JSSDK里的上传方法上传到微信服务器上取得serverid,属于

临时素材,只能存储三天,发送按钮就把这个serverid存到数据库chat里,在用户聊天页上就可以直接调用JSSDK里的方法来播放语音;

相关JS代码:

http://img.mukewang.com/5e5271a80001dd3912030437.jpg

http://img2.mukewang.com/5e5271a8000161a219521110.jpg

http://img4.mukewang.com/5e5271a8000184b115411362.jpg


后台聊天页从数据库取出Serverid,然后再用微信公众号开发文档里的获取临时素材接口(https://developers.weixin.qq.com/doc/offiaccount/Asset_Management/Get_temporary_materials.html)下载音频,下载到的是speex格式的,上网找了好久,才找到个speex格式转到wav格式的命令行工具,WIN下可用的,转为wav格式后就可以用h5的audio来播放音频了,这样就能在网页上听到声音了

JS代码:

http://img4.mukewang.com/5e5271d000016c5910210616.jpg

后台代码:

http://img3.mukewang.com/5e5271de0001b0cc22631354.jpg


speex格式转wav的工具,WIN下用的

http://image.niunan.net/spx2wav_win.zip


用自己写的微信helper,用于.net下的,core下的没试过,不知道能不能用
http://blog.niunan.net/blog/show/1278


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP