企业微信自建应用开发初探

最新推荐文章于 2024-08-21 15:31:05 发布

weixin_34088583

最新推荐文章于 2024-08-21 15:31:05 发布

阅读量1w

点赞数 3

文章标签：开发工具前端 java ViewUI

本文链接：https://blog.csdn.net/weixin_34088583/article/details/89167315

版权

企业微信是腾讯推出的一个新的办公协作平台，通过与微信一致的沟通体验，为企业员工提供最基础和最实用的办公服务。同时企业微信作为一个开发平台，企业可以根据需要开发定制自己的企业应用集成到企业微信上。ABC WeChat是我们公司为ABC开发的基于企业微信的一款应用（因保密需要，这里用ABC代替公司名称）。

本文以该项目为例对在企业微信平台开发企业应用的特点进行了总结，重点分析了企业微信开发平台对应用开发提供的支持，并指出了实际开发中存在的一些挑战。

1.ABC WeChat项目介绍

从2018年5月份讨论需求开始，ABC WeChat项目主体开发共分两个阶段，总历时约六个月。这个应用主要是为一个现有劳动力管理产品提供了一个基于微信的客户端，使得用户可以通过企业微信，使用该产品的部分功能，如打卡，查看排版信息等，满足用户的移动办公需求。主要实现的功能有：

实现现有产品的登录入口，并且提供一定时间内的免登录
根据位置不同展示不同的打卡二维码
扫描二维码实现自动打卡
展示用户的排班信息
提供打卡提醒及异常提醒
工时和异常信息的统计
请假及审批

2.企业微信开发应用集成方式

企业微信提供多种应用集成方式。其中，按提供方来分有三种：

基础应用：由微信提供；
第三方应用：开放体系下的第三方服务商提供；
自建应用：我们自己新建的，一般我们也都是需要自建应用进行开发。

按交互方式来分有两种：

主页型应用：用户点击应用后直接打开一个链接；
消息型应用：可以像公众号一样设置多个菜单，每个菜单可以配置不同的响应方式。

ABC WeChat项目属于自建应用中的主页型应用。这种应用是完全由企业自主开发定制，相对于基础应用和第三方应用更加灵活，功能上也更加符合企业自身需求。而相对于用有限几个菜单来提供响应的消息型应用来说，主页型应用的功能更加强大。

本文主要讨论自建的主页型应用。其基本结构如下图所示。

$\"\"$

3.企业微信平台对应用开发的支持

作为开发平台来说，企业微信对其上自建的企业应用提供了简单灵活的集成方式，并通过API提供了对手机硬件和微信本身功能的调用，可以帮助企业比较快速地构建出一个企业微信应用供企业用户使用。

简单的集成方式

对于自建的主页型应用，企业微信提供的集成方式是极其简单的，只需要企业管理员在管理端配置一个要访问应用的主页地址即可。当用户点击对应图标访问该应用时，企业微信就会打开内嵌浏览器并访问配置的主页地址。从而实现用户通过企业微信访问企业应用的目的。当然，企业现有应用的web页面未必适合直接放到企业微信中使用。一般都需要针对性的开发一套针对企业微信的web页面。

网页开发，跨平台

自建主页型应用是指向一个链接地址，后台企业应用服务器对该链接进行响应并下发网页代码。企业微信打开内嵌浏览器来解析网页代码并展示给用户。这个过程和普通网站类似，只是不需要用户打开浏览器而是企业微信打开并维护一个内嵌浏览器。因此对这种应用来说，其和普通web应用基本类似，也是基于网页开发的，原则上可以跨平台，只要有浏览器就可以运行。相比于Native的应用来说，提供了更多的灵活性。

通过一套标准API，提供对手机硬件的调用

由于浏览器本身限制，网页上运行的代码难以调用手机本身的一些功能，如扫描，拍照，获取地理位置等。因此企业微信提供了一套JS-SDK, 第三方可以通过JS调用该SDK实现对手机部分功能的调用。这种方式本身也屏蔽了不同手机不同操作系统本身的差异性和复杂性，使得开发过程更为简单。但同时也受限于企业微信SDK暴露出来的API，对于其没有暴露的功能，实现起来就会非常困难。

提供消息推送接口

