背景

公司内部由于需要很多审批地方，一开始采用邮件或者企业微信进行口头审批，一般会抄送相关人员，以达到初步审批的效果，但是随着审批越来越复杂，比如有时候需要驳回或者转接，甚至需要调用其他系统接口继续流程的时候，就很麻烦，因此迫切需要一个工作流去解决审批相关事情。

选型

在选型前，我们需要知道工作流是什么？

是什么

工作流就是通过计算机技术对业务流程进行自动化管理。实现多个参与者按照预定的流程去自动执行业务流程。

工作流定义: 通过计算机对业务流程自动化执行管理

再通俗一点，工作流就是通过程序去自动实现平时需要人工操作的流程节点，所以工作流能解决的问题一定是可以被流程化的问题。

然而这一过程被大家统称为业务流程建模，通常对已经存在复杂问题进行模型化的抽象，通过模型来推导解决问题的方案。

基础概念

BPM

BPM(Business Process Management)， 业务流程管理，是指的在工作流的基础上，基于业务流程建模，支持业务流程的分析、建模、模拟、优化、协同与监控等功能的新一代企业应用系统核心。

简单点说，BPM其实一个业务流程管理系统的统称，不单单可以实现审批流，还可以实现各种更为复杂的业务流程，如：数据同步等。

BPMN

BPMN（Business Process Model And Notation）， 业务流程模型和符号，由BPMI（Business Process Management Initiative）开发的一套标准的业务流程建模符号，使用BPMN 提供的符号可以创建业务流程。

更加容易理解的说，BPMN是实现BPM的一套标准，制定很多建模符号标准。

这里简单比喻一下，BPMN是一门语言，你可以用它去开发BPM系统。

后面会更加详细讲解 BPMN 的基础知识。

建模符号了解，可以放到下一章节分享。

工作流引擎选型

由于BPMN是市面主流的工作流标准， 那么市面绝大部分工作流引擎都是基于该标准去实现。下面罗列一下目前市面上主流的各种引擎：

• Osworkflow,一个轻量化的流程引擎，基于状态机机制，但不支持会签、跳转、退回、加签等这些操作，需要自己扩展开发，有一定难度，如果流程比较简单，osworkflow是很好的选择但该开源组件已过时，长时间没有版本升级了。
• JBPM, 以JBPM4版本作为分割点，JBPM5以后版本基于Drools Flow， JBPM4已停止维护，也不建议选择。
• Activiti, activiti5和activiti6是基于JBPM4开源，activiti7是基于6升级的，内核基本不变，但是由于Tijs Rademakers离开，谨慎选择。
• flowable, 基于activiti6衍生出来的版本，以flowable6.4.1版本为分水岭，大力发展其商业版产品，开源版本维护不及时，部分功能已经不再开源版发布，可以考虑选择。
• Camunda, Camunda基于activiti5，所以其保留了PVM，商业版本和开源版本功能相差不大，建议选择。

流程设计器选型

对于低代码平台中的流程可视化，流程设计器是重要的支撑工具，目前市场上比较主流的流程:

• bpmn-js,是 BPMN 2.0 渲染工具包和 Web 模型，使用 Web 建模工具可以很方便的构建 BPMN 图表，可以把 BPMN 图表嵌入到你的项目中，容易扩展。
• mxGraph是一个强大的JavaScript流程图前端库，由于mxGraph是一个开放的js绘图开发框架，我们可以开发出很炫的样式，或者完全按照项目需求定制。
• [Activiti-Modeler] Activiti 开源版本中带了web版流程设计器,界面不美观，用户体验差
• [flowable-modeler]flowable开源版本中带了web版流程设计器,界面不美观，用户体验差

建议选型

推荐大家使用Camunda（流程引擎）+bpmn-js（流程设计器）组合。

快速部署

选型后就是实战，推荐的选型都有很完整的安装部署文档，下面简单说一下部署步骤。

再次说明一下两者的区别：

• Camunda是工作流引擎，用来执行工作流模型文件任务，同时管理各种流程执行。
• bpmn-js是前端的流程设计器，基于bnpm标准实现，用来生成工作流模型文件。

Camunda部署

1. docker快速安装后端：

1
2

docker pull camunda/camunda-bpm-platform:run-latest
docker run -d --name camunda -p 8080:8080 camunda/camunda-bpm-platform:run-latest

2. 通过spring boot快速创建项目：
   更新pom.xml文件内容

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52

   <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>2.4.4</version> <relativePath/> <!-- lookup parent from repository --> </parent> <groupId>com.tencent</groupId> <artifactId>camunda_spring_boot</artifactId> <version>0.0.1-SNAPSHOT</version> <name>camunda_spring_boot</name> <description>camunda_spring_boot</description> <properties> <java.version>17</java.version> <camunda.spring-boot.version>7.15.0</camunda.spring-boot.version> </properties> <dependencies> <dependency> <groupId>org.camunda.bpm.springboot</groupId> <artifactId>camunda-bpm-spring-boot-starter-webapp</artifactId> <version>${camunda.spring-boot.version}</version> </dependency> <dependency> <groupId>com.h2database</groupId> <artifactId>h2</artifactId> </dependency> <dependency> <groupId>com.sun.xml.bind</groupId> <artifactId>jaxb-impl</artifactId> <version>2.2.3</version> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-test</artifactId> <scope>test</scope> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build> </project>

3. 修改登录用户配置， application.properties

   1 2 3 4 5 6 7

   camunda.bpm: admin-user: id: demo password: demo firstName: Demo filter: create: All tasks

4. 将bpmn-js操作好的xml文件保存到src/main/resources/loan-approval.bpmn

运行程序，访问http://localhost:8080/camunda/app/cockpit/default/#/dashboard，就可以看到相关任务。

后面是运行任务等，就不属于入门教程，可以放到后面教程慢慢学习。

bpmn-js部署

demo访问， 快速使用，代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <title>BPMNJS测试案例</title>
    
  <!-- 引入BPMN-JS的CSS文件 -->
  <link rel="stylesheet" href="https://unpkg.com/bpmn-js@11.1.0/dist/assets/diagram-js.css" />
  <link rel="stylesheet" href="https://unpkg.com/bpmn-js@11.1.0/dist/assets/bpmn-font/css/bpmn.css" />
</head>

<body>
  <div id="canvas" style="height:80vh;"></div>
  <!-- 引入BPMN-JS的JS文件 -->
  <script src="https://unpkg.com/bpmn-js@11.1.0/dist/bpmn-modeler.development.js"></script>
  <!-- xml文件 -->
  <script src="./bpmn.js"></script>
  <script>
    var bpmnModeler = new BpmnJS({
      container: '#canvas'
    });
		
    bpmnModeler.importXML(xml, function(err) {
	  if (err) {
        return console.error('failed to load diagram', err);
      }
    });
  </script>

总结

BPNM是大家统一认知的业务流建模标准，实现它的工作流引擎有很多，经过选型最终确定使用camunda + bpmn-js。

简单尝试一下，还是很简单实现了一个简单工作流管理系统，从设计工作流到工作流执行。

如果要真正用起来，还是需要发心思去了解BPNM的整体标准，以及camunda是如何运作执行的，同时需要将bpmn-js流程设计器。

参考资料

camunda Spring Boot项目

全网最详bpmn.js教材-http请求篇

赏

谢谢你请我吃糖果

支付宝

微信