![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/355642186076122.png "
请问怎么实现？前后端怎么配合的？
目前主流推送方式是使用websocket技术。如果需要前后端websocket的代码，可以采纳后单独私信我。这个里面的大屏效果就是我用该技术前后端实现的。https://blog.csdn.net/luoxueyong/article/details/99335922
这篇实例中有提到如何实现前后端消息推送，可借鉴一二，链接：https://blog.csdn.net/qq_41858479/article/details/90598118
可以考虑使用以下思路：
1、后台使用Quartz定时任务查询待审批记录，调用公众号接口发送图文消息给指定用户，可以参考 https://www.cnblogs.com/misscole/p/12068239.html
2、用户点击图文消息中的连接跳转至对应的h5页面进行审批(这里可以考虑在url中拼接上临时token，或者要求用户登录)
3、在审批结果提交的过程中调用公众号接口，推送审批结果消息给指定人员。
从前端来说，基本都是通过websocket来实现。 通过websocket，客户端与服务端建立长连接。然后由服务端主动推送消息到客户端，客户端监听解析。
参考文章：https://blog.csdn.net/swk963/article/details/117912764。
但是看你需求来说，似乎用不到socket来通信，主要工作还是集中在服务端，集中在公众号模板消息这块。
参考文章：https://blog.csdn.net/yotcap/article/details/123091044
如有帮助，望采纳
package org.jeecg.modules.oa.mobile.msg.getui;
import com.alibaba.fastjson.JSONObject;
import com.getui.push.v2.sdk.ApiHelper;
import com.getui.push.v2.sdk.GtApiConfiguration;
import com.getui.push.v2.sdk.api.PushApi;
import com.getui.push.v2.sdk.api.StatisticApi;
import com.getui.push.v2.sdk.common.ApiResult;
import com.getui.push.v2.sdk.dto.CommonEnum;
import com.getui.push.v2.sdk.dto.req.Audience;
import com.getui.push.v2.sdk.dto.req.Settings;
import com.getui.push.v2.sdk.dto.req.Strategy;
import com.getui.push.v2.sdk.dto.req.message.PushBatchDTO;
import com.getui.push.v2.sdk.dto.req.message.PushChannel;
import com.getui.push.v2.sdk.dto.req.message.PushDTO;
import com.getui.push.v2.sdk.dto.req.message.PushMessage;
import com.getui.push.v2.sdk.dto.req.message.android.AndroidDTO;
import com.getui.push.v2.sdk.dto.req.message.android.GTNotification;
import com.getui.push.v2.sdk.dto.req.message.android.ThirdNotification;
import com.getui.push.v2.sdk.dto.req.message.android.Ups;
import com.getui.push.v2.sdk.dto.req.message.ios.Alert;
import com.getui.push.v2.sdk.dto.req.message.ios.Aps;
import com.getui.push.v2.sdk.dto.req.message.ios.IosDTO;
import com.getui.push.v2.sdk.dto.res.statistic.StatisticDTO;
import com.google.common.collect.Sets;
import org.jeecg.common.util.DateUtils;
import java.util.*;
public class AppInfo {
public PushApi pushApi;
public StatisticApi statisticApi;
public static final String CID = "fa0b6ef8c8ee7e30888db8e70641a4ed";
public static void main(String[] args) {
new AppInfo().test();//iso+安卓
}
public void getApi(){
GtApiConfiguration apiConfiguration = new GtApiConfiguration();
//填写应用配置
apiConfiguration.setAppId("XXXXXX");
apiConfiguration.setAppKey("XXxxxxx");
apiConfiguration.setMasterSecret("XXXXXx");
// 接口调用前缀，请查看文档: 接口调用规范 -> 接口前缀, 可不填写appId
apiConfiguration.setDomain("https://restapi.getui.com/v2/");
// 实例化ApiHelper对象，用于创建接口对象
ApiHelper apiHelper = ApiHelper.build(apiConfiguration);
// 创建对象，建议复用。目前有PushApi、StatisticApi、UserApi
pushApi = apiHelper.creatApi(PushApi.class);
statisticApi=apiHelper.creatApi(StatisticApi.class);
}
/*****************************************批量推送结束*****************************************/
public void test() {
getApi();
//根据cid进行单推
PushDTO<Audience> pushDTO = pushDTO();
// 设置接收人信息
Audience audience = new Audience();
pushDTO.setAudience(audience);
audience.addCid(CID);
// audience.setAll("all");
System.out.println("test:"+pushDTO.toString());
// 进行cid单推
ApiResult<Map<String, Map<String, String>>> apiResult = pushApi.pushToSingleByCid(pushDTO);
System.out.println(apiResult.toString());
if (apiResult.isSuccess()) {
// success
System.out.println("推送成功"+apiResult.getData());
} else {
// failed
System.out.println("推送失败code:" + apiResult.getCode() + ", msg: " + apiResult.getMsg());
}
}
private PushDTO<Audience> pushDTO() {
PushDTO<Audience> pushDTO = new PushDTO<Audience>();
pushDTO.setRequestId(System.currentTimeMillis() + "");
pushDTO.setGroupName("fl");
Settings settings = new Settings();
settings.setTtl(3600000);
//settings.setTtl(-1);
Strategy strategy = new Strategy();
strategy.setSt(1);
strategy.setDef(4);//默认走厂商通道，否则android应用打开时会导致打开应用失败
strategy.setIos(4);
settings.setStrategy(strategy);
pushDTO.setSettings(settings);
PushMessage pushMessage = new PushMessage();
GTNotification notification = new GTNotification();
notification.setTitle("收到通知");
notification.setBody("你1有一个待审核工作");
notification.setClickType(CommonEnum.ClickTypeEnum.TYPE_STARTAPP.type);//打开地址
notification.setUrl("http://www.baidu.com");
JSONObject payload =new JSONObject();
payload.put("openPage","/maildetail/1353550768530235394/receive/m");
payload.put("id","1355449428499136513");
notification.setPayload(payload.toJSONString());
System.out.println("参入参数"+payload.toJSONString());
pushMessage.setNotification(notification);
pushDTO.setPushMessage(pushMessage);
PushChannel pushChannel = new PushChannel();
AndroidDTO androidDTO = new AndroidDTO();
Ups ups = new Ups();
ThirdNotification thirdNotification = new ThirdNotification();
thirdNotification.setClickType(CommonEnum.ClickTypeEnum.TYPE_STARTAPP.type);
thirdNotification.setTitle("mailtitle3");
thirdNotification.setBody("mailcontent！");
ups.setNotification(thirdNotification);
//设置options 方式二
Map<String, Map<String,Object>> options = new HashMap<String, Map<String, Object>>();
Map<String,Object> all = new HashMap<String, Object>();
// all.put("channel","default");//添加默认channel导致小米手机无法收到消息
options.put("ALL",all);
ups.setOptions(options);
androidDTO.setUps(ups);
pushChannel.setAndroid(androidDTO);
IosDTO iosDTO = new IosDTO();
Aps aps = new Aps();
aps.setSound("default");//设置苹果的声音
Alert alert = new Alert();
alert.setTitle("消息title-" + System.currentTimeMillis());
alert.setBody("你有一个待审核工作");
aps.setAlert(alert);
iosDTO.setAps(aps);
//iphone 设置payLoad
//iosDTO.setPayload("{openPage:/index.html-ios#/modulecontrol,name:zhangsan,id:12342412412}");
iosDTO.setPayload(payload.toJSONString());
pushChannel.setIos(iosDTO);
pushDTO.setPushChannel(pushChannel);
return pushDTO;
}
}
实现H5项目的消息推送需要前后端配合。在前端，您可以使用JavaScript来实现消息推送。JavaScript提供了一个API，叫做WebSocket，它可以让您的H5项目和服务器进行实时通信。WebSocket API提供了一组API，允许您创建WebSocket连接，发送消息，接收消息，关闭连接等操作。
例如，如果您想要在H5项目中实现消息推送，可以使用下面的代码：
// 创建WebSocket连接
const ws = new WebSocket('wss://xxx.com/messages');
// 当收到消息时触发
ws.onmessage = (event) => {
// 处理收到的消息
};
// 当WebSocket连接关闭时触发
ws.onclose = (event) => {
// 处理连接关闭事件
};
// 发送消息
ws.send('hello');
在上面的代码中，我们使用WebSocket API来创建WebSocket连接，并设置了几个事件处理函数，用来处理收到的消息和连接关闭事件。我们还通过调用WebSocket对象的send方法来发送消息。
在后端，您需要提供一个WebSocket服务器，负责接收客户端的WebSocket连接，并处理客户端发送的消息。WebSocket服务器可以使用多种编程语言和框架。
1从前端来说，基本都是通过websocket来实现。 通过websocket，客户端与服务端建立长连接。然后由服务端主动推送消
我自己写的文章:https://editor.csdn.net/md/?articleId=124529301
2.还可以使用第三方,例如:极光推送 https://www.jiguang.cn/push?source=bdAd&plan=2&unit=506&keyword=26360&bd_vid=10804752393949379729
看描述应该是 通过微信公众号实现工作流进度通知处理，虽然可以scoket通信的方式实现实时通信，但看需求描述上其实并不需要前端做到这一步，而且也没必要做到这一步，后端做好流程逻辑控制，符合发送通知条件的就通过微信公众平台api接口给指定的用户发送图文消息，然后携带特定的信息用户点击进入对应的h5页面， 变更当前的任务审核状态进入下一个流程即可，前端h5功能越简单越好，核心功能要放在服务器，毕竟浏览器关了就没了