标签: laravel-echo

场景:客户可以将客户引荐给另一个客户.每个引用都需要存储在DB表行中.接收推荐的客户应该看到该活动的通知.

创建新的推荐并发送事件:

$totalRefers = [];

foreach ($array as $to) {
    $refer = new ClientReferral;
    $refer->user_id = $user_id;
    $refer->by = $by;
    $refer->to = $to;

    $refer->save();
    array_push($totalRefers, $refer);

    ReferralSent::dispatch($refer); // Here is the Event
}

return response()->json([
    'status' => 'Success',
    'message' => 'Client referred successfully to selected professionals.',
    'data' => $totalRefers
], 200);

事件broadcastOn()方法:

public function broadcastOn() {
    return new PrivateChannel('referral.' . $this->referral->id);
}

这个频道:

Broadcast::channel('referral.{id}', function ($user, $id) {
    // let's say it's true for the time being …

我正在为应用程序开发聊天/消息功能.当用户发送消息时,我希望触发并广播特定事件.我当时希望Laravel Echo使用pusher驱动程序通过Laravel Echo收听活动的广播频道.

我希望Laravel Echo实现在Vue组件中并检索通过事件广播的数据.目前,我无法将活动广播到私人频道或仅播放频道.

这是我做的:

1)添加配置到.env.

2)添加配置为bootstrap.js:

window.Echo = new Echo({
  broadcaster: 'pusher',
  key: 'mykey',
  encypted: false
});

3)添加了auth签入App\Providers\BroadcastServiceProvider(如果用户现在已登录,则返回true):

Broadcast::channel('chat', function ($user) {
  // verify that user is recipient of message
  return \Auth::check();
});

4)添加App\Providers\BroadcastServiceProvider::class,到App/config/app.php.

5)创建了App\Events\UserSentMessage一个PrivateChannel以命名方式广播的事件chat.我也尝试过广播Channel.我检查过事件是event()在控制器中调用助手时触发的,它似乎没有被广播.我也试过broadcast在提到的控制器中使用该方法.

6)在mountedVue生命周期钩子中的有效Vue组件中添加了以下内容(组件按预期呈现数据等,只是不与Laravel Echo atm一起使用):

    Echo.private('chat').listen('UserSentMessage', (data) => {
                console.log(data);
            }, (e) => {
                console.log(e);
            });

