uni-app开发企微H5——推消息给客户(安装包版)

上一篇的企微推送消息测试了之后,发现苹果手机不行,然后又要开始重新看文档,搜解决方案。这个时候看到同事的一个企微客服的测试小项目,不看不知道,一看吓一跳。这不就是我苦苦寻找的东西么?而且是经过试验的可用方案,奶思~

@wecom/jssdk - npm微信(企业微信)JSSDK,可用于替代 jweixin.js。. Latest version: 1.2.1, last published: 2 months ago. Start using @wecom/jssdk in your project by running `npm i @wecom/jssdk`. There are no other projects in the npm registry using @wecom/jssdk.https://www.npmjs.com/package/@wecom/jssdk1、安装

npm i @wecom/jssdk

2、使用

如果只有一个页面需要使用到,就直接写在页面里,如下:

<template>
	<view class="content">
		<image class="logo" src="/static/logo.png"></image>
		<view class="text-area">
			<text class="title">{{title}}</text>
			<view>{{ version }}</view>
			<view>{{ content }}</view>
			
		</view>
	</view>
</template>

<script>
	import * as ww from '@wecom/jssdk'
	export default {
		data() {
			return {
				title: 'Hello',
				version: "",
				content: ""
			}
		},
		onLoad() {
			this.version = ww.VERSION
			let _this = this
			
			ww.register({
				corpId: "请填入你的corpId",
				agentId: 请填入你的agentId,
				jsApiList: [
					'checkJsApi',
					'getContext',
					'selectExternalContact',
					'getCurExternalContact',
					'getCurExternalChat',
					'sendChatMessage',
					'launchMiniprogram'
				],
				async getConfigSignature(url) {
					let [error, res] = await uni.request({
						url: '调用的接口url,js_sdkInit',
						data: {
							agentid: 请填入你的agentId,
							purl: url
						},
					})
					return {
						timestamp: res.data.timestamp,
						nonceStr: res.data.nonceStr,
						signature: res.data.signature
					}
				},
				async getAgentConfigSignature(url) {
					let [error, res] = await uni.request({
						url: '调用的接口url,Agentjs_sdkInit',
						data: {
							agentid: 1000060,
							purl: url
						},
					})
					console.log("getAgentConfigSignature:res",res)
					return {
						timestamp: res.data.d.timestamp,
						nonceStr: res.data.d.nonceStr,
						signature: res.data.d.signature
					}
				},
				onConfigSuccess(res) {
					console.log("onConfigSuccess")
					console.log(res)
				},
				onConfigFail(res) {
					console.log("onConfigFail")
					console.log(res)
				},
				onAgentConfigSuccess(res) {
					console.log("onAgentConfigSuccess")
					console.log(res)
				},
				onAgentConfigFail(res) {
					console.log("onAgentConfigFail")
					console.log(res)
				}
			})
			
			//直接使用
			ww.getCurExternalContact({
				success(res) {
					_this.content = JSON.stringify(res)
				}
			})
			
		},
		methods: {
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>

(1)、如果是多处使用,就写在js里,然后在main.js里注入。

//qy_Config.js


import * as ww from '@wecom/jssdk'

ww.register({
	corpId: "自己填",
	agentId: 自己填,
	jsApiList: [
		'checkJsApi',
		'getContext',
		'selectExternalContact',
		'getCurExternalContact',
		'getCurExternalChat',
		'sendChatMessage',
		'launchMiniprogram'
	],
	async getConfigSignature(url) {
		let [error, res] = await uni.request({
			url: '自己填',
			data: {
				agentid: 自己填,
				purl: url
			},
		})
		return {
			timestamp: res.data.timestamp,
			nonceStr: res.data.nonceStr,
			signature: res.data.signature
		}
	},
	async getAgentConfigSignature(url) {
		let [error, res] = await uni.request({
			url: '自己填',
			data: {
				agentid: 自己填,
				purl: url
			},
		})
		console.log("getAgentConfigSignature:res", res)
		return {
			timestamp: res.data.d.timestamp,
			nonceStr: res.data.d.nonceStr,
			signature: res.data.d.signature
		}
	},
	onConfigSuccess(res) {
		console.log("onConfigSuccess")
		console.log(res)
	},
	onConfigFail(res) {
		console.log("onConfigFail")
		console.log(res)
	},
	onAgentConfigSuccess(res) {
		console.log("onAgentConfigSuccess")
		console.log(res)
	},
	onAgentConfigFail(res) {
		console.log("onAgentConfigFail")
		console.log(res)
	}
})



(2)、在main.js里注入

//main.js

import qy_Config from '@/common/qy_Config.js'  //引用

(3)、在页面中使用,实现推送功能。

<template>
	<view>	
		<u-button class="send-btn" iconColor="#fff" @click="pushText()" type="error" shape="circle" size='mini'>我要推送</u-button>
	</view>
</template>

<script>
	import * as ww from '@wecom/jssdk'
	
	export default {
		data() {
			return {
				content:'我要推送的文案'
			};
		},
		methods:{
			// 推送消息
			pushText(){
			
				var that = this
				var ua = window.navigator.userAgent.toLowerCase();
				console.log(ua)
				console.log(ua.match(/wxwork/i) == 'wxwork')
				if (ua.match(/wxwork/i) == 'wxwork') {
					
					ww.invoke('sendChatMessage', {
						msgtype:"text", //消息类型,必填
						enterChat: true, //为true时表示发送完成之后顺便进入会话,仅移动端3.1.10及以上版本支持该字段
						text: {
							content: that.content, //文本内容
						}
					}, function(res) {
						
						if(res.res.err_msg == "sendChatMessage:fail_nosupport"){
							uni.showModal({
								title: "无法推送",
								content: "当前入口无法推送,请在对话栏打开此页面操作!"
							})
						}
						if (res.err_msg == 'sendChatMessage:ok') {
							//发送成功
						}
					})
				} else {
					uni.showToast({
						title: "请在企业微信端操作",
						icon: "none"
					})
					return
				}
				
			}
			
			
		}
	}
</script>

uni-app开发企微H5——推送消息给客户_Strawberry96的博客-CSDN博客在企微推送个消息给客户怎么就这么难那???别以为有了开发文档你就可以勇往直前了!前面的路还需要你披荆斩棘那~https://blog.csdn.net/zhangying1996/article/details/123053312

  • 3
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值