@jolibox/implement 1.1.4-beta.4

package/src/h5/http/utils/__tests__/xua.test.ts

@@ -0,0 +1,27 @@
+// import { expect, test } from 'jest';
+import { xUserAgent, getAppVersion } from '../../../../common/http/xua';
+import { isValidUUIDV4 } from '../../../../common/http/uuid';
+
+describe('xua', () => {
+  it('test xua', () => {
+    // window.__JOLIBOX_LOCAL_SDK_VERSION__ = '1.0.0';
+    const xua = xUserAgent();
+    const deviceInfoRegex = /.* (\(.*\) ).*/;
+    const deviceInfoMatch = xua.match(deviceInfoRegex);
+    const deviceInfo = deviceInfoMatch?.[1] ?? '';
+    const rest = xua.replace(deviceInfo, '');
+    expect(deviceInfo).toBe('(JoliboxSDKPC; UnknownModel; UnknownSystemVersion; en-US) ');
+
+    const [appName, uuidPart, adidPart, versionPart] = rest.split(' ');
+    const uuid = uuidPart.split('/')[1];
+    const adid = adidPart.split('/')[1];
+    const version = versionPart.split('/')[1];
+    expect(appName).toBe('JoliboxWebSDK');
+    expect(uuidPart.startsWith('uuid/')).toBe(true);
+    expect(adidPart.startsWith('adid/')).toBe(true);
+    expect(versionPart.startsWith('version/')).toBe(true);
+    expect(isValidUUIDV4(uuid)).toBe(true);
+    expect(isValidUUIDV4(adid)).toBe(true);
+    expect(version).toBe(getAppVersion());
+  });
+});

package/src/h5/http/utils/index.ts

@@ -0,0 +1,19 @@
+import * as xua from '@/common/http/xua';
+import * as session from './session';
+import * as uuid from '@/common/http/uuid';
+
+declare global {
+  interface Window {
+    JoliboxUtil: typeof JoliboxUtil;
+  }
+}
+
+class JoliboxUtil {
+  static xua = xua;
+  static session = session;
+  static uuid = uuid;
+}
+
+window.JoliboxUtil = JoliboxUtil;
+
+export { JoliboxUtil };

package/src/h5/http/utils/session.ts

@@ -0,0 +1,10 @@
+import { uuidv4 } from '../../../common/http/uuid';
+
+export const getGameSessionId = () => {
+  let sessionId = sessionStorage.getItem('gameSessionId');
+  if (!sessionId) {
+    sessionId = uuidv4();
+    sessionStorage.setItem('gameSessionId', sessionId);
+  }
+  return sessionId;
+};

package/src/h5/report/errors/index.ts

@@ -0,0 +1,40 @@
+/**
+ * h5 错误上报实现
+ */
+import '@/common/report/errors/report/listeners';
+import { BaseError, logger } from '@jolibox/common';
+import { errorReportEmitter } from '@/common/report/errors';
+import { ErrorData } from '@/common/report/errors/report';
+import { IEvent, EventType, EProject } from '@/common/report';
+import { tracker } from '../event-tracker';
+import { context } from '@/common/context';
+
+const doReport = (eventName: string, error: Error | BaseError) => {
+  const extra = {
+    message: error.message,
+    stack: error.stack ?? '',
+    errorType: error.name,
+    source: 0
+  };
+
+  const eventBody: IEvent = {
+    name: eventName,
+    type: EventType.ErrorTrace,
+    location: null,
+    target: null,
+    extra: extra,
+    timestamp: Date.now(),
+    userId: context.hostUserInfo?.uid ?? null
+  };
+
+  tracker.trackEvent(eventBody, EProject.WebSDK);
+};
+
+errorReportEmitter.on('GLOBAL_ERROR', (error, errorData: ErrorData) => {
+  doReport(errorData.tag, error);
+});
+
+errorReportEmitter.on('GLOBAL_USER_ERROR', (error, errorData: ErrorData) => {
+  // TODO: User Error
+  logger.log('UserError', error, errorData);
+});

