tsp-component/lib/framework/weixin.ts

提供多端和react版本的UI组件

import Exception from '../exception';
import Framework from './index';
import Toast from '../toast';
import { hex_sha1 } from '../util/tools/sha1';

declare const wx: any;
declare const process: {
  env: {
    NODE_ENV: string;
  }
};
interface WxOnShareParams {
  title?: string;
  imgUrl?: string;
  desc?: string;
  success?: () => void;
}

class WeiXin {
  constructor(params: TspFrameworkWeiXinOptions) {
    this.shareCurrentUrl = params.shareCurrentUrl;
    this.ready = params.ready;
  }

  /** 当前页面encodeURIComponent后的地址 */
  public shareCurrentUrl: string;
  /** wx.ready回调  */
  public ready: () => void;

  /** 从相册中选择图片 */
  public chooseImage(savephotos: (serverId: string, localData: string) => void): void {
    wx.chooseImage({
      count: 1, // 默认9
      sizeType: ['original'], // 可以指定是原图还是压缩图，默认二者都有
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
      success: (res) => {
        const localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
        this.uploadImage(localIds[0], savephotos);
      }
    });
  }

  /** 获取本地图片接口 */
  public getLocalImgData(localId: string, showphotos: (localId: string) => void): void {
    wx.getLocalImgData({
      localId, // 图片的localID
      success(res: { localData: string }): void {
        // localData是图片的base64数据，可以用img标签显示
        showphotos(res.localData);
      }
    });
  }

  /** 获取网络状态 */
  public getNetworkType(): void {
    wx.getNetworkType({
      success: (res) => {
        // 返回网络类型2g，3g，4g，wifi
        Framework.global.network = res.networkType;
        Exception.network = res.networkType;
      }
    });
  }

  /** 隐藏菜单 */
  public hideMenuItems(): void {
    if (process.env.NODE_ENV === 'production') {
      wx.hideMenuItems({
        menuList: [
          'menuItem:share:appMessage',
          'menuItem:share:timeline',
          'menuItem:share:qq',
          'menuItem:share:weiboApp',
          'menuItem:favorite',
          'menuItem:share:facebook',
          'menuItem:share:QZone',
          'menuItem:editTag',
          'menuItem:delete',
          'menuItem:copyUrl',
          'menuItem:originPage',
          'menuItem:readMode',
          'menuItem:share:email',
          'menuItem:share:brand'
        ]
      });
    }
  }

  /** 微信分享事件监听 */
  public onWxShare(params: WxOnShareParams): void {
    if (!Framework.wx.shareCurrentUrl) {
      console.error('wx.shareCurrentUrl不能为空');
      return;
    }
    if (process.env.NODE_ENV === 'production') {
      wx.ready(() => {
        const url = encodeURIComponent(this.shareCurrentUrl);
        const appId = Framework.config.appId;
        // tslint:disable-next-line:max-line-length
        const link = `http://open.weixin.qq.com/connect/oauth2/authorize?appid=${appId}&redirect_uri=${url}&response_type=code&scope=snsapi_userinfo&state=#wechat_redirect`;
        const apiList = [
          'onMenuShareTimeline',
          'onMenuShareAppMessage',
          'onMenuShareQQ',
          'onMenuShareWeibo',
          'onMenuShareQZone'
        ];
        for (let i = 0; i < apiList.length; i++) {
          this.share(apiList[i], link, params);
        }
      });
    }
  }

  /** 微信分享方法注册 */
  private share(api: string, link: string, params: WxOnShareParams): void {
    const { title, desc, imgUrl } = params;
    wx[api]({
      title: title || '悦家云',
      desc: desc || '让房子的事更简单',
      link,
      imgUrl:  imgUrl || 'https://wap.yj.cn.com/assert/img/logo.jpg',
      success: () => {
        if (params.success) {
          params.success();
        }
      }
    });
  }

  /** 预览图片 */
  public previewImage(srcArray: string[], current: number): void {
    if (process.env.NODE_ENV === 'production') {
      wx.ready(() => {
        const urls = srcArray.map((value) => {
          if (value.indexOf('http') >= 0) {
            return value.replace('s_', 'l_');
          }
          return Framework.config.imgHost + value.replace('s_', 'l_');
        });
        wx.previewImage({
          current: urls[current], // 当前显示图片的http链接
          urls  // 需要预览的图片http链接列表
        });
      });
    }
  }

  /** 上传图片 */
  public uploadImage(localId: string, savephotos: (serverId: string, localData: string) => void): void {
    Toast.loading('上传中');
    wx.uploadImage({
      localId, // 需要上传的图片的本地ID，由chooseImage接口获得
      isShowProgressTips: 0, // 默认为1，显示进度提示
      success: (res) => {
        Toast.hide();
        if (window['__wxjs_is_wkwebview']) {
          // 返回图片的服务器端ID
          this.getLocalImgData(localId, (localData) => savephotos(res.serverId, localData));
        } else {
          savephotos(res.serverId, localId);
        }
      },
      error: (e) => {
        Toast.hide();
      }
    });
  }

  /** 微信配置 */
  public wxConfig(): void {
    const timestamp = new Date().getTime();
    const nonceStr = 'ak0os7h1dojn51ojvs5r8lfwsq3debsu';
    const url = window.location.href.split('#')[0];
    const data = `jsapi_ticket=${Framework.config.ticket}&noncestr=${nonceStr}&timestamp=${timestamp}&url=${url}`;
    const signature = hex_sha1(data);
    wx.config({
      debug: Framework.config.wxDebug,
      appId: Framework.config.appId,
      timestamp,
      nonceStr,
      signature,
      jsApiList: window['wxJsApiList']
    });
  }
}

export default WeiXin;