2016-12-06 86 views
5

有人可以请我提供一个春启动服务器端事件的例子吗?角2弹簧引导服务器端事件

基本上我需要推动服务器端事件浏览器。我使用角度2和弹簧引导后端。 请为我提供1个示例示例,我无法找到好的示例。

@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中订阅此事件?

在此先感谢

回答

8

没有人回答,所以回答我自己的问题。

有一个弹簧安置控制器

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组件

终于做到这一点

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); 
     }); 
    } 
} 
+0

这是一个很大的帮助,谢谢! – jmw5598