本帖最后由 徐晓峰 于 2024-6-15 17:58 编辑
关于使用报表脚本代码实现道一云表单API接口推送数据的实现方案
一、技术逻辑及应用场景说明
技术逻辑说明:报表系统有着高度自定义查询、填报、统计数据的设计能力,表单有着覆盖全员能力的灵活审批能力,如果打通报表和表单的数据接口应用问题,就可以实现使用报表获取ERP等第三方封闭系统的数据,再套用表单的审批流能力,来实现实时获取信息系统的数据,并用于推送和审批。
应用场景说明: ①仓库领料单:通过移动端报表实时获取ERP系统的物料数据,并将相关数据规范填写后,推送到表单的审批流,实现领料的物料数据复用和领料流程的管控。 ②延伸应用场景(本方案未直接实现延伸应用,仅做场景思路拓展):仓库领料后,可以使用类似思路,实现表单提交后,使用回调地址,触发ERP的出库API接口,完成ERP系统出库数据自动填写。(使用报表嵌套表单审批能力,或者报表触发WebAPI接口能力,可以延伸信息系统直接的联动能力,在一定程度上,解决多系统之间的信息孤岛问题。)
二、报表触发表单API接口推送数据实现过程
1、在报表前端通过JavaScript脚本,推送WebApi接口所需参数数据,过程是模仿Postman接口推送能力,主要实现思路和代码如下
① 报表前端的设计页面截图
② 触发事件按钮的完整JavaScript代码
- fetch('http://192.168.1.9:3000/api/proxy', {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json'
- },
- body: JSON.stringify({
- url: 'https://qwif.do1.com.cn/qwcgi/api/apiForm/pushFormData.do', // 实际的目标API的URL
- method: 'GET', // 使用GET方法,因为这是查询参数
- qs: {
- token: 'YjhjOTBiZDktNTYwZC00NjhjLTk3ZjYtNmMyOGE1Zjc0MDll',
- corpId: 'wx3f99f213ef30cbc8',
- id: 'formc943399e01d344948ec5ed62e9ec779b',
- isFlow: '1',
- data: JSON.stringify([{
- "creator": "110001",
- "fieldMap": {
- "fo5d3d7ff7b7e543d287433ab84bf99aef": [{
- "fo504156d875ed4c23bc1aa546b9f45384": "代码1",
- "fob988fb86e643406984abf492cc2a2bd4": "仓位1",
- "fof3177861b1b2434b956579b1fcb5eb3d": "名称1",
- "fo7eab7731ae0e4a2d8290b8586eba8aea": "型号1",
- "foe71156f1b93b45bf983f4db49ddf0315": "1",
- "fod64a2e625ecd43ba871370532c6f5413": ""
- },
- {
- "fo504156d875ed4c23bc1aa546b9f45384": "代码2",
- "fob988fb86e643406984abf492cc2a2bd4": "仓位2",
- "fof3177861b1b2434b956579b1fcb5eb3d": "名称2",
- "fo7eab7731ae0e4a2d8290b8586eba8aea": "型号2",
- "foe71156f1b93b45bf983f4db49ddf0315": "2",
- "fod64a2e625ecd43ba871370532c6f5413": ""
- },
- {
- "fo504156d875ed4c23bc1aa546b9f45384": "代码3",
- "fob988fb86e643406984abf492cc2a2bd4": "仓位3",
- "fof3177861b1b2434b956579b1fcb5eb3d": "名称3",
- "fo7eab7731ae0e4a2d8290b8586eba8aea": "型号3",
- "foe71156f1b93b45bf983f4db49ddf0315": "3",
- "fod64a2e625ecd43ba871370532c6f5413": ""
- }
- ]
- },
- "isAnonymous": "0"
- }])
- }
- })
- })
- .then(response => response.json())
- .then(data => console.log(data))
- .catch(error => console.error('Error:', error));
复制代码 2、浏览器跨域访问存在(CROS安全限制),这里设置了node.js代理服务器转发WebApi接口,服务端代码如下:
- const express = require('express');
- const cors = require('cors');
- const fetch = require('node-fetch');
- const app = express();
- app.use(express.json());
- app.use(cors());
- // 通用代理请求
- app.post('/api/proxy', async (req, res) => {
- const { url, method, qs } = req.body;
- try {
- const response = await fetch(`${url}?${new URLSearchParams(qs).toString()}`, {
- method: method,
- headers: {
- 'Content-Type': 'application/json'
- }
- });
- const data = await response.json();
- res.json(data);
- } catch (error) {
- res.status(500).json({ error: error.message });
- }
- });
- app.listen(3000, () => {
- console.log('Node.js代理服务器已启动,监听端口3000');
- });
复制代码
3、在报表点击按钮后,将数据传送到表单,并推送消息到指定员工手机的效果截图
① 点击按钮,触发接口推送数据
② 浏览器前端,可以通过审查元素查看推送效果,显示成功
③ 手机端收到了1条领料申请单的推送数据消息
④ 已经将报表中的相关数据,直接推送到了表单审批流程中
|