为什么来自 Laravel echo 的 .listen 调用在我的 Angular 前端不起作用？

Question

我正在编写一些前端代码，试图使用 Pusher 和 laravel 监听 websocket。我无法触发监听事件。

我在页面中收到 websocket 信息：

请求URL: ws://localhost:6001/app/someKey?protocol=7&client=js&version=4.4.0&flash=false

这是我触发新事件时浏览器中的 websocket 输出：

channel: "chat"
data: "{"user":{"id":1,"name":"1","email":"1","balance":"79558.76450989","default_leverage":"20","used_margin":"3074.6057739400","email_verified_at":null,"is_fake":"yes","created_at":"2019-03-07 11:47:22","updated_at":"2019-04-08 10:54:02"},"message":{"id":82,"user_id":1,"group_id":1,"text":"test text here","created_at":"2019-04-08 10:55:21","updated_at":"2019-04-08 10:55:21"}}"
event: "App\Events\MessageSent"

这是我的 ts 代码 (ionic-v4):

import { Injectable } from '@angular/core';
import {Echo} from 'laravel-echo-ionic';

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

  echo:any;

  constructor( ) {
    console.log("Pusher Service");
    var pusher = require('pusher-js');
    this.echo = new Echo({
      broadcaster: 'pusher',
      wsHost: 'localhost',
      wsPort: 6001,
      key: 'someKey',
      encrypted: false,
      enabledTransports: ['ws'],
    });
    this.echo.channel('chat').listen('App\Events\MessageSent', (e) => { 
      console.log('got message')  ;
    });  
  }
}

我没有让控制台日志输出...任何人都可以帮助我吗？

Answer 1

好的，我已经开始工作了。

对于以后遇到此问题的其他人，您可以只收听该事件 'MessageSent'；你不需要完整的路径。即

    this.echo.channel('chat').listen('MessageSent', (e) => { 
      console.log('got message')  ;
    });

会起作用。

为什么来自 Laravel echo 的 .listen 调用在我的 Angular 前端不起作用？

Why is my .listen call from Laravel echo not working in my Angular frontend?

echo

websocket

ionic-framework

angular