crm系统对接企业微信, 完成话术库功能,分享消息到当前会话

一. 先看成果

二. 踩坑点记录

1. 权限: 分享消息到当前会话需要调用sendChatMessage方法, 这个方法需要 .agentConfig权限,这个权限需要获取应用的jsapi_ticket (千万别弄混了, .config权限和企业的jsapi_ticket)
2. 兼容: uniapp内置的有一个wx对象，导致了JS-SDK中的wx对象不能使用，但是会有一个jWeixin对象，只能用于安卓端、PC端、Mac端，IOS端中不能使用。

三. 上代码

index.html 中引入两个官方的js文件

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="referrer" content="no-referrer" />
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0 viewport-fit=cover">
		<title>话术库</title>
	</head>
	<body>
		<div id="app"></div>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script>
	</body>
</html>

调用后端接口获取 .angetConfig配置必须参数; 由于IOS端是延迟注入的，如需使用agentConfig接口的话，会出现agentConfig接口调用不起来, 延时0.5s的方法解决踩坑 2.兼容:

data() {
    return {
       systemType: uni.getSystemInfoSync().platform, // 系统类型
       entryType: '' // h5应用的入口类型
    }
},
onLoad: function() {
    this.getParamsApply();
},
methods: {
    // 获取 企业应用 配置参数
    getParamsApply() {
        this.$http.getParamsApply({
                url: window.location.href.split("#")[0]
        }).then(res => {
                this.agentConfig(res.data);
        })
    },
    // 企业应用 配置
    agentConfig(agentData) {
        let that = this;
        setTimeout(() => {
            let wechat = this.systemType == 'ios' ? wx : jWeixin;
            wechat.agentConfig({
                corpid: agentData.corpid, // 必填，企业微信的corpid，
                agentid: agentData.agentid, // 必填，企业微信的应用id
                timestamp: agentData.timestamp, // 必填，生成签名的时间戳
                nonceStr: agentData.noncestr, // 必填，生成签名的随机串
                signature: agentData.signature, // 必填，签名
                jsApiList: ['getContext', 'sendChatMessage'], //必填，传入需要使用的接口
                success: function(agentRes) {
                    wechat.invoke('getContext', {}, function(entry) {
                        that.entryType = entry.entry;
                    });
                }
            });
        }, 500)
    },
    // 点击页面按钮发送消息(PC支持批量发送, 移动端只能单个发送)
    wechat_send(type, content, mediaId) {
        let wechat = this.systemType == 'ios' ? wx : jWeixin;
        if (type == 'text') {
            wechat.invoke('sendChatMessage', {
                msgtype: "text", //消息类型，必填 文本
                text: { content: content },
            }, function(res) {
                console.log('文本', res.err_msg);
            });
        } else if (type == 'image') {
            wechat.invoke('sendChatMessage', {
                msgtype: "image", //消息类型，必填 图片
                image: { mediaid: mediaId },
            }, function(res) {
                console.log('图片', res);
            })
        } else if (type == 'video') {
            wechat.invoke('sendChatMessage', {
                msgtype: "video", //消息类型，必填 视频
                video: { mediaid: mediaId },
            }, function(res) {
                console.log('视频', res);
            })
        } else if (type == 'file') {
            wechat.invoke('sendChatMessage', {
                msgtype: "file", //消息类型，必填 文件
                file: { mediaid: mediaId },
            }, function(res) {
                console.log('文件', res);
            })
        }
    }
 }

四. 回忆心酸

在企业微信的开放社区问了很多很多人,都杳无音讯石沉大海.最后还是一点点尝试,解决了.

结束语: 功能实现看起来简单, 中间踩坑很多, 比如签名失败, 失败的原因很多; 比如发送图片所需要的mediaid,原来它是另一个服务端接口需要调用返回的, 最坑的还是ios和安卓兼容问题.等等问题. 记录一下, 分享给