package/src/h5/report/event-tracker.ts

@@ -0,0 +1,40 @@
+import { context } from '@/common/context';
+import { logger } from '@jolibox/common';
+import { EProject, EventTracker, EventType } from '@/common/report';
+import JoliboxHttpClient from '@/h5/http';
+
+export class H5EventTracker extends EventTracker {
+  private hostToApiMap: Record<string | 'default', { test: string; prod: string }> = {
+    default: {
+      test: 'https://stg-collect.jolibox.com',
+      prod: 'https://collect.jolibox.com'
+    },
+    'oss.jolibox.com': {
+      test: 'https://stg-collect.jolibox.com',
+      prod: 'https://collect.jolibox.com'
+    },
+    'oss.pico-game.com': {
+      test: 'https://stg-collect.pico-game.com',
+      prod: 'https://collect.pico-game.com'
+    }
+  };
+
+  private get apiBaseURL() {
+    const api = this.hostToApiMap[window.location.host] ?? this.hostToApiMap.default;
+    return context.testMode ?? false ? api.test : api.prod;
+  }
+
+  private httpClient = new JoliboxHttpClient({
+    baseUrl: this.apiBaseURL
+  });
+
+  doReport(event: unknown[]): void {
+    // this.httpClient.post("/report", {
+    //     data: event,
+    //     timeout: 5000,
+    //   });
+    logger.info('Track', event);
+  }
+}
+
+export const tracker = new H5EventTracker();

package/src/h5/report/index.ts

@@ -0,0 +1,56 @@
+import './errors';
+import { createCommands, EventEmitter, isNumber, isObject, isString } from '@jolibox/common';
+import { CommonReportConfig, createTracks, EProject, EventType, IEvent } from '../../common/report';
+import { tracker } from './event-tracker';
+import { H5TaskTracker } from './task-tracker';
+import { context } from '@/common/context';
+export * from '../../common/report/types';
+
+const commands = createCommands();
+
+const commonParams: CommonReportConfig = {
+  type: EProject.WebSDK,
+  platform: 'h5',
+  jssdk_version: context.sdkInfo.jssdkVersion,
+  source_id: context.game_id,
+  source_version: context.game_version
+};
+
+const { track, trackPerformance } = createTracks((...args) => {
+  const [, data] = args;
+
+  const _data = data as Record<string, unknown>;
+
+  const originExtra = isObject(_data.extra)
+    ? _data.extra
+    : isString(_data.extra)
+    ? JSON.parse(_data.extra)
+    : {};
+  const extra = {
+    ...originExtra,
+    source_id: (_data.source_id as string) ?? '',
+    source_version: (_data.source_version as string) ?? ''
+  };
+  const eventBody: IEvent = {
+    name: data.tag,
+    type: EventType.System,
+    location: null,
+    target: null,
+    extra: extra,
+    timestamp: Date.now(),
+    userId: context.hostUserInfo?.uid ?? null
+  };
+  tracker.trackEvent(eventBody, EProject.WebSDK);
+}, commonParams);
+export { track, trackPerformance };
+
+commands.registerCommand('ReportSDK.traceSystemTimeline', ({ event, duration }) => {
+  trackPerformance(event, duration);
+});
+
+commands.registerCommand('ReportSDK.traceSystem', ({ event, info }) => {
+  track(event, info);
+});
+
+export const h5TaskEmitter = new EventEmitter<{ visible: [boolean] }>();
+export const taskTracker = new H5TaskTracker(h5TaskEmitter);

package/src/h5/report/task-tracker.ts

