开发环境 uniapp,生成 h5,使用企业微信组件 WWOpenData)

原因与问题

• 失败原因是uni定义了wx的个字段，组件调用时的wx被污染了
• ww-open-data 组件使用的时候回自己去调用wx.agentConfig，所以把 wx.agentConfig替换成 jWeixin.agentConfig是不能解决实际问题的。
• WWOpenData.bind(this.$el)要在wx.agentConfig成功回调后使用。

解决方法

1. 在app.vue的onLaunch钩子里让uni定义的window.wx = null，为了保险起见再手动添加一下js

clearWX(){
		console.log(window.wx,"now-window.wx")
		window.wx = null
		const script1 = document.createElement('script')
		script1.referrerpolicy="origin"
		script1.src= 'https://res.wx.qq.com/open/js/jweixin-1.2.0.js'
		document.head.appendChild(script1)；
		script1.onload = function() {
			const script2 = document.createElement('script')
			script2.referrerpolicy="origin"
			script2.src= 'https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js'
			document.head.appendChild(script2)
			  script2.onload = function() {  
					 // TODO something  
					 console.log(window.wx,"appVue-window.wx")
			}  
		}
	}

2. 在我们封装的wwOpenData组件中使用wx.agentConfig()前window.wx = window.jWeixin。让他重新赋值。这样wwOpenData自动调用的时候会指向正确的wx

agentConfig(config) {
	var url = window.location.href.substring(0, window.location.href.indexOf('#'));
	console.log(window.jWeixin, "window.jWeixin")
	console.log(window.wx, "window.wx")
	window.wx = window.jWeixin
	var wx = window.wx ? window.wx : window.jWeixin;
	console.log(wx, "wx")
	this.$http.request("你获取参数的接口").then(res => {
		debugger
		var data = res.data;
		console.log(data, "接口调用的数据")
		wx.agentConfig({
			corpid: data.appId, // 必填，企业微信的corpid，必须与当前登录的企业一致
			agentid: data.agentid, // 必填，企业微信的应用id （e.g. 1000247）
			timestamp: data.timestamp, // 必填，生成签名的时间戳
			nonceStr: data.nonceStr, // 必填，生成签名的随机串
			signature: data.signature, // 必填，签名，见附录-JS-SDK使用权限签名算法
			jsApiList: ['selectExternalContact'], //必填，传入需要使用的接口名称
			success: function(res1) {
				// 回调
				console.log(res1, "agentConfig成功的回调")
				WWOpenData.bind(this.$el)
			},
			fail: function(res1) {
				console.log(JSON.stringify(res1), "agentConfig失败的回调")
				alert(window.location.href)
				alert(JSON.stringify(res1))
				// if (res.errMsg.indexOf('function not exist') > -1) {
				//   alert('版本过低请升级')
				// }
			}
		});
	});
},

结束语

就很无语uni打成h5的时候居然直接使用wx这个字段了，使用要先清除原来的再用window.jWeixin去覆盖window.wx，把他变回正常的状态