How to use miniapp-framework-shared - 10 common examples

postMessage(message) {
        // add clientId and pageName for payload.
        const payload = { pageName, clientId, ...message };
        const data = { target: 'AppWorker', payload };
        debug(`r@${clientId}->w`, data);
        messageRouter.eventHandler({ data });
      },
      /**

instantiatePage() {
    let component;
    try {
      const { document, evaluator } = this.driver;
      let { factory } = getPage(this.pageName, this.raxInstance);
      component = applyFactory(factory, {
        page: this,
        clientId: this.clientId,
        pageName: this.pageName,
        rax: this.raxInstance,
        pageQuery: this.pageQuery,
        document,
        evaluator,
      });
    } catch (err) {
      log('Instantite page with error, catch and show error page.');
      console.error(err);
      component = applyFactory(getUnknownPageFactory(this.raxInstance, '加载出现了错误'));
    }
    return component;
  }

if (!params.replaceState) {
      history.go(-delta);
      return;
    }

    let prevClient = this.currentClient;
    do {
      prevClient = prevClient.prevClient;
    } while (--delta && prevClient);

    if (prevClient) {
      this.currentClient.destroy();
      this.currentClient = prevClient;
      this.currentClient.show();
    } else {
      log('No prev page at all.');
    }

    this.notifyListeners();
  }

eventHandler = (evt) => {
    /**
     * Message:
     *  { type: String, target: String, ...others }
     */
    const { data } = evt;
    if (!data) {
      log('Receive illegal data', evt);
      return;
    }

    const { target, payload } = data;
    if (target === 'AppWorker') {
      this._worker.postMessage(data);
    } else if (target === 'AppContainer') {
      this.handleMessageFromWorker(payload);
    } else if (this._channels[target]) {
      this._channels[target].onmessage(payload);
    } else {
      this.defaultHandler(data);
    }
  }
}

onmessage() {
        log(`w->r@${clientId}`, 'Unexpected handler of message.');
      },
    };

this._tabbar[method](params);
        this.callbackRemoteCall(callId, null, null);
        break;

      default:
        const resolveCallback = (result) => {
          this.callbackRemoteCall(callId, null, result);
        };
        const rejectCallback = (err) => {
          this.callbackRemoteCall(callId, err, null);
        };

        if (my[method]) {
          my[method](params, resolveCallback, rejectCallback);
        } else {
          log('WARN: API Module not exists or supported.');
        }
    }
  }

* @Note: if navigateType is `navigate`, which means
       * it is navigateTo, others are the right types.
       */
      if (!navigateType || navigateType === 'navigate') navigateType = 'navigateTo';
      my[navigateType]({ url: navigateTo });
      break;
    }

    case EVENT_UPDATE_PAGEDATA: {
      const client = getClient(payload.clientId);
      client.emitEvent('updatePageData', payload.data);
      break;
    }

    default:
      log('Can not recognize message', data);
  }
}

import raxCode from '!!raw-loader!rax/dist/rax.min.js';
import createDriver from 'driver-worker';
import { log, worker } from 'miniapp-framework-shared';
import { applyFactory } from './getModule';
import { emit as emitPageLifecycle } from './lifecycles/page';

const raxFactory = new Function('module', 'exports', raxCode);
const { getPage, getUnknownPageFactory } = worker.pageHub;
const { on: addClientEvent } = worker.clientHub;
const CURRENT_CLIENT_ID = '__current_client_id__';
const MINIAPP_ENV = '__miniapp_env__';

export default class Client {
  constructor(clientId, pageName, pageQuery = {}) {
    this.clientId = clientId;
    this.pageName = pageName;
    this.pageQuery = pageQuery;
    this.raxInstance = createRax();
    this.eventListeners = {};

    this.setup();
  }

  setup() {
    const { createElement, render } = this.raxInstance;

import { call } from './remoteCall';
import * as appLifecycle from './lifecycles/app';
import Client from './Client';
import getModule from './getModule';

setupGlobalObject({
  my,
  require: getModule,
  /**
   * @Note: Internal varibale to judge IDE/Web env.
   */
  __framework_type__: frameworkType,
});
addEventListener('message', messageHandler);

const { emit: emitToClient, addClient, getClient } = worker.clientHub;
const CURRENT_CLIENT_ID = '__current_client_id__';
const MINIAPP_ENV = '__miniapp_env__';
const EVENT_IMPORT_SCRIPTS = 'importScripts';
const EVENT_REGISTER_API = 'registerAPI';
const EVENT_START_RENDER = 'init';
const EVENT_EVALUATOR_EVENT = 'event';
const EVENT_EVALUATOR_RETURN = 'return';
const EVENT_CYCLE_APP = 'app:lifecycle';
const EVENT_CYCLE_PAGE = 'page:lifecycle';
const EVENT_NAVIGATOR = 'navigate';
const EVENT_UPDATE_PAGEDATA = 'updatePageData';
const EVENT_SET_ENV = 'setEnv';

/**
 * Worker message handler.
 * @param data

import raxCode from '!!raw-loader!rax/dist/rax.min.js';
import createDriver from 'driver-worker';
import { log, worker } from 'miniapp-framework-shared';
import { applyFactory } from './getModule';
import { emit as emitPageLifecycle } from './lifecycles/page';

const raxFactory = new Function('module', 'exports', raxCode);
const { getPage, getUnknownPageFactory } = worker.pageHub;
const { on: addClientEvent } = worker.clientHub;
const CURRENT_CLIENT_ID = '__current_client_id__';
const MINIAPP_ENV = '__miniapp_env__';

export default class Client {
  constructor(clientId, pageName, pageQuery = {}) {
    this.clientId = clientId;
    this.pageName = pageName;
    this.pageQuery = pageQuery;
    this.raxInstance = createRax();
    this.eventListeners = {};

    this.setup();
  }

  setup() {