也尝试过:

     Echo.channel('chat').listen('UserSentMessage', (data) …

这是我的server.js档案:

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
var Redis = require('ioredis');
var redis = new Redis();

http.listen(3000, function(){
    console.log('Listening on Port 3000');
});

redis.psubscribe('*', function(err, count) {
    console.log(err, count);
});
redis.on('pmessage', function(subscribed, channel, message) {
    message = JSON.parse(message);
    io.emit(message.event, channel, message.data);
});

一个简单的事件:

class FieldWasUpdated implements ShouldBroadcast
{
    use InteractsWithSockets, SerializesModels;
    public $instance;
    public $key;
    public $value;

    public function __construct($instance, $key, $value)
    {
        $this->instance = $instance;
        $this->key = $key;
        $this->value = $value; …

我正在使用 laravel-echo-server 并且一切正常，如果我使用以下命令启动服务器：

laravel-echo-server start

我懂了：

LARAVE选择服务器

版本 1.2.8

Starting server...

?  Running at localhost on port 3001
?  Channels are ready.
?  Listening for http events...
?  Listening for redis events...

Server ready!

但是如果我用 ctrl+c 关闭服务器已经被杀死了！如果我使用这个命令，同样的事情：

laravel-echo-server start &

如果我断开 ssh 连接，服务器将停止工作！

如何在后台模式下启动？

谢谢！

我正在遵循https://medium.com/@dennissmink/laravel-echo-server-how-to-24d5778ece8b 中给出的教程。

我安装了laravel-echo-server, redis, socket.io, laravel-echo。

这是配置 laravel-echo-server init

{
    "authHost": "http://localhost",
    "authEndpoint": "/broadcasting/auth",
    "clients": [],
    "database": "redis",
    "databaseConfig": {
        "redis": {},
        "sqlite": {
            "databasePath": "/database/laravel-echo-server.sqlite"
        }
    },
    "devMode": true,
    "host": null,
    "port": "6001",
    "protocol": "http",
    "socketio": {},
    "secureOptions": 67108864,
    "sslCertPath": "",
    "sslKeyPath": "",
    "sslCertChainPath": "",
    "sslPassphrase": "",
    "subscribers": {
        "http": true,
        "redis": true
    },
    "apiOriginAllow": {
        "allowCors": false,
        "allowOrigin": "",
        "allowMethods": "",
        "allowHeaders": ""
    }
}

这个js代码app.blade.php在所有页面的底部

<script type="module">
    import …

我正在尝试使用 Laravel Echo 请求发送一些数据

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: 'somekey',
    wsHost: '127.0.0.1',
    wsPort: 6001,
    encrypted: false,
    disableStats: true,
    forceTLS: false,
    authEndpoint: 'http://127.0.0.1:8000/broadcasting/auth',

    'form-data': {          // I tried data, dataForm, dataform
        someData: '123',    // this doesn't seem to work                
    },                  
});

我已经看到如何向请求添加自定义标头

auth: {
    headers: {
          token: '123'
    }
}

有没有办法以类似的方式添加表单数据？

编辑

当我在 DevTools 中检查网络请求时，我可以看到formDataEcho 向服务器发送了两个属性。所以我认为必须有一种方法可以将附加属性附加到现有formData对象中

有没有办法使用没有Laravel框架和NPM的Laravel-echo库？只需使用<script>标签并将库添加到我的项目中.

我已将 Laravel 设置为使用 Pusher 为 Laravel Echo 发送事件，但我从 Artisan 控制台触发的事件无法到达 Pusher。我从推送器调试控制台触发的事件工作正常，因此前端部分没问题。vagrant VM 会干扰它吗？

我的 .env 文件

QUEUE_DRIVER=sync
...
PUSHER_KEY=<key>
PUSHER_SECRET=<secret>
PUSHER_APP_ID=<app_id>

我的广播.php

'default' => env('BROADCAST_DRIVER', 'pusher'),
...
'connections' => [

    'pusher' => [
        'driver'  => 'pusher',
        'key'     => env('PUSHER_KEY'),
        'secret'  => env('PUSHER_SECRET'),
        'app_id'  => env('PUSHER_APP_ID'),
        'options' => [
            'cluster'   => 'eu',
            'encrypted' => true
        ],
    ],
    ...
]

事件：

class NewMessage implements ShouldBroadcast
{
    public function broadcastOn()
    {
         return [new Channel('chat.'.$this->conversation->id)];
    }
}

该事件是从 Observer 类触发的，该类观察模型created事件。

public function …

在我的 TaskList.vue 中，我有以下代码：

<template>
    <div>
        <ul>
            <li v-for="task in tasks" v-text="task"></li>
        </ul>

        <input type="text" v-model="newTask" @blur="addTask">
    </div>
</template>

<script>  
    export default {
        data(){
            return{
                tasks: [],
                newTask: ''
            }
        },

        created(){
            axios.get('tasks')
            .then(
                response => (this.tasks = response.data)
            );

            Echo.channel('task').listen('TaskCreated', (data) => {
                this.tasks.push(data.task.body);
            });
        },

        methods:{
            addTask(){
                axios.post('tasks', { body: this.newTask })

                this.tasks.push(this.newTask);

                this.newTask = '';
            }
        }
    }
</script>

当我点击 axios.post('tasks') 端点时，我在当前选项卡中得到了重复的结果，我输入了该值，而另一个选项卡只有 1 个正确的值。

为了避免这种情况，我尝试使用 broadcast(new TaskCreated($task))->toOthers();

或者

I put $this->dontBroadcastToCurrentUser() in the construct of my TaskCreated.php

However, …

我正在使用 Pusher Laravel Webaockets 包的替换。

在我的应用程序中 Laravel Echo 尝试连接 v\xc3\xada wss 而不是 ws，因此失败。

我的资源/js/bootstrap.js：

import Echo from \'laravel-echo\'\nwindow.Pusher = require(\'pusher-js\');\n\nwindow.Echo = new Echo({\n    broadcaster: \'pusher\',\n    key: process.env.MIX_PUSHER_APP_KEY,\n    cluster: process.env.MIX_PUSHER_APP_CLUSTER,\n    wsHost: window.location.hostname,\n    wsPort: 6001,\n    disableStats: true,\n    encrypted: false,\n    enabledTransports: [\'ws\'],\n});\n

config/broadcasting.php 中的广播连接：

\'pusher\' => [\n            \'driver\' => \'pusher\',\n            \'key\' => env(\'PUSHER_APP_KEY\'),\n            \'secret\' => env(\'PUSHER_APP_SECRET\'),\n            \'app_id\' => env(\'PUSHER_APP_ID\'),\n            \'options\' => [\n                \'cluster\' => env(\'PUSHER_APP_CLUSTER\'),\n                \'encrypted\' => false,\n                \'host\' => \'127.0.0.1\',\n                \'port\' => 6001,\n                \'scheme\' => \'http\',\n            ],\n …