最近一直忙着开发项目,终于1.0版本开发完成,抽时间自己总结下在项目开发中遇到的技术点。此次项目属于自研产品,公司扩展业务,需要在企业微信中开发内部应用。因为工作中使用的是钉钉,很少使用企业微信,对于企业微信中的一些功能啥的也不了解。于是乎在网上各种搜索资料查看文档。废话就不多说了,先缕下思路。
第一步肯定是先拥有企业微信管理员的权限,登录PC端企业微信,登录后点击头像会出现“管理企业”如下图所示:
点击后会在浏览器打开企业微信后台首页,点击企业应用如下图所示:
通过上图能看到应用分为自建应用和第三方,因为项目是自建应用对于第三方应用就没有过多的去了解。
点击创建应用:
按需填写信息点击创建就行,创建完成后可以看到
上图标注的是在项目中需要配置的,大家可以尝试看下。配置完成后就可以根据需求开发了。因为项目是创建应用后授权登录后端返token,前端进行本地存储,然后才调用内部接口,这里并没有使用企业微信的js-sdk。
废话不多说了,代码如下:
<template><view class=" main"><view class="loader"></view></view>
</template><script>import {getToken} from "@/utils/auth";export default {data() {return {}},onLoad() {this.getwecom();},onShow() {this.imToken = localStorage.getItem('token')},methods: {getwecom() {// 企业的 corp_idconst corp_id = 'xxxx';//在企业微信后台 我的企业 ———— 企业信息页面中底部就能看到// 重定向地址const redirect_uri = encodeURI('http://baidu.com/test/#/');//企业的agentIdconst agentId = xxxx;//获取当前路径的codelet code = this.getUrlCode();//是否存在codeif (code === undefined || code == null || code === "") {//获取codewindow.location.href =`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${corp_id}&redirect_uri=${encodeURIComponent(redirect_uri)}&response_type=code&scope=snsapi_privateinfo&state=STATE&agentid=${agentId}#wechat_redirect`}uni.request({url: `https://xxx.net/auth/corpWx/oauthUser?code=${code}&agentId=xxxxxx`,header: {'Content-Type': 'application/x-www-form-urlencoded'},method: 'GET',success: (res) => {if (res.data.status === 500) {//无权限localStorage.removeItem('token');uni.redirectTo({url:'/pages/500'})}else if (res.data.status === 402) {//拒绝授权uni.redirectTo({url:'/pages/402'})localStorage.removeItem('token');} else if(res.data.status === 200){localStorage.setItem("token", res.data.data)uni.redirectTo({url:'/pages/index'})}},})},getUrlCode() {// 截取url中的code方法let url = new URL(window.location.href)return new URLSearchParams(url.search).get("code");},}}
</script><style lang="scss" scoped>.main{height: 100vh;width: 100%;display: flex;align-content: center;justify-content: center;align-items: center;}.loader {width: 45px;height: 45px;--c:no-repeat linear-gradient(#43a2ed 0 0);background: var(--c),var(--c),var(--c),var(--c);background-size: 21px 21px;animation: l5 1.5s infinite cubic-bezier(0.3,1,0,1);}@keyframes l5 {0% {background-position: 0 0,100% 0 ,100% 100%,0 100%}33% {background-position: 0 0,100% 0 ,100% 100%,0 100%;width:60px;height: 60px}66% {background-position: 100% 0,100% 100%,0 100%,0 0 ;width:60px;height: 60px}100% {background-position: 100% 0,100% 100%,0 100%,0 0 }}
</style>
以上便是创建企业微信内部应用的简单操作,其他功能后续再补。。。