springboot项目集成activiti-modeler工作流，页面设计器部署到项目中

XIN XIN WEI

已于 2024-01-26 10:26:04 修改

阅读量2.8k

点赞数 4

分类专栏： activit工作引擎文章标签： spring boot java 后端

于 2023-07-06 14:20:56 首次发布

本文链接：https://blog.csdn.net/qq_44033725/article/details/131569666

版权

activit工作引擎专栏收录该内容

2 篇文章 3 订阅

订阅专栏

接着上篇文章idea插件画流程图，这种方法在项目中会使用但是用起来感觉不方便，需要将吧bpmn、png文件保存在一个固定的路径下，部署此文件。

而本篇文章不需要，只需要在项目页面中画好流程，直接部署流程。具体操作需要用到

activiti源码，改动部分代码即可。这里是5.22.0版本，下载好的在下方链接直接下载就好。

https://pan.baidu.com/s/1MU_uALvU_nB1piNq3ihrJA?pwd=bovw

1、将Activiti-activiti-5.22.0\modules\activiti-webapp-explorer2\src\main\webapp下的三个文件放到resources的static中

2、将Activiti-activiti-5.22.0\modules\activiti-webapp-explorer2\src\main\resources的json文件放到resources的static中

3、Activiti-activiti-5.22.0\modules\activiti-modeler\src\main\java\org\activiti\rest\editor这两个文件夹下的java文件放到com.atxinxin.activiti下

整体目录结构（包名自己定义就好）

完成以上步骤，需要修改ModelEditorJsoRestResource.java、ModelSaveResource.java、StencilsetRestResource.java

添加@RequestMapping("/activiti-explorer/service")

例：

修改 StencilsetRestResource.java文件

@RestController
@RequestMapping("/activiti-explorer/service")
public class StencilsetRestResource {
  
  @RequestMapping(value="/editor/stencilset", method = RequestMethod.GET, produces = "application/json;charset=utf-8")
  public @ResponseBody String getStencilset() {
    InputStream stencilsetStream = this.getClass().getClassLoader().getResourceAsStream("static/stencilset.json");
    try {
      return IOUtils.toString(stencilsetStream, "utf-8");
    } catch (Exception e) {
      throw new ActivitiException("Error while loading stencil set", e);
    }
  }
}

在此所有文件修改完成。

接下来配置端口、数据源、等等

--- 先来activiti的数据源配置文件

/**
 * @author weixinxin
 * @Description actityti数据源配置
 * @Date 11:22 2023/07/06
 */
@Configuration
public class ActitytiDataSourceConfig extends AbstractProcessEngineAutoConfiguration {


    @Bean(name = "activitiDataSource")
    @ConfigurationProperties(prefix = "spring.datasource")
    public DataSource activitiDataSource(){
        System.out.println("-------------------------");
        return new DruidDataSource();

    }

    @Bean
    public PlatformTransactionManager transactionManager() {
        return new DataSourceTransactionManager(activitiDataSource());
    }

    @Bean
    public SpringProcessEngineConfiguration springProcessEngineConfiguration() {
        SpringProcessEngineConfiguration configuration = new SpringProcessEngineConfiguration();
        configuration.setDataSource(activitiDataSource());
        configuration.setDatabaseSchemaUpdate(ProcessEngineConfiguration.DB_SCHEMA_UPDATE_TRUE);
        configuration.setJobExecutorActivate(true);
        configuration.setTransactionManager(transactionManager());
        return configuration;
    }

}

--- application-dev.properties配置文件

server.port=9999
spring.datasource.validationQuery=select 1 from dual
spring.datasource.driverClassName = com.mysql.cj.jdbc.Driver
spring.datasource.url = jdbc:mysql://localhost:3306/activiti?useUnicode=true&characterEncoding=utf-8&useSSL=false&&allowPublicKeyRetrieval=true&serverTimezone=Asia/Shanghai
spring.datasource.password = 123456
spring.datasource.username= root

# &nullCatalogMeansCurrent=true?????

mybatis.mapper-locations=classpath:com/atxinxin/mapper/*.xml  #mybatis??
spring.activiti.check-process-definitions = false
#spring.activiti.database-schema-update=false
logging.file.name=log.log
logging.pattern.level=debug

security.basic.enabled=false

--- 启动类

/**
 * @author weixinxin
 * @Description 启动类
 * @Date 11:26 2023/07/06
 */
