• uni-app 企业微信开发导入jweixin-1.2.0.js文件


    官方API:https://developer.work.weixin.qq.com/document/path/90514
    在这里插入图片描述

    1.导入官方提供的js

    <script src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    
    • 1

    在实际使用时,wx.congif报错:wx.config is not a function
    在这里插入图片描述
    错误原因:
    uni-app已经注册了一个全局的wx,所有此处的会被覆盖掉。
    尝试了网上的一些方法,仍旧是无法解决问题,采用以下方式完美解决了这个问题。

    解决办法:

    1.打开cmd

    2.进入项目的根目录,输入命令:npm init -y

    此时根目录会生成一个package.js文件
    在这里插入图片描述

    3.安装weixin-js-sdk

    npm install weixin-js-sdk
    在这里插入图片描述

    5.引入

    import JWeixin from “weixin-js-sdk”;

    此时就可以正常的使用了:
    JWeixin.config({

    });

    2.通过config接口注入权限验证配置

    步骤按照API中的进行即可:
    在这里插入图片描述

    let timestamp = new Date().getTime(); //时间戳
    let noncestr = base.randomString(16); //生成签名的随机串
    
    //base.js:
    const randomString =function (len){
        let _charStr = 'abacdefghjklmnopqrstuvwxyzABCDEFGHJKLMNOPQRSTUVWXYZ0123456789',
            min = 0, 
            max = _charStr.length-1, 
            _str = '';                    //定义随机字符串 变量
        //判断是否指定长度,否则默认长度为15
        len = len || 15;
        //循环生成字符串
        for(var i = 0, index; i < len; i++){
            index = (function(randomIndexFunc, i){         
                        return randomIndexFunc(min, max, i, randomIndexFunc);
                    })(function(min, max, i, _self){
                        let indexTemp = Math.floor(Math.random()*(max-min+1)+min),
                            numStart = _charStr.length - 10;
                        if(i==0&&indexTemp >=numStart){
                            indexTemp = _self(min, max, i, _self);
                        }
                        return indexTemp ;
                    }, i);
            _str += _charStr[index];
        }
        return _str;
    }
    
    // 获取signature签名
    base.get({
    			url: "WeChat/getJsSDKSignature",
    			data: {
    				timestamp: timestamp,
    				noncestr: noncestr,
    				url: window.location.href // 注意传入的url一定要是客户端当前页面的完整路径,包含路径中带的参数,例如:http://XXX.com?type=1
    			},
    			success: function(res) {
    				if (res.data.data) {
    					jweixin.config({
    						beta: true, // 必须这么写,否则wx.invoke调用形式的jsapi会有问题
    						debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
    						appId: base.appid, // 必填,企业微信的corpID
    						timestamp: timestamp, // 必填,生成签名的时间戳
    						nonceStr: noncestr, // 必填,生成签名的随机串
    						signature: res.data.data.signature, // 必填,签名,见附录1
    						jsApiList: [
    							'selectEnterpriseContact' 
    						] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
    					});
    					jweixin.ready(function(){
    					    // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
    					});
    					jweixin.error(function(res){
    					    // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
    						console.log('error:',res);
    						alert('jweixin.error='+res);
    					});
    				}
    
    			},
    			fail: function(res) {
    				console.log('error:', res);
    			}
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
  • 相关阅读:
    RabbitMQ的 AMQP协议都是些什么内容呢
    CSDN博客专家和万粉博主纪念章
    在Go中如何实现并发
    题解:《算法竞赛进阶指南》, NOIP2009提高组
    vue实战-产品详情页(轮播图、放大镜)
    libusb系列-001-libusb简介
    mysql笔记
    【Linux开发】如何在Ubuntu系统创建新用户,并且用MobaXterm连接linux服务器,创建session?
    代码随想录算法训练营第五十三天| LeetCode1143. 最长公共子序列、LeetCode1035. 不相交的线、LeetCode53. 最大子数组和
    RecyclerView源码解析(四):RecyclerView对ViewHolder的回收
  • 原文地址:https://blog.csdn.net/qq_28332767/article/details/125487483