0
点赞
收藏
分享

微信扫一扫

springboot 之 “服务端推送事件SSE(server-send-events)”

ZGtheGreat 2021-09-21 阅读 60

>>>我的博客<<<

1.应用场景

当我们做异步请求处理的时候,客户端向服务端的请求不是立即返回的,而是在服务端有数据的时候才发送给客户端的。本例演示是服务端数据是另外的事件触发并推送给客户端的。

当使用微信或者支付宝扫码支付的时候,在客户支付成功之后,后台得到微信(支付宝)回调需要通知我们的客户端支付已经完成,客户端得到通知后可以做一些后续的操作。
这涉及到后台需要将支付成功的消息主动推送给客户端,让客户端记性后续的操作。

  • 客户端向后台(SseController->push)发送异步请求,客户端处于监听等待状态;
  • 微信(支付宝)支付成功后回调后台(SseController->payCallback模拟);
  • payCallback方法通过applicationContext.publishEvent向系统内部发送支付完成事件;
  • push方法通过payCompletedListener监听事件并通过SseEmitter发送给客户端。
    名词解释:SSE–server send event是一种服务端推送的技术,本例使用SseEmitter来实现。

2. 上代码

web api 接口类SseController

@RestController
public class SseController {

@Autowired
ApplicationContext applicationContext;
@Autowired
PayCompletedListener payCompletedListener;

@GetMapping("/push")
public SseEmitter push(@RequestParam Long payRecordId){
final SseEmitter emitter = new SseEmitter();
try {
payCompletedListener.addSseEmitters(payRecordId,emitter);
}catch (Exception e){
emitter.completeWithError(e);
}

return emitter;
}

@GetMapping("/pay-callback")
public String payCallback(@RequestParam Long payRecordId){
applicationContext.publishEvent(new PayCompletedEvent(this,payRecordId));
return "请到监听处查看消息";

}
}

支付完成事件 PayCompletedEvent

@Getter
@Setter
public class PayCompletedEvent extends ApplicationEvent {
private Long payRecordId;

public PayCompletedEvent(Object source, Long payRecordId) {
super(source);
this.payRecordId = payRecordId;
}
}

支付完成事件监听器PayCompletedListener

@Component
public class PayCompletedListener {
private static Map<Long,SseEmitter> sseEmitters = new Hashtable<>();

public void addSseEmitters(Long payRecordId, SseEmitter sseEmitter) {
sseEmitters.put(payRecordId, sseEmitter);
}

@EventListener
public void deployEventHandler(PayCompletedEvent payCompletedEvent) throws IOException {
Long payRecordId = payCompletedEvent.getPayRecordId();
SseEmitter sseEmitter = sseEmitters.get(payRecordId);
sseEmitter.send("支付成功");
sseEmitter.complete();

}
}

3. 效果演示

  • 先访问http://localhost:8080/push?payRecordId=123,此时客户端处于等待状态.

  • 再访问http://localhost:8080/pay-callback?payRecordId=123,模拟回调通知客户端支付成功,这是会通知上一步并推送到客户端.

4. 另外一个极简的例子

  • 服务端模拟servlet的一个get请求
import java.io.IOException;
import java.util.concurrent.TimeUnit;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
* Servlet implementation class SSE
*/

@WebServlet("/SSE")
public class SSE extends HttpServlet {
private static final long serialVersionUID = 1L;

/**
* @see HttpServlet#HttpServlet()
*/

public SSE() {
super();
// TODO Auto-generated constructor stub
}

/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
* response)
*/

protected void doGet(HttpServletRequest request,
HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/event-stream");
response.setCharacterEncoding("utf-8");

for (int i = 0; i < 5; i++) {
// 指定事件标识
response.getWriter().write("event:me\n");
// 格式: data: + 数据 + 2个回车
response.getWriter().write("data:" + i + "\n\n");
response.getWriter().flush();

try {
TimeUnit.SECONDS.sleep(1);
} catch (InterruptedException e) {
}
}

}

/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
* response)
*/

protected void doPost(HttpServletRequest request,
HttpServletResponse response)
throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}

}
  • 模拟客户端的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<script type="text/javascript">
// 初始化, 参数为url
// 依赖H5
var sse = new EventSource("SSE");

sse.onmessage = function(e) {
console.log("message", e.data, e);
}

// 监听指定事件, (就不会进入onmessage了)
sse.addEventListener("me", function(e) {
console.log("me event", e.data);
// 如果不关闭,会自动重连
if (e.data == 3) {
sse.close();
}
});
</script>
</body>
</html>
  • 效果


5.鸣谢

http://www.wisely.top/2018/03/01/sse-eventlistener/

举报

相关推荐

0 条评论