@@ -0,0 +1,35 @@
+/**
+ * H5任务上报
+ */
+
+import { context } from '@/common/context';
+import { TaskTracker, TaskPoint } from '@/common/report/task-track';
+import { EventEmitter, logger } from '@jolibox/common';
+import JoliboxHttpClient from '../http';
+
+export class H5TaskTracker extends TaskTracker {
+  private gameId: string;
+  private sessionId: string;
+  private httpClient = new JoliboxHttpClient();
+
+  constructor(eventEmitter: EventEmitter<{ visible: [boolean] }>, interval?: number) {
+    super(eventEmitter, interval);
+    this.gameId = context.game_id;
+    this.sessionId = context.session_id;
+  }
+
+  async reporter(point: TaskPoint): Promise<void> {
+    const { event, params } = point;
+    // await this.httpClient.post(`/api/base/app-event`, {
+    //   data: {
+    //     eventType: event,
+    //     gameInfo: {
+    //       gameId: this.gameId,
+    //       sessionId: this.sessionId,
+    //       ...params
+    //     }
+    //   }
+    // });
+    logger.log('-----task tracker-----', event, params);
+  }
+}

package/src/index.native.ts

@@ -0,0 +1,7 @@
+//TODO: entrance for native
+import { config } from './native/bootstrap';
+
+import './native/api';
+import './native/report';
+
+config();

package/src/index.ts

@@ -0,0 +1,9 @@
+//TODO(DX): H5 entrance
+// internal modules
+import './h5/report';
+//global apis
+import './h5/api';
+import './h5/ads';
+import { config } from './h5/bootstrap';
+
+config();

package/src/native/api/base.ts

@@ -0,0 +1,8 @@
+import { registerCanIUseFactory } from '@/common/can-i-use';
+import { track } from '../report';
+import { createAPIFactory } from '@/common/api-factory';
+export const { createAPI, createSyncAPI } = createAPIFactory(track);
+
+export const registerCanIUse = registerCanIUseFactory('native');
+import { t } from '@/common/api-factory/validator';
+export { t };

package/src/native/api/get-system-info.ts

@@ -0,0 +1,41 @@
+import { createCommands } from '@jolibox/common';
+import { createSyncAPI, registerCanIUse } from './base';
+import { invokeNative } from '../bootstrap/bridge';
+
+const commands = createCommands();
+
+const API_ENV = 'env';
+const API_GET_SYSTEM_SYNC = 'getSystemInfoSync';
+
+const getSystemInfoSync = createSyncAPI(API_GET_SYSTEM_SYNC, {
+  implement: () => {
+    const res = invokeNative('envSync');
+    const { data } = res;
+    return {
+      system: data.deviceInfo.system,
+      platform: data.platform,
+      version: data.sdkInfo.jssdkVersion,
+      pixelRatio: data.deviceInfo.pixelRatio,
+      language: data.deviceInfo.lang
+    };
+  }
+});
+
+const getEnv = createSyncAPI(API_ENV, {
+  implement: () => {
+    const res = invokeNative('envSync');
+
+    return res?.data ?? undefined;
+  }
+});
+
+commands.registerCommand('API.getSystemInfoSync', getSystemInfoSync);
+commands.registerCommand('API.env', getEnv);
+
+registerCanIUse('env', {
+  version: '1.0.0'
+});
+
+registerCanIUse('getSystemInfoSync', {
+  version: '1.0.0'
+});

package/src/native/api/index.ts

@@ -0,0 +1,7 @@
+import './get-system-info';
+import './lifecycle';
+import './request';
+import './storage';
+import './keyboard';
+import './task';
+import './login';

package/src/native/api/keyboard.ts