@Slf4j
@SpringBootApplication(exclude = {org.springframework.boot.autoconfigure.security.servlet.SecurityAutoConfiguration.class, org.activiti.spring.boot.SecurityAutoConfiguration.class})
public class ActivitiDemlApplication {

    public static void main(String[] args) {
        SpringApplication.run(ActivitiDemlApplication.class, args);
        log.info("---- 启动成功 !! ----------");
    }

}

以上就是所有的准备工作

接下来需要写测试类进行测试。

1、先创建模型，跳转到流程编辑页面

2、部署流程

3、启动流程

4、提交任务（完成任务）


/**
 * @author weixinxin_ext 2023-07-06
 **/
@Controller
@Slf4j
@RequestMapping("/activiti-explorer/service")
public class MyActivitiController {


    @Resource
    private RepositoryService repositoryService;

    /**
     * @Description 创建模型
     * @author weixinxin
     * @Date 18:12 2023/6/30
     **/
    @RequestMapping(value = "/create")
    public void create(HttpServletRequest request, HttpServletResponse response) throws IOException {
        String id = "";
        String name = "出差申请-Travel approval process";
        String description = "出差申请-Travel approval process";
        String key = "travel_approval_process";
        ObjectMapper objectMapper = new ObjectMapper();
        ObjectNode editorNode = objectMapper.createObjectNode();
        editorNode.put("id", "canvas");
        editorNode.put("resourceId", "canvas");
        ObjectNode stencilSetNode = objectMapper.createObjectNode();
        stencilSetNode.put("namespace", "http://b3mn.org/stencilset/bpmn2.0#");
        editorNode.put("stencilset", stencilSetNode);
        Model modelData = this.repositoryService.newModel();
        ObjectNode modelObjectNode = objectMapper.createObjectNode();
        modelObjectNode.put("name", name);
        modelObjectNode.put("revision", 1);
        description = StringUtils.defaultString(description);
        modelObjectNode.put("description", description);
        modelData.setMetaInfo(modelObjectNode.toString());
        modelData.setName(name);
        modelData.setKey(StringUtils.defaultString(key));
        this.repositoryService.saveModel(modelData);
        this.repositoryService.addModelEditorSource(modelData.getId(), editorNode.toString().getBytes("utf-8"));
        id = modelData.getId();

        //一定要输出id，部署需要，刚接触activiti不知道这个id在哪里
        System.out.println("id ========= " + id);
        response.sendRedirect("/modeler.html?modelId=" + id);
    }

    /**
     * @param id 
     * @Description 发布模型为流程定义
     * @Date 14:04 2023/07/06
     * @author weixinxin
     */
    @RequestMapping("/deploy/{id}")
    @ResponseBody
    public void deploy(@PathVariable("id") String id) throws Exception {
        Model modelData = repositoryService.getModel(id);
        byte[] bytes = repositoryService.getModelEditorSource(modelData.getId());
        JsonNode modelNode = new ObjectMapper().readTree(bytes);
        BpmnModel model = new BpmnJsonConverter().convertToBpmnModel(modelNode);
        if (model.getProcesses().size() == 0) {
            log.error("数据模型不符要求，请至少设计一条主线流程。");
        }
        byte[] bpmnBytes = new BpmnXMLConverter().convertToXML(model);
        String processName = modelData.getName() + ".bpmn20.xml";
        repositoryService.createDeployment()
                .name(modelData.getName())
                .addString(processName, new String(bpmnBytes, "UTF-8"))
                .deploy();
    }
    /**
     * @param keyName 
     * @Description 启动流程
     * @Date 14:03 2023/07/06
     * @author weixinxin
     */
    @RequestMapping("/start/{key}")
    @ResponseBody
    public Object startProcess(@PathVariable("key") String keyName) {
        ProcessInstance process = processEngine.getRuntimeService().startProcessInstanceByKey(keyName);

        return process.getId() + " : " + process.getProcessDefinitionId();
    }

    /**
     * @param processInstanceId 流程实例id
     * @Description 提交任务
     * @Date 14:03 2023/07/06
     * @author weixinxin
     */
    @RequestMapping("/run/{processInstanceId}")
    @ResponseBody
    public Object run(@PathVariable("processInstanceId") String processInstanceId) {
        Task task = processEngine.getTaskService().createTaskQuery().processInstanceId(processInstanceId).singleResult();
        System.out.println("task {} find " + task.getId());
        processEngine.getTaskService().complete(task.getId());
        return "SUCCESS";
    }
}