企业微信开放了消息发送接口，企业可以使用这些接口让自建应用与企业微信后台或用户间进行双向通信。消息接口总体上分为主动发送单聊消息、接收单聊消息以及发送消息到群三部分。利用这些接口，自建应用可以充分利用微信强大的沟通能力实现各种各样的通知和提醒功能，使得信息传递的更灵活，更及时。ABC WeChat项目使用了“主动发送应用消息”接口实现了将打卡提醒和异常通知发送到指定用户的企业微信上。同时，自建应用为应用消息指定一个URL，使得用户可以通过点击消息进入到应用对应页面上，十分灵活方便。

提供标准页面样式库

在企业微信内部的企业应用的样式最好和企业微信保持统一，这样视觉上不会让用户觉得突兀。WeUI for Work是一套由微信官方设计的同企业微信原生视觉体验一致的基础样式库。利用该样式库，自建应用可以比较容易地构建出适合企业微信风格的应用。ABC WeChat也使用了该样式库。

4.开发自建应用时遇到的挑战和解决办法

虽然企业微信已经为应用提供了基本的开发支持，但是还有很多需要完善加强的地方。因为这些不足之处，ABC WeChat项目遇到了很多技术困难。下面详细的列出这些问题和相应的解决办法。

本地存储

对于网页应用，通常客户端使用的本地存储方式有localStorage, cookie, WebSQL。但是对于在企业微信中的应用来说，localStorage和WebSQL都无法实现长期存储（微信中web view和浏览器的行为差异），只有cookie才能满足长期存储的要求。甚至在ABC WeChat项目初期，企业微信也是不支持长期存储的cookie的，在项目中期时企业微信的一次版本更新中才加入了长期cookie的支持（没有在官方文档中找到关于对长期cookie支持的说明）。

在ABC WeChat项目中，自动登录以避免每次都让用户输入用户名和密码的功能就是使用了长期存储的cookie。在项目中发现，IPhone平台上，企业微信对cookie的写入有明显的延迟。根据项目经验，需要等待四五秒钟，企业微信才能把cookie写入。而在Android手机上则没有这个问题，cookie写入近似是实时的。这种iPhone上的延迟在一般的用户应用场景中不会带来问题。但在自动化测试时需要考虑到这种限制，避免登进后立即登出的用例测试。

JSAPI提供的功能不够丰富

企业微信目前提供一些基础API供应用使用，但是并不是很完善。ABC WeChat项目中就遇到了一些因为API支持不足产生的问题。

1)无法获取企业微信当前使用语言

ABC WeChat项目中有个需求是需要保证应用页面和企业微信使用同一种语言。但是遗憾的是，企业微信并没有提供API可以获取到用户当前使用的语言。我们最后是通过调用浏览器的API获取语言设置，但是结果在IPhone和Android的某些机型上表现并不一致，因此需要额外的工作来优化。

2)没有对电子围栏的支持

地理围栏(Geo-fencing)是LBS的一种新应用，就是用一个虚拟的栅栏围出一个虚拟地理边界。当手机进入离开某个特定地理区域或在该区域内活动时，手机可以接收自动通知和警告。原有项目需求中有一项就是要利用电子围栏实现用户打卡提醒等功能。但是遗憾的是企业微信SDK并没有提供相应的支持，因此该需求没有完整实现。

3)无法充分定制右上角菜单

企业微信提供了API可以对右上角菜单进行定制，但是只能隐藏部分菜单，无法彻底隐藏菜单入口，也不支持加入新的菜单。因此项目只能在自己的页面中加入自定义的菜单。

企业微信API目前还在持续更新中，希望其能提供更多更强大的功能供企业应用使用。

应用安全隔离机制

企业微信没有为应用之间提供隔离机制。当用户在企业微信内和企业应用进行交互的时候，企业应用后台API是不知道当前请求是从哪个应用客户端产生的。而对于不同的应用，企业微信都是打开webview进行服务，所以应用就有机会使用其他应用的cookie。如下图所示，应用B有可能利用应用A的cookie来访问Server A.其可能的过程如下：

1)用户访问企业应用A并通过认证，在企业微信webview中会生成对应的cookie A，其中包含有用户的认证标识；

2)用户访问企业应用B，假设企业应用B是恶意程序并知道Server A的相关URL，则企业应用B有机会重定向前端去访问server A；

3)根据浏览器机制，该访问会自动带上cookie A。由于cookie A中存有用户的合法认证信息，server A会认为这是一个合法访问从而执行对应的操作。而实际上该操作是用户并不知情的一个恶意操作。