@@ -0,0 +1,75 @@
+import { createCommands } from '@jolibox/common';
+import { applyNative } from '../bootstrap/bridge';
+import { createAPI, registerCanIUse, t } from './base';
+
+export const showKeyboard = createAPI('showKeyboard', {
+  paramsSchema: t.tuple(
+    t.object({
+      defaultValue: t.string().default(''),
+      multiple: t.boolean().default(false),
+      maxLength: t.unknown().optional().default(100000)
+    })
+  ),
+  async implement(params) {
+    const maxLength = Math.floor(Number(params.maxLength) ?? 100000);
+    let { defaultValue } = params;
+
+    if (defaultValue && maxLength) {
+      defaultValue = defaultValue.slice(0, maxLength);
+    }
+
+    applyNative('showKeyboardSync', { ...params, defaultValue, maxLength });
+  }
+});
+
+registerCanIUse('keyboard.showKeyboard', {
+  version: '1.0.0',
+  properties: {
+    params: {
+      defaultValue: '1.0.0',
+      multiple: '1.0.0',
+      confirmHold: '1.0.0',
+      confirmType: '1.0.0',
+      maxLength: '1.0.0'
+    }
+  },
+  success: {
+    errMsg: '1.0.0'
+  }
+});
+
+export const updateKeyboard = createAPI('updateKeyboard', {
+  paramsSchema: t.tuple(
+    t.object({
+      value: t.string()
+    })
+  ),
+  async implement(params) {
+    applyNative('updateKeyboardSync', params);
+  }
+});
+
+registerCanIUse('keyboard.updateKeyboard', {
+  version: '1.0.0',
+  properties: {
+    params: {
+      value: '1.0.0'
+    }
+  }
+});
+
+export const hideKeyboard = createAPI('hideKeyboard', {
+  async implement() {
+    applyNative('hideKeyboardSync');
+  }
+});
+
+registerCanIUse('keyboard.hideKeyboard', {
+  version: '1.0.0'
+});
+
+const commands = createCommands();
+
+commands.registerCommand('KeyboardSDK.showKeyboard', showKeyboard);
+commands.registerCommand('KeyboardSDK.updateKeyboard', updateKeyboard);
+commands.registerCommand('KeyboardSDK.hideKeyboard', hideKeyboard);

package/src/native/api/lifecycle.ts

@@ -0,0 +1,76 @@
+import { BaseError, createCommands, wrapUserFunction, hostEmitter } from '@jolibox/common';
+import { createAPI, createSyncAPI, registerCanIUse, t } from './base';
+import { reportError } from '@/common/report/errors/report';
+import { applyNative, onNative } from '../bootstrap/bridge';
+import { nativeTaskEmitter } from '../report';
+
+const EXIT_GAME = 'exitGame';
+const ON_READY = 'onReady';
+const ON_GAME_SHOW = 'onGameShow';
+const ON_GAME_HIDE = 'onGameHide';
+
+const commands = createCommands();
+
+const safeCallbackWrapper = wrapUserFunction(reportError as (err: Error | BaseError) => void);
+const exitGame = createAPI(EXIT_GAME, {
+  paramsSchema: t.tuple(t.function()),
+  implement: async (onBeforeExit: () => void) => {
+    const safeCallback = safeCallbackWrapper(onBeforeExit);
+    // 集中上报
+    safeCallback.call(this);
+    await applyNative('exitAppAsync');
+  }
+});
+
+const onGameShow = createSyncAPI(ON_GAME_SHOW, {
+  paramsSchema: t.tuple(t.function()),
+  implement(callback) {
+    const safeCallback = safeCallbackWrapper(callback);
+    onNative('onJoliboxEnterForeground', () => {
+      safeCallback.call(this);
+      nativeTaskEmitter.emit('visible', true);
+    });
+  }
+});
+
+const onGameHide = createSyncAPI(ON_GAME_HIDE, {
+  paramsSchema: t.tuple(t.function()),
+  implement(callback) {
+    const safeCallback = safeCallbackWrapper(callback);
+    onNative('onJoliboxEnterBackground', () => {
+      safeCallback.call(this);
+      nativeTaskEmitter.emit('visible', false);
+    });
+  }
+});
+
+const onReadyHandler = createSyncAPI(ON_READY, {
+  paramsSchema: t.tuple(t.function()),
+  implement(callback) {
+    const safeCallback = safeCallbackWrapper(callback);
+    hostEmitter.on('LifecycleEvent.onReady', (info) => {
+      safeCallback(info);
+    });
+  }
+});
+
+commands.registerCommand('LifecycleSDK.exit', exitGame);
+commands.registerCommand('LifecycleSDK.onReady', onReadyHandler);
+commands.registerCommand('LifecycleSDK.onJoliboxShow', onGameShow);
+commands.registerCommand('LifecycleSDK.onJoliboxHide', onGameHide);
+
+registerCanIUse('lifeCycle.exit', {
+  version: '1.0.0' // mock
+});
+
+registerCanIUse('lifeCycle.onReady', {
+  version: '1.0.0' // mock
+});
+
+registerCanIUse('lifeCycle.onGameShow', {
+  version: '1.0.0' // mock
+});
+
+registerCanIUse('lifeCycle.onGameHide', {
+  version: '1.0.0' // mock
+});

