@abtnode/ws 中文文档教程

发布于 3年前 浏览 19 项目主页 更新于 3年前

ABT Node WebSocket

基于 Websocket 和 Phoenix Protocol

Usage

  1. WsServer
const { WsServer } = require('@abtnode/ws');

/**
 * @params {Object} opts
 *  @params {http.Server} opts.httpServer
 *  @params {String} opts.pathname default to '/websocket'
 *  @params {Function} opts.authenticate
 */
const wsServer = new WsServer({
  httpServer: http.createServer(),
  authenticate: (req, cb) => {
    const { searchParams } = new URL(req.url, `http://${req.headers.host || 'unknown'}`);
    const token = searchParams.get('token');
    if (!token) {
      cb(new Error('token not found'), null);
      return;
    }

    // custom logic for validate token
    const authInfo = validateToken(token);

    // if validate success
    cb(null, authInfo);

    // if validate error
    cb(new Error('validate fail'), null);
  },
});

// attach to httpServer(httpServer has passed by constructor)
wsSerer.attach();

// push message
wsServer.push('blocklet.installed', data);
wsServer.push('notification.create', data);
  1. WsClient

WsClient 的 ABT Node PubSub 继承自 Phoenix(source),

import WsClient from '@abtnode/ws/lib/client';

// create instance
const socket = new WsClient(`//${window.location.hostname}`, {
  // params will be passed to server through url
  params: () => ({
    // token is used for authentication
    token: window.localStorage.getItem('abt_node_login_token'),
  }),

  // Defaults to none
  logger: (type, msg, data) => console.log(type, msg, data),
});

// connect
socket.connect();

// add subscriber
socket.on('blocklet.installed', callback1);
socket.on('notification.create', callback2);

// remove subscriber
socket.off('blocklet.installed', callback1);
socket.off('notification.create', callback2);

// disconnect
socket.disconnect(() => {
  // after disconnected...
});
  1. Hooks

在 React 应用中创建钩子非常简单。

ABT Node WebSocket

ABT Node PubSub base on Websocket and Phoenix Protocol

Usage

  1. WsServer
const { WsServer } = require('@abtnode/ws');

/**
 * @params {Object} opts
 *  @params {http.Server} opts.httpServer
 *  @params {String} opts.pathname default to '/websocket'
 *  @params {Function} opts.authenticate
 */
const wsServer = new WsServer({
  httpServer: http.createServer(),
  authenticate: (req, cb) => {
    const { searchParams } = new URL(req.url, `http://${req.headers.host || 'unknown'}`);
    const token = searchParams.get('token');
    if (!token) {
      cb(new Error('token not found'), null);
      return;
    }

    // custom logic for validate token
    const authInfo = validateToken(token);

    // if validate success
    cb(null, authInfo);

    // if validate error
    cb(new Error('validate fail'), null);
  },
});

// attach to httpServer(httpServer has passed by constructor)
wsSerer.attach();

// push message
wsServer.push('blocklet.installed', data);
wsServer.push('notification.create', data);
  1. WsClient

WsClient is inherited from Phoenix(source),

import WsClient from '@abtnode/ws/lib/client';

// create instance
const socket = new WsClient(`//${window.location.hostname}`, {
  // params will be passed to server through url
  params: () => ({
    // token is used for authentication
    token: window.localStorage.getItem('abt_node_login_token'),
  }),

  // Defaults to none
  logger: (type, msg, data) => console.log(type, msg, data),
});

// connect
socket.connect();

// add subscriber
socket.on('blocklet.installed', callback1);
socket.on('notification.create', callback2);

// remove subscriber
socket.off('blocklet.installed', callback1);
socket.off('notification.create', callback2);

// disconnect
socket.disconnect(() => {
  // after disconnected...
});
  1. Hooks

It's very simple to create hooks in react apps.

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文