Angular2 /打字稿和SSE(EventSource)

Question

首先,我对ng2和打字稿很新.

我想要完成的是在Angular2组件中实现Server-Sent事件.我已经按照earlies帖子中提到的示例进行了操作,但我的问题是"EventSource"对象无法识别(在VS Code中为红色下划线).

我不确定我是否遗漏了一些参考资料......我的参考文献是:

<!-- IE required polyfills, in this exact order -->
  <script src="node_modules/es6-shim/es6-shim.min.js"></script>
  <script src="node_modules/systemjs/dist/system-polyfills.js"></script>
  <script src="node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>
  <script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
  <script src="node_modules/systemjs/dist/system.src.js"></script>
  <script src="node_modules/rxjs/bundles/Rx.js"></script>
  <script src="node_modules/angular2/bundles/angular2.dev.js"></script>

这就是我实现eventsource客户端的方式:

   ngOnInit() {
      const observable = Observable.create(observer => {
        const eventSource = new EventSource(/API_URL); //Cannot find EventSource
        eventSource.onmessage = x => observer.next(x.data);
        eventSource.onerror = x => observer.error(x);

        return () => {
            eventSource.close();
        };
    });

    observable.subscribe({
        next: guid => {
            this.zone.run(() => this.someStrings.push(guid));
        },
        error: err => console.error('something wrong occurred: ' + err)
    });

Answer 1

事实上,TypeScript有两件事:

• 编译时间.编译器检查语法错误和类型.关于类型,它依赖于d.ts可以在描述对象/类的合同的文件中看到的文件.
• 执行时间.如果对象存在于您的执行环境中,则将执行代码.

在您的情况下,问题出在编译时.

以下是EventSource的d.ts文件示例:https://github.com/sbergot/orgmodeserver/blob/master/src/ts/deps/EventSource.d.ts

您可以通过以下方式获取它并在TypeScript文件的最开头引用它:

/// <reference path="../<path-to>EventSource.d.ts"/>

Answer 2

let eventSource = window['EventSource'];

TypeScript 不知道作为窗口一部分的 EventSource。所以你必须先提取。

参见：https : //github.com/OasisDigital/sse-a2-example/blob/master/src/app/sse.ts