创建模型，流程编辑页面

以上完成测试类编写，开始测试

1、创建模型，跳转流程设计页面

http://localhost:9999/activiti-explorer/service/create

2、部署流程（id换成自己的）

http://localhost:9999/activiti-explorer/service/deploy/id

3、启动流程（key换成自己的）

http://localhost:9999/activiti-explorer/service/start/key

4、完成任务（流程实例id换成自己的）
http://localhost:9999/activiti-explorer/service/run/processInstanceId

1、当创建模型，跳转流程设计页面时，创建完成流程图点击保存会发现返回的状态码为400

http://localhost:9999/activiti-explorer/service/create

在看一下返回的信息

在ModelSaveResource.java中

后端接受参数,可以看到需要（MultiValueMap<String,String> values）

@RequestMapping(value = "/model/{modelId}/save", method = RequestMethod.PUT)
    @ResponseStatus(value = HttpStatus.OK)
    public void saveModel(@PathVariable String modelId, @RequestBody MultiValueMap<String, String> values)

前端传参（删除了许多，为了方便看需要哪些参数）可以看到（是 json_xml，svg_xml，name，descriotin）

json_xml: {"resourceId":"5007","properties":{}
svg_xml: <svg xmlns="http://www.w3.org/2000/svg" </svg>
name: 请假申请-Leave approval process
description: 请假申请-Leave approval process

这就需要我们来修改ModelSaveResource.java中的saveModel方法

/**
 * @Description 保存模型
 * @Date 15:52 2023/07/07
 * @author weixinxin
 */
@RequestMapping(value = "/model/{modelId}/save", method = RequestMethod.PUT)
    @ResponseStatus(value = HttpStatus.OK)
    public void saveModel(@PathVariable String modelId,
                          @RequestParam("json_xml") String json_xml,
                          @RequestParam("svg_xml") String svg_xml,
                          @RequestParam("name") String name,
                          @RequestParam("description") String description) {
        try {

            Model model = repositoryService.getModel(modelId);

            ObjectNode modelJson = (ObjectNode) objectMapper.readTree(model.getMetaInfo());

            modelJson.put(MODEL_NAME, name);
            modelJson.put(MODEL_DESCRIPTION, description);
            model.setMetaInfo(modelJson.toString());
            model.setName(name);

            repositoryService.saveModel(model);

            repositoryService.addModelEditorSource(model.getId(), json_xml.getBytes("utf-8"));

            InputStream svgStream = new ByteArrayInputStream(svg_xml.getBytes("utf-8"));
            TranscoderInput input = new TranscoderInput(svgStream);

            PNGTranscoder transcoder = new PNGTranscoder();
            // Setup output
            ByteArrayOutputStream outStream = new ByteArrayOutputStream();
            TranscoderOutput output = new TranscoderOutput(outStream);

            // Do the transformation
            transcoder.transcode(input, output);
            final byte[] result = outStream.toByteArray();
            repositoryService.addModelEditorSourceExtra(model.getId(), result);
            outStream.close();

        } catch (Exception e) {
            LOGGER.error("Error saving model", e);
            throw new ActivitiException("Error saving model", e);
        }
    }

按理说这是activiti的源码，传参和接受参数应该一样，但是为什么不一样需要找到前端的方法看一下，目前因为时间问题，没时间看，到时候有时间，找到原因我在补充吧！

看了一下原因，如果不想修改后端接受收参数，那就修改一下请求方式，

后端：put 修改为 post
@RequestMapping(value = "/model/{modelId}/save", method = RequestMethod.POST)
前端：static/editor-app/configuration/toolbar-default-actions.js文件中
$scope.save = function (successCallback)
这个方法的请求方式修改为post
$http({    method: 'POST',
            data: params,
            ignoreErrors: true,
            headers: {'Accept': 'application/json',
                      'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
            transformRequest: function (obj) {
                var str = [];
                for (var p in obj) {
                    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
                }
                return str.join("&");
            },
            url: KISBPM.URL.putModel(modelMetaData.modelId)})
这样就不需要修改接收参数就可以保存流程模型了