springboot+vue项目如何集成企业微信
本文以springboot+vue技术开发的低代码平台为案例,介绍应用系统如何集成企业微信,包括同步企业微信组织用户、单点登录、消息发送等。
在线体验:http://www.yunchengxc.com
1、准备应用
1.1、注册企业微信账号
作为企业微信的企业管理员,首先登录企业微信官网,注册一个企业微信账号。
企业微信官网:https://work.weixin.qq.com/
1.2、创建企业微信应用
在企业微信管理后台,找到应用管理菜单,点击下方的“创建应用”按钮。
填写应用信息,设置可见范围为所有人,不然会影响同步用户和发送消息通知。
1.3、配置开发者接口
新建应用后进入应用详情,滑倒最下面配置【网页授权及JS-SDK】、【企业微信授权登录】、【企业可信IP】
1.3.1、【网页授权及JS-SDK】配置可信域名
配置这一步骤后才可以配置企业可信IP,填写项目的域名(仅支持域名),域名需要在公网能够访问到。填写完成后点击申请校验域名。
把下载下来的文件放到服务器上,并且可以根据可信域名访问到文件才算时校验通过。
1.3.2、【企业微信授权登录】配置
企业微信扫码登录功能需要设置回调地址。回调地址就是正式系统的访问地址,图中是本地开发的示例。使用企业微信登录,只能回调至该域名下的页面。
1.3.3、【企业可信IP】配置
项目需要远程调用企业微信的接口,这里要写我们的公网ip,不然我们的请求会被拦截。
1.4、配置通讯录同步应用
我们自建的应用只有读取用户的权限,想要进行写的操作需要通过通讯录同步应用去调用接口。点击安全与管理菜单->管理工具->通讯录同步
2、配置系统参数
2.1、找到应用凭证
打开自建应用获取自建应用的AgentId(appAgentId) 和 Secret(appSecret)
打开通讯录同步获取通讯录同步Secret(synSecret)
2.2、配置后端参数
在后端工程的yml文件中,把应用凭证对应配置到“yuncheng.workWechat”下,参数名称与应用凭证的名称对应。
2.3、配置前端参数
在前端工程的“public/config/bootConfig.js”文件内,配置参数“VUE_APP_WORKWECHAT_APP_ID”的值,对应企业微信的“corpId”;
配置参数“VUE_APP_WORKWECHAT_AGENT_ID”的值,对应企业微信的“AgentId”;配置“VUE_APP_WORKWECHAT_REDIRECT_URI”参数,登录成功重定向 url,默认当前域名,可以不用改动。
在前端工程的“src/settings.js”文件内,配置开关参数“showWorkWechat”的值为“true”,开启前端的企业微信扫码按钮、同步部门用户按钮的显示。
3、同步部门用户
3.1、同步部门
在组织管理模块,点击“同步企业微信->本地同步到企业微信”。
同步完成后,会有弹框提示同步情况,企业微信管理后台同步后的截图如下。
3.2、同步用户
在用户管理模块,点击“同步企业微信->本地同步到企业微信”。
同步完成后,会有弹框提示同步情况,企业微信管理后台同步后的截图如下。
注意:同步到企业微信的账号,如果该账号没有加入过当前企业团队,系统会自动向该账号发送加入邀请,该账号需要同意邀请后,才能加入当前企业团队。
3.3、同步注意事项
本地往企业微信同步,如果企业微信不存在,则新建;如果存在,则更新;如果企业微信有多余的部门,则删除,并把删除部门下的应用转移到跟部门下。
企业微信往本地同步,如果本地不存在,则新建,如果存在,则更新,如果本地有多余的账号,则保持不变。本地新创建的用户的默认密码是“123456”,需要自行设置用户的角色、岗位等信息。
本地和企业微信是否同一用户的账号,是通过用户表的“work_wechat_id”进行判断的。
4、企业微信扫码登录
4.1、扫码登录
点击登录页面的企业微信扫码Tab页,会显示企业微信二维码,使用手机企业微信扫码功能,完成扫码登录。
注意:必须完成上一步的用户同步,并且企业微信用户必须接受邀请加入企业团队后,才能进行扫码登录。
4.2、本地用户和企业微信的关联字段
本地和企业微信通过用户表的“sys_user.work_wechat_id”字段,和企业微信用户的账号id进行关联。
如果扫码登录后,提示用户不存在,需要检查企业微信账号所关联的“work_wechat_id”,登录失败的原因可能有以下几点:
原因1、在平台的用户管理中可能没有该userId对应的用户;