package/src/native/api/login.ts

@@ -0,0 +1,71 @@
+import { context } from '@/common/context';
+import { applyNative, invokeNative, onNative } from '../bootstrap/bridge';
+import { createAPI, t, registerCanIUse } from './base';
+import { APIError, createCommands, Deferred, hostEmitter } from '@jolibox/common';
+import { createAPIError } from '@/common/report/errors';
+
+registerCanIUse('login', {
+  version: '1.0.0',
+  properties: {
+    force: '1.0.0'
+  },
+  success: {
+    errMsg: '1.0.0',
+    code: '1.0.0',
+    token: '1.0.0',
+    isLogin: '1.0.0'
+  }
+});
+registerCanIUse('checkSession', {
+  version: '1.0.0',
+  success: {
+    errMsg: '1.0.0'
+  }
+});
+
+const login = createAPI('login', {
+  async implement() {
+    const isLogin = await applyNative('checkLoginAsync');
+    if (isLogin) {
+      return { isLogin: true, token: context.hostUserInfo?.token };
+    }
+    onNative('onLoginStateChange', ({ isLogin, token, uuid }) => {
+      if (uuid == loginUUID) {
+        resolve({ isLogin, token });
+      }
+    });
+    const res = invokeNative('loginSync');
+
+    const {
+      data: { uuid: loginUUID }
+    } = res;
+    if (!loginUUID) {
+      throw createAPIError({
+        code: -1,
+        msg: 'login failed'
+      });
+    }
+    const { promise, resolve } = new Deferred<{ isLogin: boolean; token?: string }>();
+
+    const loginRes = await promise;
+    context.onEnvConfigChanged({ hostUserInfo: loginRes });
+    hostEmitter.emit('onLoginComplete', loginRes);
+
+    return loginRes;
+  }
+});
+
+const checkSession = createAPI('checkSession', {
+  async implement() {
+    const {
+      data: { isLogin }
+    } = await applyNative('checkLoginAsync');
+    return {
+      isLogin
+    };
+  }
+});
+
+const commands = createCommands();
+commands.registerCommand('API.login', login);
+commands.registerCommand('API.checkSession', checkSession);

package/src/native/api/request.ts

