Angular2/typcript и SSE (EventSource)

Question

Прежде всего, я новичок в ng2 и машинописи.

Я пытаюсь реализовать отправленные сервером события в компоненте Angular2. Я следовал за примерами, упомянутыми в предыдущих постах здесь, но моя проблема в том, что объект "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>

Вот как я реализовал клиент источника событий:

   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 Файлы, которые можно увидеть в файлах, описанных контрактами объектов / классов.
• Время выполнения. Если объект присутствует в вашей среде выполнения, код будет выполнен.

В вашем случае проблема во время компиляции.

Вот пример файла d.ts для EventSource: 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

Answer 3

Вам нужно указать, что EventSource является функцией окна, а также необходимо передать с ней параметр.

const eventSource = new window['EventSource']("http://url")