Соедините Angular 9 с Фениксом. js - PullRequest
Новая
       64

Соедините Angular 9 с Фениксом. js

0 голосов
/ 01 мая 2020

Я пытаюсь подключить Angular 9 в качестве клиента с phoenix. js для подключения к существующему каналу Phoenix.

Сначала я создал приложение angular через команду cli, и я скачал Phoenix через npm install phoenix. Затем я добавил путь к Phoenix в angular.json 

 "scripts": [
              "./node_modules/phoenix/priv/static/phoenix.js"
            ]

Затем я создал службу 

import { Injectable } from '@angular/core';
import { Phoenix } from 'phoenix';

declare var Socket: any;  // there is no typescript version of the package available so we cannot use a compile time import
declare var Phoenix: any;

@Injectable({
  providedIn: 'root'
})
export class PhoenixService {

  socket: any;

  constructor() {
    let socket = new Phoenix.Socket("wss://api.catalx.io/markets", {params: {}})
    socket.connect()

    let channel = socket.channel("updates:CAD-BTC", {})
    channel.on("new_msg", msg => console.log("Got message", msg) )
    channel.join()
      .receive("ok", ({messages}) => console.log("catching up", messages) )
      .receive("error", ({reason}) => console.log("failed join", reason) )
      .receive("timeout", () => console.log("Networking issue. Still waiting..."))
    channel.push("fetch", "market_state")
  }
}

Наконец, вызвал эту службу в AppComponent

export class AppComponent {

  constructor(private phoenixService: PhoenixService) {
    phoenixService.socket.connect();
  }
}

В результате я получаю

core. js: 6237 ОШИБКА TypeError: Невозможно прочитать свойство 'connect' undefined в новом AppComponent (app.component.ts: 14)

phoenix. js: 1 Сбой подключения WebSocket к 'wss: //api.catalx.io/markets/websocket? Vsn = 2.0.0': ошибка при рукопожатии WebSocket: непредвиденный код ответа: 403

Наверное, я сталкиваюсь с этими ошибками, потому что PhoenixService не может захватить phoenix.js? Маленькая помощь приветствуется!

1 Ответ

1 голос
/ 01 мая 2020

Я думаю, что так и должно быть, и вам не нужно добавлять js в "скрипты", если вы устанавливаете его с "npm i -S phoenix"

не имеете доступа для тестирования с помощью catalx 

import { Injectable } from '@angular/core';
import { Socket as PhoenixSocket } from 'phoenix';

export const WEBSOCKET_SERVER_URI = 'wss://api.catalx.io/markets';

@Injectable({
  providedIn: 'root'
})
export class PhoenixService {
  phoenixSocket: PhoenixSocket;

  constructor() {
    this.phoenixSocket = new PhoenixSocket(
      WEBSOCKET_SERVER_URI,
      {
        params: {},
      }
    );
    this.phoenixSocket.connect();
  }
}
...