企业微信自建web应用

不去明知山
2,190 阅读5分钟

什么是企业微信？

企业微信，是腾讯微信团队为企业打造的高效办公平台。面向各类组织，相对微信弱化社交方面的功能，提高了商务、办公等方面的相关功能。

什么是自建应用？

为满足企业个性化开发需求，可以根据公司需求搭建自己的应用，同时企业微信OA数据接口、企业支付、电子发票等API，为企业接入更多个性化的办公应用，也可便捷关联已有应用。 如何创建应用：传送门

接入JS-SDK

1.引入JS文件

在HTML文件中直接引入即可。

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

2.设置可信域名白名单

进入企业微信工具后台-应用管理-开发者接口-点击设置可信域名，下载***.txt文件，交予运维人员上传至对应域名根目录下。

3.注入配置验证权限

所有需要使用JS-SDK的页面必须先注入配置信息，否则将无法调用。对于变化url的webApp需在每次url变化时进行调用。

wx.config({
    beta: true,// 必须这么写，否则wx.invoke调用形式的jsapi会有问题
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
    appId: '', // 必填，企业微信的corpID
    timestamp: , // 必填，生成签名的时间戳
    nonceStr: '', // 必填，生成签名的随机串
    signature: '',// 必填，签名，见 附录-JS-SDK使用权限签名算法
    jsApiList: [] // 必填，需要使用的JS接口列表，凡是要调用的接口都需要传进来
});

建议corpID、签名等相关参数由服务端接口返回。

生成签名算法：传送门

4.处理接口验证

wx.ready(function(){
    // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
});

wx.error(function(res){
    // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
});

信息验证通过后，即可调用所有接口。

全部JS接口列表：传送门

网页授权登录

企业微信提供了OAuth的授权登录方式，可以让从企业微信终端打开的网页获取成员的身份信息，从而免去登录的环节。

OAuth2的设计背景，在于允许用户在不告知第三方自己的帐号密码情况下，通过授权方式，让第三方服务可以获取自己的资源信息。

REDIRECT_URL中的域名，需要先配置至应用的“可信域名”，否则跳转时会提示“redirect_uri参数错误”。

调用流程为：

  • A) 用户访问第三方服务，第三方服务通过构造OAuth2链接（参数包括当前第三方服务的身份ID，以及重定向URI），将用户引导到认证服务器的授权页
  • B) 用户选择是否同意授权
  • C) 若用户同意授权，则认证服务器将用户重定向到第一步指定的重定向URI，同时附上一个授权码。
  • D) 第三方服务收到授权码，带上授权码来源的重定向URI，向认证服务器申请凭证。
  • E) 认证服务器检查授权码和重定向URI的有效性，通过后颁发AccessToken（调用凭证）。

D)与E)的调用为后台调用，不通过浏览器进行

获取access_token

请求链接：

https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=企业ID&corpsecret=应用的凭证密钥

返回结果：

{
   "errcode": 0,
   "errmsg": "ok",
   "access_token": "accesstoken000001",
   "expires_in": 7200
}

构造网页授权链接

请求链接：

https://open.weixin.qq.com/connect/oauth2/authorize?appid=企业ID&redirect_uri=回调链接&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect

参数说明：

  • appid 企业的CorpID
  • redirect_uri 授权后重定向的回调链接地址，需对链接进行urlencode处理
  • response_type 返回类型(固定值code)
  • scope 应用授权作用域(固定值snsapi_base)
  • state(选填) 重定向后会带上state参数(a-zA-Z0-9长度不可超过128个字节)
  • #wechat_redirect 终端使用此参数判断是否需要带上身份信息

示例：

假定当前
企业CorpID：wxCorpId
访问链接：http://api.3dept.com/cgi-bin/query?action=get
根据URL规范，将上述参数分别进行UrlEncode，得到拼接的OAuth2链接为：
https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxCorpId&redirect_uri=http%3a%2f%2fapi.3dept.com%2fcgi-bin%2fquery%3faction%3dget&response_type=code&scope=snsapi_base&state=#wechat_redirect
员工点击后，页面将跳转至 
http://api.3dept.com/cgi-bin/query?action=get&code=AAAAAAgG333qs9EdaPbCAP1VaOrjuNkiAZHTWgaWsZQ&state=

企业可根据code参数调用获得员工的userid；code只能使用一次，5分钟未被使用自动过期。

设置授权回调域白名单

进入企业微信工具后台-应用管理-开发者接口-设置企业微信授权登录，设置授权回调域即可。

获取访问用户UserId

请求链接：

https://qyapi.weixin.qq.com/cgi-bin/user/getuserinfo?access_token=ACCESS_TOKEN&code=CODE

返回结果：

{
   "errcode": 0,
   "errmsg": "ok",
   "UserId":"USERID",
   "DeviceId":"DEVICEID"
}

拿到用户的UserId后剩下的事情就好办了，不再赘述。

官网文档：传送门

avatar
文章
阅读
粉丝