Plugin Light

Appearance

分享 SDK ​

轻量级的分享 SDK。支持以下渠道

  1. 游戏内
  2. 营地
  3. QQ、微信
  4. 其他，包括系统浏览器

1. 作者 ​

novlan1

2. 如何使用 ​

可直接引入，也可异步加载。

2.1. 直接引入 ​

安装：

bash
pnpm add share-light

main.ts 中：

ts
import { initShare, openShareUI } from 'share-light';

initShare({
  showToast: (message) => {
    Toast.show(message);
  },
  showConfirmDialog: Dialog.confirm,
  title: 'Better Share',
  configWx,
});

openShareUI();

2.2. 异步加载 ​

也可异步加载，并使用其提供的全局变量 shareLightSDK，性能更佳。

ts
const SHARE_LIGHT_SCRIPT = 'https://image-1251917893.file.myqcloud.com/igame/npm/share-light/share-light%400.0.5.prod.js';

function init(
  func: 'initShare' | 'hideShareBtn' | 'openShareUI' | 'setupWzydShare',
  options?: ShareObject | string,
) {
  return new Promise((resolve) => {
    const innerCall = () => window.shareLightSDK?.[func]?.(options);
    if (inited && window.shareLightSDK) {
      resolve(innerCall());
      return;
    }

    loader(SHARE_LIGHT_SCRIPT, () => {
      inited = true;
      resolve(innerCall());
      return;
    });
  });
}

export function initShare(options: ShareObject) {
  return init('initShare', {
    hideShareType: getHideShareType(),
    showToast: (message) => {
      Toast.show(message);
    },
    showConfirmDialog: Dialog.confirm,

    configWx,
    // 业务如果需要，自行传入 postGetMiniProgramOpenLink，减小公共代码体积
    // 以下代码为示例
    // postGetMiniProgramOpenLink: (shareObject) => {
    //   const data = (shareObject.path || '').split('?');
    //   return postGetMiniProgramOpenLink({
    //     adcfg: {},
    //     appid: getJumpMiniProgramAppid(shareObject.gid),
    //     path: data.length > 0 ? data[0] : '',
    //     param_data: data.length > 1 ? data[1] : '',
    //     jump_type: JUMP_TYPES.CUSTOM_NO_ENCODE,
    //   });
    // },

    ...options,
  });
}

export function hideShareBtn() {
  return init('hideShareBtn');
}

export function openShareUI() {
  return init('openShareUI');
}

export function setupWzydShare(url: string) {
  return init('setupWzydShare', url);
}

3. 类型 ​

ts
export const SHARE_TYPE_MAP = {
  Wechat: 1,
  Timeline: 2,
  QQ: 3,
  QZone: 4,
} as const;

export type ShareType = typeof SHARE_TYPE_MAP[keyof typeof SHARE_TYPE_MAP];


export interface ShareObject {
  title?: string;
  desc?: string;
  icon?: string;
  link?: string;
  callback?: (_shareType?: ShareType) => {};

  path?: string | null;
  type?: string | number | null;
  miniprogram_link?: string;
  miniprogramAppId?: string;

  gid?: number;
  forceHistoryMode?: boolean;
  isWzydShare?: boolean;
  wzydShareText?: string;

  // 要隐藏的分享类型，游戏内可用，比如传入 [1]，即隐藏微信好友分享
  hideShareType?: Array<ShareType>;

  tipMap?: {
    copyTextSuccess?: string;
    copyTextFail?: string;
    dialogTitle?: string;
    dialogMessage?: string;
    dialogConfirmButton?: string;
  };

  showToast?: (message: string) => any;
  showConfirmDialog?: (options: {
    title?: string;
    message?: string;
    confirmButtonText?: string;
    showCancelButton?: boolean;
  }) => any;

  postGetMiniProgramOpenLink?: (options: ShareObject) => Promise<any>;
  configWx?: (apiList: string[], openTagList?: string[]) => Promise<any>;
}

export interface ShareUIObject {
  initCommShareUI?: (callbackName: string) => void;
  initCommShareTip?: () => void;
  showCommShareUI?: () => void;
  showCommShareTip?: () => void;
  openShareUI?: () => void;
}

4. 内部配置 ​

默认分享图片和提示文案等，可通过 initShare 参数覆盖。

ts
export const DEFAULT_SHARE_ICON = 'http://ossweb-img.qq.com/images/pmd/igameapp/logo/log_igame_3.0.png';

export const DEFAULT_TIP_MAP = {
  copyTextSuccess: '复制链接成功，快去粘贴吧！',
  copyTextFail: '该浏览器不支持自动复制',
  dialogTitle: '温馨提示',
  dialogMessage: '请复制链接到微信或手机QQ内打开参与活动',
  dialogConfirmButton: '我知道了',
};

5. 更新日志 ​

点此查看

6. 制作背景 ​

参考 分享模块重构

7. 其他 ​

更新为异步后，每次修改 share-light，需要：

  1. 发布 share-light 的 npm 包
  2. build 后，将构建产物 index.prod.js 上传到 COS 上，并重命名为 share-light@version.prod.js
  3. 用上面新的 COS 链接代替 pmd-widget/share-v2 中的 script 链接