首頁 > 微信小程式 > 小程式開發 > 帶你深入了解微信小程式整合環信SDK

帶你深入了解微信小程式整合環信SDK

Y2J
發布: 2017-04-27 15:51:30
原創
4747 人瀏覽過

本文以一個小例子簡單的示範在微信小程式中使用環信SDK收發訊息。

官網demo 下載後把整個utils目錄下的檔案複製到咱自己工程的目錄下。

帶你深入了解微信小程式整合環信SDK


WebIMConfig.js#中將AppKey替換成自己應用的key

介面簡單的用一個輸入框和一個按鈕組成,點擊按鈕發送訊息。

帶你深入了解微信小程式整合環信SDK


匯入WebIM.js

var WebIM = require('../../utils/WebIM.js')
var WebIM = WebIM.default
登入後複製

登陸

hxloign: function () {
        var options = {
            apiUrl: WebIM.config.apiURL,
            user: 'u1',
            pwd: 'p1',
            grant_type: 'password',
            appKey: WebIM.config.appkey //应用key
        }
        WebIM.conn.open(options)
    },
登入後複製

發送文字訊息

 sendMessage: function () {

        var that = this
        var id = WebIM.conn.getUniqueId();
        var msg = new WebIM.message('txt', id);
        msg.set({
            msg: this.data.inputValue,//输入框的文本
            to: 'u0',
            roomType: false,
            success: function (id, serverMsgId) {
            }
        });
        msg.body.chatType = 'singleChat';
        WebIM.conn.send(msg.body);
    },
登入後複製

接收訊息

接收訊息要先在app.js中加入回呼函數

app.js 取得聊天介面

  getRoomPage: function () {
        return this.getPage("pages/index/index")//聊天界面
    },
   getPage: function (pageName) {
        var pages = getCurrentPages()
        return pages.find(function (page) {
            return page.__route__ == pageName
    })
登入後複製

app.jsonlanuch方法中進行宣告

   var that = this;
        WebIM.conn.listen({
            onTextMessage: function (message) {
                var page = that.getRoomPage()
                if (message) {
                    if (page) {
                        page.receiveMsg(message, 'txt')//receiveMsg方法就是咱在自己界面定义的方法
                     }else{
                        //界面不存在
                      }
                }
            }
        })
登入後複製

index.js中定義的接收訊息的方法

receiveMsg: function (msg, type) {
        console.log(msg);
    },
登入後複製

到此簡單的收發訊息功能就算實現了,發送語音圖片規則都差不多,只不過參數不一樣,可以參考訊息環信開發文檔

以上是帶你深入了解微信小程式整合環信SDK的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板