@@ -0,0 +1,154 @@
+import { createAPIError } from '@/common/report/errors';
+import { createFetch } from '../network/create-fetch';
+import { createAPI, registerCanIUse, t } from './base';
+import { dirtyURL, normalizeHeader, normalizeMethod, normalizeTimeout } from '../network/utils';
+import { BaseError, createCommands, Deferred, wrapUserFunction } from '@jolibox/common';
+import { AnyFunction, ResponseType } from '@jolibox/types';
+import { reportError } from '@/common/report/errors/report';
+import { FetchOptions } from '../network/types';
+
+const LIMIT = 15;
+
+const publicFetch = createFetch('createRequestTaskSync', 'operateRequestTaskSync', {
+  type: 'public'
+});
+
+/** current active count */
+let activeCount = 0;
+
+const deferQueue: AnyFunction[] = [];
+
+const safeCallbackWrapper = wrapUserFunction(reportError as (err: Error | BaseError) => void);
+
+const remove = <T>(array: T[], predicate: (item: T) => boolean) => {
+  const removedElements = array.filter(predicate);
+
+  const remainingElements = array.filter((item) => !predicate(item));
+  array.length = 0;
+  array.push(...remainingElements);
+
+  return removedElements;
+};
+
+const request = (_params: unknown) => {
+  const deferred = new Deferred<{
+    code: ResponseType;
+    data?: string | JSON | ArrayBuffer | undefined;
+    message: string;
+  }>();
+
+  let teardown = () => {
+    // noop
+  };
+
+  const _request = createAPI('request', {
+    paramsSchema: t.tuple(
+      t.object({
+        url: t.string(),
+        method: t.string(),
+        header: t.object(),
+        data: t.object().optional(),
+        query: t.object().optional(),
+        dataType: t.string().default('json'),
+        responseType: t.string().default('text'),
+        enableCache: t.boolean().default(false),
+        appendHostCookie: t.boolean().default(true),
+        timeout: t.number().default(30000),
+        success: t.function(),
+        fail: t.function()
+      })
+    ),
+    implement(params) {
+      const action = async () => {
+        const failCallback = safeCallbackWrapper(params.fail);
+        try {
+          activeCount += 1;
+
+          // 在 action 执行前, 如果用户就调用了 abort 的话就会命中该逻辑
+          if (deferred.state !== 'pending') {
+            return;
+          }
+          const { data, dataType, responseType, enableCache, appendHostCookie } = params;
+
+          const header = normalizeHeader(params.header);
+          const method = normalizeMethod(params.method);
+          const timeout = normalizeTimeout(params.timeout);
+          const url = dirtyURL(params.url, method, data);
+          const successCallback = safeCallbackWrapper(params.success);
+
+          const _params = Object.assign({}, params, {
+            method,
+            header,
+            data: method === 'GET' || method === 'HEAD' ? undefined : data, // GET HEAD 请求不需要 data 参数
+            enableCache,
+            query: params.query ?? ({} as Record<string, string>),
+            dataType,
+            responseType,
+            appendHostCookie
+          }) as FetchOptions;
+
+          if (timeout) _params['timeout'] = timeout;
+
+          const task = publicFetch<string | ArrayBuffer | JSON>(url, _params);
+
+          {
+            const { response } = await task;
+            const { code, data, message } = response;
+
+            deferred.resolve({
+              code: (code ?? 'SUCCESS') as ResponseType,
+              data,
+              message: message ?? 'request:ok'
+            });
+
+            successCallback({
+              code: 'SUCCESS',
+              message: 'request:ok',
+              data
+            });
+          }
+        } catch (err) {
+          deferred.reject(err as Error);
+          failCallback({
+            code: 'FAILURE',
+            message: 'httpRequst: failed'
+          });
+        } finally {
+          activeCount -= 1;
+          deferQueue.shift()?.();
+        }
+      };
+
+      if (activeCount >= LIMIT) {
+        teardown = () => {
+          remove(deferQueue, (i) => i === action);
+        };
+        deferQueue.push(action);
+      } else {
+        void action();
+      }
+
+      return deferred.promise;
+    }
+  });
+
+  _request(_params);
+
+  return {
+    /**
+     *  1. requesting...
+     *  2. not in deferred
+     */
+    abort() {
+      deferred.reject(createAPIError({ code: -1, msg: 'request:fail abort' }));
+      teardown();
+    }
+  };
+};
+
+const commands = createCommands();
+
+commands.registerCommand('HttpSDK.request', request);
+registerCanIUse('request', {
+  version: '1.0.0'
+});