情景：

由于activiti与系统应用主题样式出入较大，协商后决定将activiti的editor-app放在前台。

ps:内网开发，无图，凭记忆摘取主要内容。

步骤：

将activiti放在public即静态目录下。
通过iframe在相应的前台工作流界面引入activiti的model.html（最外层的主html，名字可能有出入）。
mounted时将this，即vuecompoennt对象赋值给iframe，这样可以在保存后进行页面切换，或者某个接口回调后控制vue界面的状态。
```
mounted(){
    this.$refs.iframe.contentWindow.vue=this
}
```

因为涉及到了权限问题，而通过iframe引入的页面本身不会跟我们系统的请求头一致，需要在页面主html文件加上下面一段代码。

//model.html
<script>
    (
    function(open){
    XMLHttpRequest.prototype.open = function(method,url,async,user,pass){
        open.call(this,method,url,async,user,pass);//this指XMLHttpRequest
        this.setRequestHeader("token",window.vue.token);//mounted时传入的token
    }
}
)(XMLHttpRequest.prototype.open)
</script>

配置下url的config文件，通过network调试查看那个接口有问题，在activiti文件目录全局搜对应问题。
至此，已完成接入。

开发途中遇到的问题：

1.请求与vue不共享，不带请求头，需要手动在文件里扩展XMLHttpRequest。

2.X/JSON报错，不影响开发。

3.有个{model}/json的接口获取编辑器配置内容，起初因后台缺少某个json格式的文件，导致无法展示界面。

VUE集成activit工作流

情景：

步骤：