Чат веб-сокета апплета WeChat

задний план

Недавно я сделал функцию обмена мгновенными сообщениями апплета WeChat.Раньше я также сделал службу веб-сокетов из node.js, но это была служба socket.io, применяемая на веб-стороне. Сам апплет имеет много ограничений на соединения, такие как http и websocket, поэтому в этом проекте был выбран модуль ws, поставляемый с node.js.

Сервер

Инициализируйте проект node.js и введите модуль ws

const webSocket = require('ws');

Создайте экземпляр веб-сокета и установите порт прослушивания

const wss = new webSocket.Server({
    port: 3001
});

Определите методы экземпляра wss для реализации мониторинга сокетов и публикации информации. Вставьте простой пример ниже:

wss.on('connection', function connection(ws, req) {
    console.log('连接开启')
    
    //发生错误
    ws.on('error', function error(error) {
        console.log('error', error);
    });

    //断开连接
    ws.on('close', function close(close) {
        console.log( '已关闭');
    });

    ws.on('message', function message(message) {
        ws.send('客户端发来了一条消息')
    });

    //发送消息
    ws.send('连接已开启');
    ws.send(id + '已连接')
});

Таким образом настраивается простой сервис веб-сокетов. Конечно, проблема гораздо больше. Для общения в апплете необходимо решить следующие проблемы.

доменное имя

Что касается конфигурации доменного имени сервера апплета, в документации по разработке апплета упоминается следующее.

Адрес запроса апплета поддерживает только протокол https или wss, поэтому первое, что необходимо настроить, — это SSL-сертификат. После получения SSL-сертификата вы можете настроить https на сервере.

var fs = require('fs');
const options = {
    key: fs.readFileSync('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', 'utf8'),//证书地址
    cert: fs.readFileSync('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', 'utf8'),//证书地址
};
var https = require('https');
var server = https.createServer(options, app);

Также стоит отметить, что номер порта, отслеживаемый websocket, должен быть прокси-сервером, потому что, если номер порта не настроен для апплета, все запрошенные URL-адреса не могут иметь номер порта.

многокомнатная связь

Давайте сначала посмотрим на реализацию вещания:

//广播方法
wss.broadcast = function broadcast(data) {
    wss.clients.forEach(function each(client) {
        client.send(data)
    });
};

Клиенты объекта wss представляют собой массив, в котором хранятся все объекты подключения к сокету, и каждый объект подключения может вызывать свой собственный метод отправки для отправки информации.

На этой основе мы можем провести определенную инкапсуляцию и сопоставить каждое соединение сокета с уникальным идентификатором, чтобы, когда нам нужно отправить информацию на конкретное соединение, мы могли найти это соединение.

Его можно однозначно идентифицировать по подключенному URL-адресу:

 let sockets = {}
 wss.on('connection', function connection(ws, req) {
        let id = req.url.slice(5);//截几位字符串根据自己实际获得的url来看
        sockets[id] = ws;
        ws.send(id + '已连接');
        ...

Каждый раз, когда клиент подключается, уникальный идентификатор вставляется после URL-адреса и получается с сервера.req.urlИ перехватите строку, чтобы получить уникальный идентификатор, и сохраните объект подключения в глобальных сокетах для использования при необходимости.

На этой основе можно продолжать инкапсулировать такие функции, как присоединение к комнате, выход из комнаты, общение в комнате, приватный чат с конкретным пользователем и т. д. В общем случае это инкапсуляция метода отправки. Стоит отметить, что метод send может отправлять только строки, а объект json необходимо преобразовать в строку, а затем передать на отправку.

Вот пример приватного чата:

wss.notice = function notice(id, data, ws) {
    // 向指定id发送
    try {
        ws.send('正在发送...')
        var notice = JSON.stringify({
            type: 'notice',
            data: data
        })
        let target = sockets[id]
        if (target) {
            target.send('收到一条新消息')
            target.send(notice)
        } else {
            ws.send('目标信道已关闭')
        }
    } catch (err) {
        console.log(err)
    }
}

На этом простая настройка сервера чата в основном завершена.

Окончательный результат выглядит следующим образом:

Часть деталей кода, пожалуйста, переместите аудиторию, господаПример конфигурации сервера и клиента чата в апплете WeChat ^.^

Если у вас есть какие-либо вопросы, вы можете обсудить это вместе, и будет лучше, если вам понравится!