Angular 7,服务器发送事件未接收事件/数据

问题描述

我尝试了类似的问题/答案,但没有帮助。我能够与NodeJS服务器建立连接,但发布时无法获取数据。 角度服务:

import { Injectable,ngzone } from "@angular/core";
import { Observable } from "rxjs";
import { NativeEventSource,EventSourcepolyfill } from 'event-source-polyfill';
import * as ES from '../../assets/js/eventsource.min.js'

@Injectable({
  providedIn: "root"
})
export class SseService {
  constructor(private _zone: ngzone) {}

  getServerSentEvent(url: string): Observable<any> {
    return Observable.create(observer => {
      const eventSource = this.getEventSource(url);
     eventSource.onmessage = (event) => {console.log('sse event',event); observer.next(JSON.parse(event.data))};
    });
  }

  private getEventSource(url: string): EventSource {
    return new ES.EventSource(url,{withCredentials:true});
  }
}

角度组件

ngOnInit() {
  this.sseService
      .getServerSentEvent("https://192.168.0.100:64726/events")
      .subscribe(data=> console.log("SSE"+ data),error=> console.log("SSE",error))
      
      console.log('init SSE')
}

服务器代码(节点js):

///SSE

// Middleware for GET /events endpoint
function eventsHandler(req,res,next) {
  // Mandatory headers and http status to keep connection open
  const headers = {
    'Access-Control-Allow-Origin': 'https://192.168.0.100.xip.io:4200','Access-Control-Allow-Credentials':true,'Content-Type': 'text/event-stream','Connection': 'keep-alive','Cache-Control': 'no-cache'
  };
  
  const clientId = Date.Now();
  const newClient = {
    id: clientId,res
  };
  clients.push(newClient);
  req.on('close',() => {
    console.log(`${clientId} Connection closed`);
    clients = clients.filter(c => c.id !== clientId);
  });

  res.writeHead(200,headers);
  res.setTimeout(0); 
  res.write('\n');
  res.flush()
  
}
function sendEventsToAll(newnest) {
  clients.forEach(c => {console.log("written ",c ); console.log("Data",newnest); c.res.write(JSON.stringify({data: newnest}));c.res.write('\n\n'); c.res.flush()})
}
async function addnest(req,next) {
  console.log('nest add called')
  const newnest = req.body;
  nests.push(newnest);
  // Send recently added nest as POST result
  res.json(newnest)
  // Invoke iterate and send function
  return sendEventsToAll(newnest);
}

app.post('/nest',addnest);
app.get('/events',eventsHandler);
app.get('/status',(req,res) => res.json({clients: clients.length}));
let clients = [];
let nests = [{data:"test"}];

我使用CURL命令发布数据,使用chrome浏览器,当我点击事件URL时,我能够直接接收数据,并且面临Angular无法接收数据的问题。

curl -X POST  -H "Content-Type: application/json"  -d '{"momma": "swas://192.168.0.100:64726/nest -kerature": 31}' -s

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)