$\"\"$

如果企业微信提供标识或者机制使得企业应用后台能够验证当前请求是否来自于正确的应用客户端，将会使应用之间隔离性更好，更加安全。否则应用就需要添加格外的机制去做相应的防范，如添加CSRF token。ABC WeChat也是通过在后台server验证CSRF token实现了对上述跨站攻击的防御。

没有提供集成开发工具

由于应用前端代码是运行在企业微信内嵌的webview里，开发人员无法容易的通过添加断点进行调试，所以经常使用alert或者抓包的方式进行问题的定位和分析，效率十分低下。官方文档上虽然有提供一些接口调试工具，但大多是针对企业微信某种类型接口的调试，没有提供集成开发工具，无法方便的对网页进行开发调试。

项目后期发现可以使用微信公众平台推出的微信Web开发者工具来调试企业微信页面。该工具集成了Chrome DevTools, 使得开发人员可以像调试浏览器应用一样调试微信网页，能有效提高开发效率。不过项目团队在试用后发现有断点和源码位置不匹配及偶尔卡死的问题。该工具目前还在持续更新中。

不支持单点登录到企业微信

企业微信官方文档上宣称的单点登录，都是使用企业微信账号登录第三方网站。企业微信通过提供OAuth接口使得企业应用可以通过该接口的授权实现当前应用的免登录，进而实现了企业应用的单点登录功能。但是企业微信并不支持通过输入员工的企业账号直接登入企业微信。用户必须首先使用企业微信账号登录企业微信，然后才能访问集成到企业微信工作台上的应用。也就是说企业微信本身不支持单点登录。同时企业微信也不支持利用第三方账号注册，用户必须利用个人微信或者手机号完成注册并加入对应的公司。

这一点对于大型公司不够友好。大型公司往往会自己构建单点登陆系统，有自己的账号管理体系，不会完全交给企业微信来维护其用户信息。对于ABC WeChat项目来说，客户就是拥有自己的单点登陆系统。因此集成了企业微信后，用户在已经登陆企业微信的基础上还需要再次输入企业账号，通过验证后才能访问企业应用。为了减少用户繁琐的登录动作，我们特意实现了免登录功能，使得在用户成功登录一次后的一定时间（可配置）内都不用再次登录。

对自动化测试支持不足

由于企业微信无法安装到X86结构的模拟器上，因此难以实现在模拟器上运行企业微信的自动化测试脚本。项目组就此问题曾咨询腾讯技术支持，得到的答复是建议使用真机进行自动化测试。而对于企业自动化测试来说，使用真机意味着需要管理很多移动设备。对于不已开发移动端应用为主业的大型企业来说，让IT部门去管理一批新的移动设备是很麻烦的事情。

对于ABC WeChat项目来说，由于绝大部分的页面和功能与企业微信环境并没有关系，基本可以脱离企业微信直接运行在浏览器中。因此项目最终决定直接在模拟器中的浏览器中运行自动化脚本来实现UI的自动化测试。

和Facebook workplace应用开发的对比

Facebook workplace是Facebook在办公协作领域推出的一款产品，其作用和企业微信类似，企业也可以基于该平台开发自己的企业应用。这里就两者对企业应用集成的支持做了简单对比和分析。可以看出Facebook workplace在与企业应用集成方面更符合企业级软件的集成需求。企业微信还需要进一步完善和成熟。

使用和交互方式的不同

Facebook workplace中用户的使用的是对话式。用户首先会打开一个聊天窗口，在该窗口中，应用中预先提供一些菜单选项，当用户点击这些选项的时候，客户端就会发送消息给相应的应用程序后端。后端执行相应操作后会返回消息给到用户的当前聊天窗口。对于用户来说，有点像和某个对象在聊天，用户问，聊天对象回答。由于是对话式的，应用提供的菜单数量有限，可能给出的交互界面一般也不会太复杂。这样才能对用户的某个操作快速给出一个响应，符合一问一答的沟通体验。

企业微信中提供两种交互方式。其中消息型应用类似Facebook workplace，也是对话式。而主页型应用则不同，它是用H5构建出来的网页，用户通过网页和应用后台进行交互。相对于对话式，网页上可以提供更加丰富的业务功能，从体验上来说，是一个网站或者一个软件。