Home > WeChat Applet > Mini Program Development > Take you to have an in-depth understanding of WeChat applet integrated Huanxin SDK

Take you to have an in-depth understanding of WeChat applet integrated Huanxin SDK

Y2J
Release: 2017-04-27 15:51:30
Original
4763 people have browsed it

This article uses a small example to simply demonstrate how to use the Huanxin SDK to send and receive messages in the WeChat applet.

After downloading the official website demo, copy the files in the entire utils directory to the directory of our own project.

Take you to have an in-depth understanding of WeChat applet integrated Huanxin SDK


##Replace

AppKey with your own application in WebIMConfig.js The key

interface is simply composed of an input box and a button. Click the button to send a message.

Take you to have an in-depth understanding of WeChat applet integrated Huanxin SDK


##Import

WebIM.js

var WebIM = require('../../utils/WebIM.js')
var WebIM = WebIM.default
Copy after login
Login

hxloign: function () {
        var options = {
            apiUrl: WebIM.config.apiURL,
            user: 'u1',
            pwd: 'p1',
            grant_type: 'password',
            appKey: WebIM.config.appkey //应用key
        }
        WebIM.conn.open(options)
    },
Copy after login

Send text message

 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);
    },
Copy after login

Receive message

To receive a message, you must first add a callback function in

app.js

app.js

Get the chat interface

  getRoomPage: function () {
        return this.getPage("pages/index/index")//聊天界面
    },
   getPage: function (pageName) {
        var pages = getCurrentPages()
        return pages.find(function (page) {
            return page.__route__ == pageName
    })
Copy after login
Declare in the

app.js

onlanuch method

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

index.js

to receive the message Method

receiveMsg: function (msg, type) {
        console.log(msg);
    },
Copy after login
Even if the simple function of sending and receiving messages has been implemented, the rules for sending voice and pictures are similar, but the parameters are different. You can refer to the Message Environment Development Document

The above is the detailed content of Take you to have an in-depth understanding of WeChat applet integrated Huanxin SDK. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template