Angular 2 Spring Boot 服务器端事件 [英] Angular 2 spring boot server side events
本文介绍了Angular 2 Spring Boot 服务器端事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
有人可以为我提供 Spring Boot 服务器端事件的示例吗?
Can somebody please provide me an example for spring boot server side events?
基本上我需要将服务器端事件推送到浏览器.我正在使用 angular 2 和 Spring Boot 后端.请提供 1 个示例示例,我找不到好的示例.
Basically I need to push server side events to browser. I'm using angular 2 and spring boot backend. Please provide me 1 sample example, I'm unable to find good examples.
@Controller
public class SSEController {
private final List<SseEmitter> emitters = new ArrayList<>();
@RequestMapping(path = "/stream", method = RequestMethod.GET)
public SseEmitter stream() throws IOException {
SseEmitter emitter = new SseEmitter();
emitters.add(emitter);
emitter.onCompletion(() -> emitters.remove(emitter));
return emitter;
}
}
如何在 Angular 2 中从服务器持续推送数据以及如何订阅此事件?
How to push data continuously from server and how to subscribe to this event in Angular 2?
推荐答案
有一个 Spring Rest 控制器
Have a Spring Rest controller
SseController.java
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.mvc.method.annotation.SseEmitter;
import java.io.IOException;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
@RestController
public class SSEController {
public static final List<SseEmitter> emitters = Collections.synchronizedList( new ArrayList<>());
@RequestMapping(path = "/stream", method = RequestMethod.GET)
public SseEmitter stream() throws IOException {
SseEmitter emitter = new SseEmitter();
emitters.add(emitter);
emitter.onCompletion(() -> emitters.remove(emitter));
return emitter;
}
}
ServiceClass.java
public void sendSseEventsToUI(Notification notification) { //your model class
List<SseEmitter> sseEmitterListToRemove = new ArrayList<>();
SSEController.emitters.forEach((SseEmitter emitter) -> {
try {
emitter.send(notification, MediaType.APPLICATION_JSON);
} catch (IOException e) {
emitter.complete();
sseEmitterListToRemove.add(emitter);
e.printStackTrace();
}
});
SSEController.emitters.removeAll(sseEmitterListToRemove);
}
最后在 Angular2 组件中做这个
finally in Angular2 component do this
notification.component.ts
import {Component, OnInit} from '@angular/core';
declare let EventSource:any;
@Component({
selector: 'notification-cmp',
templateUrl: 'notification.component.html'
})
export class NotificationComponent implements OnInit {
connect(): void {
let source = new EventSource('http://localhost:8080/stream');
source.addEventListener('message', message => {
let n: Notification; //need to have this Notification model class in angular2
n = JSON.parse(message.data);
console.log(message.data);
});
}
}
这篇关于Angular 2 Spring Boot 服务器端事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文