【移动端】企业微信weixin-js-sdk使用总结

安装weixin-js-sdk

npm install weixin-js-sdk

创建wechat.js用于封装签名处理等

import wx from 'weixin-js-sdk' // 引入微信js-sdk
import { getJsJdkSignature } from "../api/index"; // 引入获取签名api接口
import http from './http' // 请求封装的方法
class AuthWechat {

    // 获取当前网页的URL， 不包含#及其后面部分
    signLink() {
        if (typeof window.entryUrl === 'undefined' || window.entryUrl === '') {
            window.entryUrl = document.location.href.split('#')[0]
        }
        return /(Android)/i.test(navigator.userAgent) ? document.location.href.split('#')[0] : window.entryUrl;
    }
    // 当前是否是微信环境
    isWeixin() {
        return navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1;
    }
    /**
     * 初始化wechat(配置)
     */
    wechat() {
        return new Promise((resolve, reject) => {
            let url = this.signLink()
            // 请求后端获取签名等信息
            http.post(getJsJdkSignature, {
                params: {
                    url
                }
            }).then(res => {
                if (res.msgCode == 200) {
                    wx.config({
                        beta: true,
                        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                        appId: res.data.appId, // 必填，企业微信的corpID
                        timestamp: res.data.timestamp,  // 必填，生成签名的时间戳
                        nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
                        signature: res.data.signature, // 必填，签名
                        jsApiList: [ // 必填，需要使用的JS接口列表，凡是要调用的接口都需要传进来
                            'selectEnterpriseContact'
                        ]
                    })
                    wx.ready(res => {
                        // 微信SDK准备就绪后执行的回调。
                        resolve(wx, res)
                    })
                    wx.error(err => {
                        reject(wx, err)
                    })
                }
            })
        })
    }
    // 微信选人接口
    wxSelectEnterpriseContact(selectObj = { selectedUserIds: [] }) {
        return new Promise((resolve, reject) => {
            this.wechat().then((wx, res) => {
                wx.ready(() => {
                    this.toPromise(wx.invoke, 'selectEnterpriseContact',
                        {
                            "fromDepartmentId": -1,// 必填，表示打开的通讯录从指定的部门开始展示，-1表示自己所在部门开始, 0表示从最上层开始
                            "mode": "multi",// 必填，选择模式，single表示单选，multi表示多选
                            "type": ["user"],// 必填，选择限制类型，指定department、user中的一个或者多个
                            "selectedUserIds": selectObj.selectedUserIds// 非必填，已选用户ID列表。用于多次选人时可重入，single模式下请勿填入多个id
                        }).then(res => {
                            resolve(res);
                        }).catch(err => {
                            reject(err);
                        });
                })
            })
        })
    }

    toPromise(fn, jsApiName, config = {}) {
        return new Promise((resolve, reject) => {
            fn(jsApiName, {
                ...config,
            }, (res) => { // 回调
                if (res.err_msg === `${jsApiName}:ok`) { // 成功处理
                    if (typeof res.result == 'string') {
                        res.result = JSON.parse(res.result) //由于目前各个终端尚未完全兼容，需要开发者额外判断result类型以保证在各个终端的兼容性
                    }
                    resolve(res.result);
                } else { // 错误处理
                    reject('error');
                }
            });
        });
    }
}
export default new AuthWechat();

main.js引用

import wechat from './utils/wechat.js'

Vue.prototype.$wechat = wechat

使用，目前只封装企业微信选人，其他可通过以下地址查看

https://developer.work.weixin.qq.com/document/path/90513

// 调用
this.$wechat.wxSelectEnterpriseContact().then(res=>{
    console.log(res.userList);
})